diff options
| author | Daniel Schadt <kingdread@gmx.de> | 2022-07-11 14:50:43 +0200 |
|---|---|---|
| committer | Daniel Schadt <kingdread@gmx.de> | 2022-07-11 14:50:43 +0200 |
| commit | 187fcd6b5a642931fb4584c0ba8099df5b96470d (patch) | |
| tree | c520c804cec077e99da2d71f1b1f661e41f77a4a | |
| parent | dc105234b5861a7b663a5bd3d6903980eed830ea (diff) | |
| download | fietsboek-187fcd6b5a642931fb4584c0ba8099df5b96470d.tar.gz fietsboek-187fcd6b5a642931fb4584c0ba8099df5b96470d.tar.bz2 fietsboek-187fcd6b5a642931fb4584c0ba8099df5b96470d.zip | |
better styling for friend buttons in track edit
The big button with the large padding looked kind of silly, so now the
button is slimmer and the text is actually centered.
| -rw-r--r-- | fietsboek/static/theme.css | 15 | ||||
| -rw-r--r-- | fietsboek/templates/edit_form.jinja2 | 6 |
2 files changed, 18 insertions, 3 deletions
diff --git a/fietsboek/static/theme.css b/fietsboek/static/theme.css index 32ef02b..831b1f6 100644 --- a/fietsboek/static/theme.css +++ b/fietsboek/static/theme.css @@ -36,6 +36,21 @@ strong { max-width: 400px; } +.friendlist-control { + padding: 0px; + display: flex; + align-items: center; +} + +.friendlist-control button { + border-top-right-radius: 0px; + border-bottom-right-radius: 0px; +} + +.friendlist-control span { + padding-left: 1em; +} + .list-group.list-group-root { padding: 0; overflow: hidden; diff --git a/fietsboek/templates/edit_form.jinja2 b/fietsboek/templates/edit_form.jinja2 index b43e5d5..3779d5d 100644 --- a/fietsboek/templates/edit_form.jinja2 +++ b/fietsboek/templates/edit_form.jinja2 @@ -41,7 +41,7 @@ <div>{{ _("page.track.form.tagged_people") }}</div> <ul class="list-group" id="taggedFriends"> {% for friend in friends %} - <li class="list-group-item"> + <li class="list-group-item friendlist-control"> <button type="button" class="btn btn-danger remove-friend-button"><i class="bi bi-x-square-fill"></i></button> <input name="tagged-friend[]" value="{{ friend.id }}" type="hidden"> <span class="friend-name">{{ friend.name }}</span> @@ -58,11 +58,11 @@ </div> <!-- Hidden templates for Javascript to use --> <div style="display: none;"> - <li class="list-group-item" id="friendSearchBlueprint"> + <li class="list-group-item friendlist-control" id="friendSearchBlueprint"> <button type="button" class="btn btn-success"><i class="bi bi-plus-square-fill"></i></button> <span class="friend-name"></span> </li> - <li class="list-group-item" id="friendAddedBlueprint"> + <li class="list-group-item friendlist-control" id="friendAddedBlueprint"> <button type="button" class="btn btn-danger remove-friend-button"><i class="bi bi-x-square-fill"></i></button> <input name="tagged-friend[]" type="hidden" disabled> <span class="friend-name"></span> |