Mercurial > libervia-templates

annotate sat_templates/templates/bulma/components/block.html @ 390:38635d393089

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
bulma (chat/reactions): use a special style for reactions made by the user.
author Goffi <goffi@goffi.org>
date Wed, 13 Dec 2023 22:01:46 +0100
parents dc83f45625b3
children
Ignore whitespace changes - Everywhere: Within whitespace: At end of lines:
rev   line source
230
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
1 {% macro separator(label, align='center') %}
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
2 {# display a bloc separator
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
3 @param label(unicode): label to show
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
4 @param align(unicode): one of "left", "center", "right"
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
5 #}
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
6 <div class="block_separator">
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
7 {% if align in ('center', 'right') %}
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
8 <div class="block_separator__line"></div>
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
9 {% endif %}
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
10 <div class="block_separator__label">
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
11 {{label}}
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
12 </div>
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
13 {% if align in ('center', 'left') %}
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
14 <div class="block_separator__line"></div>
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
15 {% endif %}
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
16 </div>
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
17 {% endmacro %}
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
18
299
75f1cd6da46e bulma (components/block): new `data` and `delete_icon` arguments in `icon_item`
Goffi <goffi@goffi.org>
parents: 245
diff changeset
19 {% macro icon_item(icon_name, label, url, class="", delete_icon=false, data=none) %}
75f1cd6da46e bulma (components/block): new `data` and `delete_icon` arguments in `icon_item`
Goffi <goffi@goffi.org>
parents: 245
diff changeset
20 <div class="column is-2-desktop is-4-touch item" {% if data %}data-item='{{data|tojson}}'{% endif %}>
230
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
21 <div class="card {{class}}">
388
dc83f45625b3 bulma (file, components): fix color fo icons:
Goffi <goffi@goffi.org>
parents: 325
diff changeset
22 <a href="{{url}}" class="">
dc83f45625b3 bulma (file, components): fix color fo icons:
Goffi <goffi@goffi.org>
parents: 325
diff changeset
23 <div class="card-image has-text-centered has-text-dark">
230
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
24 {{ icon(icon_name, cls='image is-64x64 is-inline-block') }}
299
75f1cd6da46e bulma (components/block): new `data` and `delete_icon` arguments in `icon_item`
Goffi <goffi@goffi.org>
parents: 245
diff changeset
25 {% if delete_icon %}
75f1cd6da46e bulma (components/block): new `data` and `delete_icon` arguments in `icon_item`
Goffi <goffi@goffi.org>
parents: 245
diff changeset
26 <button class="delete action_delete is-small is-top-right"></button>
75f1cd6da46e bulma (components/block): new `data` and `delete_icon` arguments in `icon_item`
Goffi <goffi@goffi.org>
parents: 245
diff changeset
27 {% endif %}
230
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
28 </div>
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
29 <div class='card-content has-text-centered has-text-shortenable is-paddingless'>
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
30 <span>{{label}}</span>
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
31 </div>
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
32 </a>
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
33 </div>
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
34 </div>
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
35 {% endmacro %}
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
36
300
2a697b1376f1 bulma (components/block): disco entities's `icon_name` is used as icon when available:
Goffi <goffi@goffi.org>
parents: 299
diff changeset
37 {% macro disco_icon_grid(disco_entities, default_icon_name) %}
230
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
38 {# display discovered entities in a grid
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
39 @param disco_entities: entities which mush have a name and url key or attribute
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
40 @param icon_name: name of a defined icon
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
41 #}
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
42 <div class="columns">
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
43 {% for disco_entity in disco_entities %}
300
2a697b1376f1 bulma (components/block): disco entities's `icon_name` is used as icon when available:
Goffi <goffi@goffi.org>
parents: 299
diff changeset
44 {{ icon_item(disco_entity.icon_name or default_icon_name, disco_entity.name, disco_entity.url) }}
230
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
45 {% endfor %}
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
46 </div>
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
47 {% endmacro %}
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
48
325
8c779fb46384 bulma (components/block): interests_grid is more customisable:
Goffi <goffi@goffi.org>
parents: 300
diff changeset
49 {% macro interests_grid(interests, default_icon_name, delete_icon=true) %}
230
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
50 {# display list of interests
325
8c779fb46384 bulma (components/block): interests_grid is more customisable:
Goffi <goffi@goffi.org>
parents: 300
diff changeset
51
8c779fb46384 bulma (components/block): interests_grid is more customisable:
Goffi <goffi@goffi.org>
parents: 300
diff changeset
52 Can be called, in which call caller is called with 2 arguments:
8c779fb46384 bulma (components/block): interests_grid is more customisable:
Goffi <goffi@goffi.org>
parents: 300
diff changeset
53 - part: par to fill, can be "header-title" or "content"
8c779fb46384 bulma (components/block): interests_grid is more customisable:
Goffi <goffi@goffi.org>
parents: 300
diff changeset
54 - interest: current interest
230
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
55 @param interests: list of interests
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
56 @param default_icon_name: name of a defined icon to use when no thumb_url is available
325
8c779fb46384 bulma (components/block): interests_grid is more customisable:
Goffi <goffi@goffi.org>
parents: 300
diff changeset
57 @param delete_icon: unset to remove the icon
230
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
58 #}
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
59 <div class="columns is-multiline">
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
60 {% for interest in interests %}
245
10278ba367a2 bulma (photo/discover): design for the new theme + create button + delete button
Goffi <goffi@goffi.org>
parents: 230
diff changeset
61 <div class="column is-4 item" data-item='{{interest|tojson}}'>
10278ba367a2 bulma (photo/discover): design for the new theme + create button + delete button
Goffi <goffi@goffi.org>
parents: 230
diff changeset
62 <div class="card">
10278ba367a2 bulma (photo/discover): design for the new theme + create button + delete button
Goffi <goffi@goffi.org>
parents: 230
diff changeset
63 <div class="card-header">
325
8c779fb46384 bulma (components/block): interests_grid is more customisable:
Goffi <goffi@goffi.org>
parents: 300
diff changeset
64 <div class="card-header-title">
8c779fb46384 bulma (components/block): interests_grid is more customisable:
Goffi <goffi@goffi.org>
parents: 300
diff changeset
65 {% if caller is defined %}
8c779fb46384 bulma (components/block): interests_grid is more customisable:
Goffi <goffi@goffi.org>
parents: 300
diff changeset
66 {{ caller("header-title", interest) }}
8c779fb46384 bulma (components/block): interests_grid is more customisable:
Goffi <goffi@goffi.org>
parents: 300
diff changeset
67 {% endif %}
8c779fb46384 bulma (components/block): interests_grid is more customisable:
Goffi <goffi@goffi.org>
parents: 300
diff changeset
68 </div>
8c779fb46384 bulma (components/block): interests_grid is more customisable:
Goffi <goffi@goffi.org>
parents: 300
diff changeset
69 {% if delete_icon %}
8c779fb46384 bulma (components/block): interests_grid is more customisable:
Goffi <goffi@goffi.org>
parents: 300
diff changeset
70 <div class="card-header-icon"><button class="delete action_delete"></button></div>
8c779fb46384 bulma (components/block): interests_grid is more customisable:
Goffi <goffi@goffi.org>
parents: 300
diff changeset
71 {% endif %}
245
10278ba367a2 bulma (photo/discover): design for the new theme + create button + delete button
Goffi <goffi@goffi.org>
parents: 230
diff changeset
72 </div>
10278ba367a2 bulma (photo/discover): design for the new theme + create button + delete button
Goffi <goffi@goffi.org>
parents: 230
diff changeset
73 <div class="card-image is-photo-thumbnail-container is-flex has-items-centered has-background-light">
10278ba367a2 bulma (photo/discover): design for the new theme + create button + delete button
Goffi <goffi@goffi.org>
parents: 230
diff changeset
74 <a href="{{interest.url}}">
230
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
75 {% if interest.thumb_url %}
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
76 <img class="is-photo-thumbnail" src="{{interest.thumb_url}}">
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
77 {% else %}
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
78 <div class="is-photo-thumbnail">
388
dc83f45625b3 bulma (file, components): fix color fo icons:
Goffi <goffi@goffi.org>
parents: 325
diff changeset
79 {{ icon(default_icon_name, "image is-128x128 has-text-dark") }}
230
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
80 </div>
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
81 {% endif %}
245
10278ba367a2 bulma (photo/discover): design for the new theme + create button + delete button
Goffi <goffi@goffi.org>
parents: 230
diff changeset
82 </a>
10278ba367a2 bulma (photo/discover): design for the new theme + create button + delete button
Goffi <goffi@goffi.org>
parents: 230
diff changeset
83 </div>
10278ba367a2 bulma (photo/discover): design for the new theme + create button + delete button
Goffi <goffi@goffi.org>
parents: 230
diff changeset
84 <div class="card-content has-text-centered x-is-hoverable">
325
8c779fb46384 bulma (components/block): interests_grid is more customisable:
Goffi <goffi@goffi.org>
parents: 300
diff changeset
85 {% if caller is defined %}
8c779fb46384 bulma (components/block): interests_grid is more customisable:
Goffi <goffi@goffi.org>
parents: 300
diff changeset
86 {{ caller("content", interest) }}
8c779fb46384 bulma (components/block): interests_grid is more customisable:
Goffi <goffi@goffi.org>
parents: 300
diff changeset
87 {% else %}
8c779fb46384 bulma (components/block): interests_grid is more customisable:
Goffi <goffi@goffi.org>
parents: 300
diff changeset
88 <a href="{{interest.url}}">
8c779fb46384 bulma (components/block): interests_grid is more customisable:
Goffi <goffi@goffi.org>
parents: 300
diff changeset
89 <span><em>{{ interest.name|default(_("unnamed")) }}</em></span>
8c779fb46384 bulma (components/block): interests_grid is more customisable:
Goffi <goffi@goffi.org>
parents: 300
diff changeset
90 </a>
8c779fb46384 bulma (components/block): interests_grid is more customisable:
Goffi <goffi@goffi.org>
parents: 300
diff changeset
91 {% endif %}
245
10278ba367a2 bulma (photo/discover): design for the new theme + create button + delete button
Goffi <goffi@goffi.org>
parents: 230
diff changeset
92 </div>
230
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
93 </div>
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
94 </div>
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
95 {% endfor %}
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
96 </div>
0e69b5843c2f theme: bulma theme first draft:
Goffi <goffi@goffi.org>
parents:
diff changeset
97 {% endmacro %}