diff options
Diffstat (limited to 'tpl')
| -rw-r--r-- | tpl/index.pug | 2 | ||||
| -rw-r--r-- | tpl/objects/menu.pug | 11 |
2 files changed, 10 insertions, 3 deletions
diff --git a/tpl/index.pug b/tpl/index.pug index fa9bd85..510e09b 100644 --- a/tpl/index.pug +++ b/tpl/index.pug | |||
| @@ -476,7 +476,7 @@ html | |||
| 476 | +rule(level='medium') | 476 | +rule(level='medium') |
| 477 | 477 | ||
| 478 | +box | 478 | +box |
| 479 | div(style={ display: 'flex', gap: '2rem' }) | 479 | div(style={ display: 'flex', gap: '3rem' }) |
| 480 | +menu | 480 | +menu |
| 481 | +menu-header= 'Category 1' | 481 | +menu-header= 'Category 1' |
| 482 | +menu-item= 'Mark as away' | 482 | +menu-item= 'Mark as away' |
diff --git a/tpl/objects/menu.pug b/tpl/objects/menu.pug index 7c9c07e..97a571d 100644 --- a/tpl/objects/menu.pug +++ b/tpl/objects/menu.pug | |||
| @@ -1,12 +1,19 @@ | |||
| 1 | include icon.pug | 1 | include icon.pug |
| 2 | include status-indicator.pug | 2 | include status-indicator.pug |
| 3 | include action-button.pug | ||
| 3 | 4 | ||
| 4 | mixin menu | 5 | mixin menu |
| 5 | .o-menu | 6 | .o-menu |
| 6 | block | 7 | block |
| 7 | 8 | ||
| 8 | mixin menu-item | 9 | mixin menu-item |
| 9 | button.o-menu__item(disabled=attributes.disabled) | 10 | - |
| 11 | let classes = { | ||
| 12 | 'o-menu__item': true, | ||
| 13 | 'is-selected': attributes.selected, | ||
| 14 | } | ||
| 15 | |||
| 16 | button(class=classes, disabled=attributes.disabled) | ||
| 10 | .l-card.l-card--flush | 17 | .l-card.l-card--flush |
| 11 | if attributes.icon | 18 | if attributes.icon |
| 12 | .l-card__block.o-menu__icon-slot | 19 | .l-card__block.o-menu__icon-slot |
| @@ -14,7 +21,7 @@ mixin menu-item | |||
| 14 | +status-indicator(attributes.icon)(class='o-menu__icon') | 21 | +status-indicator(attributes.icon)(class='o-menu__icon') |
| 15 | else | 22 | else |
| 16 | +icon(attributes.icon)(class='o-menu__icon') | 23 | +icon(attributes.icon)(class='o-menu__icon') |
| 17 | .l-card__block.l-card__block--main | 24 | .l-card__block.l-card__block--main&attributes({ class: attributes.contentClass }) |
| 18 | block | 25 | block |
| 19 | if attributes.postIcon | 26 | if attributes.postIcon |
| 20 | .l-card__block.o-menu__icon-slot | 27 | .l-card__block.o-menu__icon-slot |
