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

Remove duplicated markup between list/grid photo cards.

Browse source
This commit is contained in:
voussoir 2018-12-27 15:30:30 -08:00
parent 669247415f
commit 6dcf47cab7
2 changed files with 35 additions and 48 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
frontends/etiquette_flask/static/css/photo_card.css
View file

@ -137,13 +137,13 @@
min-width: 100%; min-width: 100%;
width: 0; width: 0;
max-height: 30px;
background-color: inherit; background-color: inherit;
word-break: break-word; word-break: break-word;
} }
.photo_card_grid .photo_card_filename .photo_card_grid .photo_card_filename
{ {
align-self: start; align-self: start;
max-height: 30px;
font-size: 12.8px; font-size: 12.8px;
} }
.photo_card_list .photo_card_filename .photo_card_list .photo_card_filename

51
frontends/etiquette_flask/templates/photo_card.html
View file

@ -15,15 +15,25 @@
} }
%} %}
{% macro create_photo_card(photo, view="grid") %} {% macro create_photo_card(photo, view="grid") %}
{% set view = (view if view in ("list", "grid") else "grid") %}
{% if view == "list" %} {% set metadata_inner = "" %}
<div class="photo_card photo_card_list photo_card_unselected" data-id="{{photo.id}}"> {% if photo.width %}
{% set metadata_inner = "{m}{w}&times;{h}, ".format(m=metadata_inner, w=photo.width, h=photo.height) %}
{% endif %}
{% if photo.duration %}
{% set metadata_inner = "{m}{d}, ".format(m=metadata_inner, d=photo.duration_string) %}
{% endif -%}
<div class="photo_card photo_card_{{view}} photo_card_unselected" data-id="{{photo.id}}">
<input type="checkbox" class="photo_card_selector_checkbox" onclick="photo_clipboard.on_photo_select(event)"/> <input type="checkbox" class="photo_card_selector_checkbox" onclick="photo_clipboard.on_photo_select(event)"/>
<span class="photo_card_filename"><a target="_blank" href="/photo/{{photo.id}}">{{photo.basename}}</a></span> <div class="photo_card_filename"><a target="_blank" href="/photo/{{photo.id}}">{{photo.basename}}</a></div>
<a class="photo_card_metadata" target="_blank" href="{{photo|file_link}}">{{photo.bytestring}}</a> <span class="photo_card_metadata">
</div> {{- metadata_inner|safe -}}
{% else -%} <a target="_blank" href="{{photo|file_link}}">{{photo.bytestring}}</a>
</span>
{% if view == "grid" %}
{% if photo.thumbnail %} {% if photo.thumbnail %}
{% set thumbnail_src = "/thumbnail/" + photo.id + ".jpg" %} {% set thumbnail_src = "/thumbnail/" + photo.id + ".jpg" %}
{% else %} {% else %}
@ -47,32 +57,9 @@
{% else %} {% else %}
{% set tag_names_inner = "" %} {% set tag_names_inner = "" %}
{% endif -%} {% endif -%}
<a class="photo_card_thumbnail" target="_blank" href="/photo/{{photo.id}}"><img src="{{thumbnail_src}}"></a>
{% set metadata_inner = "" %}
{% if photo.width %}
{% set metadata_inner = "{m}{w}&times;{h}, ".format(m=metadata_inner, w=photo.width, h=photo.height) %}
{% endif %}
{% if photo.duration %}
{% set metadata_inner = "{m}{d}, ".format(m=metadata_inner, d=photo.duration_string) %}
{% endif -%}
<div class="photo_card photo_card_grid photo_card_unselected" data-id="{{photo.id}}">
<a class="photo_card_thumbnail" target="_blank" href="/photo/{{photo.id}}">
<img src="{{thumbnail_src}}">
</a>
<div class="photo_card_filename">
<a target="_blank" href="/photo/{{photo.id}}">{{photo.basename}}</a>
</div>
<span class="photo_card_tags" title="{{tag_names_title}}">{{tag_names_inner}}</span> <span class="photo_card_tags" title="{{tag_names_title}}">{{tag_names_inner}}</span>
<span class="photo_card_metadata">
{{- metadata_inner|safe -}}
<a target="_blank" href="{{photo|file_link}}">{{photo.bytestring}}</a>
</span>
<input type="checkbox" class="photo_card_selector_checkbox" onclick="photo_clipboard.on_photo_select(event)"/>
</div>
{% endif %} {% endif %}
</div>
{% endmacro %} {% endmacro %}