diff options
Diffstat (limited to 'tpl/objects')
-rw-r--r-- | tpl/objects/dialog.pug | 36 | ||||
-rw-r--r-- | tpl/objects/menu.pug | 7 |
2 files changed, 36 insertions, 7 deletions
diff --git a/tpl/objects/dialog.pug b/tpl/objects/dialog.pug index 0ee52df..3a47b2f 100644 --- a/tpl/objects/dialog.pug +++ b/tpl/objects/dialog.pug | |||
@@ -4,15 +4,39 @@ include heading.pug | |||
4 | include action-button.pug | 4 | include action-button.pug |
5 | 5 | ||
6 | mixin dialog(title) | 6 | mixin dialog(title) |
7 | .o-dialog.t-raised | 7 | - const slots = {} |
8 | |||
9 | mixin slot(key) | ||
10 | - slots[key] = block | ||
11 | |||
12 | - | ||
13 | block ? block() : undefined | ||
14 | |||
15 | let classes = { | ||
16 | 'o-dialog': true, | ||
17 | 't-raised': true, | ||
18 | 'o-dialog--split': !!slots.sidebar, | ||
19 | } | ||
20 | |||
21 | let bodyClass = { | ||
22 | 'o-dialog__body': true | ||
23 | } | ||
24 | if (attributes.bodyClass) { | ||
25 | bodyClass[attributes.bodyClass] = true; | ||
26 | } | ||
27 | |||
28 | div(class=classes) | ||
29 | if slots.sidebar | ||
30 | .o-dialog__sidebar | ||
31 | - slots.sidebar() | ||
8 | header.o-dialog__header | 32 | header.o-dialog__header |
9 | +div-heading('lg')(class='o-dialog__title') | 33 | +div-heading('lg')(class='o-dialog__title') |
10 | = title | 34 | = title |
11 | +action-button(round=true quiet=true icon='x' class='o-dialog__close-btn') | 35 | section(class=bodyClass) |
12 | +rule('medium')(class='o-dialog__rule') | 36 | +action-button(round=true quiet=true icon='x' class='o-dialog__close-btn') |
13 | section.o-dialog__body | 37 | if slots.body |
14 | block | 38 | - slots.body() |
15 | footer.o-dialog__footer.l-button-group | 39 | footer.o-dialog__footer.l-button-group |
16 | +a-button(outline=true)= 'Cancel' | 40 | +a-button(outline=true)= 'Cancel' |
17 | = ' ' | 41 | = ' ' |
18 | +a-button(outline=true variant='primary')= 'Continue' | 42 | +a-button(variant='accent')= 'Continue' |
diff --git a/tpl/objects/menu.pug b/tpl/objects/menu.pug index 0a654ce..84321d7 100644 --- a/tpl/objects/menu.pug +++ b/tpl/objects/menu.pug | |||
@@ -3,7 +3,12 @@ include status-indicator.pug | |||
3 | include action-button.pug | 3 | include action-button.pug |
4 | 4 | ||
5 | mixin menu | 5 | mixin menu |
6 | .o-menu | 6 | - |
7 | let classes = { | ||
8 | 'o-menu': true, | ||
9 | } | ||
10 | |||
11 | div(class=classes)&attributes(attributes) | ||
7 | block | 12 | block |
8 | 13 | ||
9 | mixin menu-item | 14 | mixin menu-item |