voussoir/etiquette
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Add class photos_holder which is centers photos in narrow mode.

Browse source 
In narrow mode, it's very possible to wind up with only 1 photo per row,
and it looks silly when they are left-justified. Centered looks a little
more natural to me in this case.
This commit is contained in:
voussoir 2020-11-04 17:11:48 -08:00
parent d536974025
commit 7770f7640a
3 changed files with 8 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
frontends/etiquette_flask/static/css/common.css
View file

@ -12,6 +12,12 @@
{ {
--narrow: 1; --narrow: 1;
} }
.photos_holder
{
display: flex;
justify-content: center;
flex-wrap: wrap;
}
} }
.hidden .hidden

2
frontends/etiquette_flask/templates/album.html
View file

@ -253,7 +253,7 @@ const ALBUM_ID = undefined;
{% set photos = album.get_photos() %} {% set photos = album.get_photos() %}
{% if photos %} {% if photos %}
<div id="hierarchy_photos" class="panel"> <div id="hierarchy_photos" class="photos_holder panel">
<h3>{{photos|length}} Photos</h3> <h3>{{photos|length}} Photos</h3>
<div id="photo_list"> <div id="photo_list">
{% for photo in photos|sort(attribute='basename', case_sensitive=False) %} {% for photo in photos|sort(attribute='basename', case_sensitive=False) %}

2
frontends/etiquette_flask/templates/search.html
View file

@ -371,7 +371,7 @@
{{prev_next_buttons()}} {{prev_next_buttons()}}
<div id="search_results_holder"> <div id="search_results_holder" class="photos_holder">
{% for result in results %} {% for result in results %}
{% if result.__class__.__name__ == 'Photo' %} {% if result.__class__.__name__ == 'Photo' %}
{{photo_card.create_photo_card(result, view=search_kwargs["view"])}} {{photo_card.create_photo_card(result, view=search_kwargs["view"])}}