Mercurial > libervia-templates
annotate sat_templates/templates/bulma/components/block.html @ 325:8c779fb46384
bulma (components/block): interests_grid is more customisable:
- new `delete_icon` argument can be set to `false` if delete icon is not desired
- the macro can now be called, the caller then get 2 arguments: part to customise and
current interest. Part to customise can be:
* `header-title`: markup to put in the title
* `content`: car content (replaces the default `interest.name`)
| author | Goffi <goffi@goffi.org> |
|---|---|
| date | Sat, 01 May 2021 18:44:47 +0200 |
| parents | 2a697b1376f1 |
| children | dc83f45625b3 |
| rev | line source |
|---|---|
| 230 | 1 {% macro separator(label, align='center') %} |
| 2 {# display a bloc separator | |
| 3 @param label(unicode): label to show | |
| 4 @param align(unicode): one of "left", "center", "right" | |
| 5 #} | |
| 6 <div class="block_separator"> | |
| 7 {% if align in ('center', 'right') %} | |
| 8 <div class="block_separator__line"></div> | |
| 9 {% endif %} | |
| 10 <div class="block_separator__label"> | |
| 11 {{label}} | |
| 12 </div> | |
| 13 {% if align in ('center', 'left') %} | |
| 14 <div class="block_separator__line"></div> | |
| 15 {% endif %} | |
| 16 </div> | |
| 17 {% endmacro %} | |
| 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 | 21 <div class="card {{class}}"> |
| 22 <a href="{{url}}"> | |
| 23 <div class="card-image has-text-centered"> | |
| 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 | 28 </div> |
| 29 <div class='card-content has-text-centered has-text-shortenable is-paddingless'> | |
| 30 <span>{{label}}</span> | |
| 31 </div> | |
| 32 </a> | |
| 33 </div> | |
| 34 </div> | |
| 35 {% endmacro %} | |
| 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 | 38 {# display discovered entities in a grid |
| 39 @param disco_entities: entities which mush have a name and url key or attribute | |
| 40 @param icon_name: name of a defined icon | |
| 41 #} | |
| 42 <div class="columns"> | |
| 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 | 45 {% endfor %} |
| 46 </div> | |
| 47 {% endmacro %} | |
| 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 | 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 | 55 @param interests: list of interests |
| 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 | 58 #} |
| 59 <div class="columns is-multiline"> | |
| 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 | 75 {% if interest.thumb_url %} |
| 76 <img class="is-photo-thumbnail" src="{{interest.thumb_url}}"> | |
| 77 {% else %} | |
| 78 <div class="is-photo-thumbnail"> | |
| 79 {{ icon(default_icon_name, "image is-128x128") }} | |
| 80 </div> | |
| 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 | 93 </div> |
| 94 </div> | |
| 95 {% endfor %} | |
| 96 </div> | |
| 97 {% endmacro %} |