diff options
-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> |