diff sat_templates/templates/bulma/photo/item.html @ 243:2b8d18a9df00

bulma (photo/album): change for dynamic content: - added drop zone and file selector to upload photos - moved item template to its own file, so it can be used for dynamic content - added delete button - changes to manage progression bar and other stuff
author Goffi <goffi@goffi.org>
date Fri, 19 Jun 2020 17:57:13 +0200
parents
children 40fccd3b7cf0
line wrap: on
line diff
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/sat_templates/templates/bulma/photo/item.html	Fri Jun 19 17:57:13 2020 +0200
@@ -0,0 +1,38 @@
+<div class="column is-4 item" data-item='{{file|tojson}}'>
+    <div class="card x-is-hoverable">
+        <div class="card-image is-photo-thumbnail-container is-flex has-items-centered has-background-light">
+            <a href="{{file.url}}" class="is-wrapping">
+                <img class="is-photo-thumbnail" src="{{file.thumb_url}}" alt="{{file.name}}">
+            </a>
+        </div>
+        <div class="card-content" onclick="clicked_mh_fix('{{'comments_panel'|next_gidx}}')">
+            <div class="level">
+                <div class="level-left">
+                    <div class="level-item is-size-7 x-is-hoverable-primary action_delete">
+                        {{ icon('trash-empty', cls='icon is-small') }}
+                    </div>
+                </div>
+                <div class="level-right">
+                    <div class="level-item is-size-7">
+                        {% if file.comments_url is defined %}
+                            {% if file.comments_count %}
+                                <span class='comments__count'>{{file.comments_count}} </span>
+                            {% endif %}
+                            {{ icon('comment-empty', cls='icon is-small') }}
+                        {% endif %}
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+    {% if uploading %}
+        <progress class="progress is-info mt-4 has-background-white" value="0" max="100">0%</progress>
+    {% else %}
+        <div id='{{'comments_panel'|cur_gidx}}' class="mt-4 panel-drawer">
+            {{ blog.show_items(file.comments, expanded=true, dates_fmt='relative') }}
+            <div class="comment_post mt-4">
+                {{- textbox.comment_or_login(service=file.comments_service, node=file.comments_node) -}}
+            </div>
+        </div>
+    {% endif %}
+</div>