summaryrefslogtreecommitdiffstats
path: root/tpl/objects
diff options
context:
space:
mode:
Diffstat (limited to 'tpl/objects')
-rw-r--r--tpl/objects/action-button.pug34
-rw-r--r--tpl/objects/badge.pug37
-rw-r--r--tpl/objects/button.pug27
-rw-r--r--tpl/objects/card.pug18
-rw-r--r--tpl/objects/dialog.pug6
-rw-r--r--tpl/objects/divider.pug2
-rw-r--r--tpl/objects/field-label.pug2
-rw-r--r--tpl/objects/icon-nav.pug8
-rw-r--r--tpl/objects/lightbox.pug6
-rw-r--r--tpl/objects/menu.pug2
-rw-r--r--tpl/objects/navbar.pug2
-rw-r--r--tpl/objects/side-nav.pug2
-rw-r--r--tpl/objects/text-field.pug1
13 files changed, 50 insertions, 97 deletions
diff --git a/tpl/objects/action-button.pug b/tpl/objects/action-button.pug
deleted file mode 100644
index e9b6fe3..0000000
--- a/tpl/objects/action-button.pug
+++ /dev/null
@@ -1,34 +0,0 @@
1include icon.pug
2
3mixin action-button
4 -
5 let classes = {
6 'o-action-button': true,
7 'u-d-block': attributes.block,
8 'o-action-button--quiet': attributes.quiet,
9 'o-action-button--pill': attributes.pill,
10 'o-action-button--icon': !!attributes.icon && !block,
11 'is-selected': attributes.selected
12 }
13 if (attributes.theme) {
14 classes['o-action-button--' + attributes.theme] = true
15 }
16 if (attributes.size) {
17 classes['o-action-button--' + attributes.size] = true
18 }
19 if (attributes.class) {
20 classes[attributes.class] = true;
21 }
22
23 let href = attributes.disabled ? null : '#';
24
25 a(class=classes href=href)
26 if attributes.icon
27 +icon(attributes.icon)
28 = ' '
29 if block
30 span.o-action-button__label
31 block
32 if attributes.postIcon
33 = ' '
34 +icon(attributes.postIcon)
diff --git a/tpl/objects/badge.pug b/tpl/objects/badge.pug
deleted file mode 100644
index 48e4029..0000000
--- a/tpl/objects/badge.pug
+++ /dev/null
@@ -1,37 +0,0 @@
1mixin badge(variant)
2 -
3 let classes = {
4 'o-badge': true,
5 'o-badge--pill': !!attributes.pill,
6 'o-badge--quiet': !!attributes.quiet,
7 'o-menu__badge': !!attributes.menu,
8 }
9 if (attributes.size) {
10 classes['o-badge--' + attributes.size] = true
11 }
12 if (variant) {
13 classes['o-badge--' + variant] = true
14 }
15
16 if attributes.href
17 a(href=attributes.href class=classes)
18 if attributes.icon
19 +icon(attributes.icon)
20 = ' '
21 if block
22 span.o-badge__label
23 block
24 if attributes.postIcon
25 = ' '
26 +icon(attributes.postIcon)
27 else
28 span(class=classes)
29 if attributes.icon
30 +icon(attributes.icon)
31 = ' '
32 if block
33 span.o-badge__label
34 block
35 if attributes.postIcon
36 = ' '
37 +icon(attributes.postIcon)
diff --git a/tpl/objects/button.pug b/tpl/objects/button.pug
index 0884c8d..3b5de2b 100644
--- a/tpl/objects/button.pug
+++ b/tpl/objects/button.pug
@@ -1,22 +1,31 @@
1mixin a-button 1include icon.pug
2
3mixin button
2 - 4 -
3 let classes = { 5 let classes = {
4 'o-button': true, 6 'o-button': true,
5 'o-button--block': attributes.block, 7 'u-d-block': attributes.block,
6 'o-button--primary': attributes.primary, 8 'o-button--secondary': attributes.secondary,
7 'o-button--outline': attributes.outline, 9 'o-button--quiet': attributes.quiet,
8 'o-button--round': !!attributes.icon && !block 10 'o-button--pill': attributes.pill,
11 'o-button--badge': attributes.badge,
12 'o-button--icon': !!attributes.icon && !block,
13 'is-selected': attributes.selected,
14 'is-highlighted': attributes.highlighted,
9 } 15 }
10 if (attributes.variant) { 16 if (attributes.theme) {
11 classes['o-button--' + attributes.variant] = true 17 classes['o-button--' + attributes.theme] = true
12 } 18 }
13 if (attributes.size) { 19 if (attributes.size) {
14 classes['o-button--' + attributes.size] = true 20 classes['o-button--' + attributes.size] = true
15 } 21 }
22 if (attributes.class) {
23 classes[attributes.class] = true;
24 }
16 25
17 let href = attributes.disabled ? null : '#'; 26 let href = attributes.disabled ? null : '#';
18 27
19 a(class=classes href=href aria-disabled=attributes.disabled && String(attributes.disabled)) 28 a(class=classes href=href)
20 if attributes.icon 29 if attributes.icon
21 +icon(attributes.icon) 30 +icon(attributes.icon)
22 = ' ' 31 = ' '
diff --git a/tpl/objects/card.pug b/tpl/objects/card.pug
index 2ab9bef..feb1441 100644
--- a/tpl/objects/card.pug
+++ b/tpl/objects/card.pug
@@ -1,8 +1,11 @@
1mixin card 1mixin card
2 - 2 -
3 let classes = { 3 let classes = {
4 'o-card': true, 4 'o-card': true,
5 'o-card--quiet': !!attributes.quiet, 5 'o-card--borderless': !!attributes.borderless,
6 'o-card--shadow': !!attributes.shadow,
7 'o-card--quiet': !!attributes.quiet,
8 'o-card--thumbnail': !!attributes.thumbnail,
6 } 9 }
7 10
8 if (attributes.class) { 11 if (attributes.class) {
@@ -26,7 +29,16 @@ mixin card-image
26 classes[attributes.class] = true; 29 classes[attributes.class] = true;
27 } 30 }
28 31
29 img(class=classes src=attributes.src style=attributes.style) 32 let imgClasses = {
33 'o-card__image-img': true,
34 'l-card-list__card-image': attributes.list
35 }
36
37 div(class=classes)
38 img(class=imgClasses src=attributes.src style=attributes.style)
39 if block
40 .o-card__image-overlay
41 block
30 42
31mixin card-body 43mixin card-body
32 .o-card__body(style=attributes.style) 44 .o-card__body(style=attributes.style)
diff --git a/tpl/objects/dialog.pug b/tpl/objects/dialog.pug
index 3ceae69..1a2f061 100644
--- a/tpl/objects/dialog.pug
+++ b/tpl/objects/dialog.pug
@@ -54,13 +54,13 @@ mixin dialog(title)
54 else 54 else
55 if title 55 if title
56 +div-heading('xl')(class='o-dialog__title l-media__block l-media__block--main')= title 56 +div-heading('xl')(class='o-dialog__title l-media__block l-media__block--main')= title
57 +action-button(round=true quiet=true icon='x' class='o-dialog__close-btn l-media__block') 57 +button(round=true quiet=true icon='x' class='o-dialog__close-btn l-media__block')
58 58
59 section(class=bodyClass) 59 section(class=bodyClass)
60 if slots.body 60 if slots.body
61 - slots.body() 61 - slots.body()
62 62
63 footer.o-dialog__footer.l-button-group 63 footer.o-dialog__footer.l-button-group
64 +a-button(outline=true)= 'Cancel' 64 +button(outline=true)= 'Cancel'
65 = ' ' 65 = ' '
66 +a-button(variant='accent')= 'Continue' 66 +button(variant='accent')= 'Continue'
diff --git a/tpl/objects/divider.pug b/tpl/objects/divider.pug
index 46425cd..ed4d27a 100644
--- a/tpl/objects/divider.pug
+++ b/tpl/objects/divider.pug
@@ -3,6 +3,8 @@ mixin divider(level)
3 let classes = { 3 let classes = {
4 'o-divider': true, 4 'o-divider': true,
5 'o-divider--labelled': !!block, 5 'o-divider--labelled': !!block,
6 'o-divider--vertical': !!attributes.vertical,
7 'o-divider--dot': !!attributes.dot,
6 ['o-divider--' + level]: true, 8 ['o-divider--' + level]: true,
7 ['o-divider--' + attributes.color]: !!attributes.color 9 ['o-divider--' + attributes.color]: !!attributes.color
8 } 10 }
diff --git a/tpl/objects/field-label.pug b/tpl/objects/field-label.pug
index fb96443..192780d 100644
--- a/tpl/objects/field-label.pug
+++ b/tpl/objects/field-label.pug
@@ -16,7 +16,7 @@ mixin field-label(label, hint=null)
16 16
17 let labelStyle = needsLabelWidth ? 'width: ' + attributes.labelWidth : ''; 17 let labelStyle = needsLabelWidth ? 'width: ' + attributes.labelWidth : '';
18 18
19 div(class=classes) 19 label(class=classes)
20 .o-field-label__label(style=labelStyle class=attributes.labelClass)= label 20 .o-field-label__label(style=labelStyle class=attributes.labelClass)= label
21 .o-field-label__content(class=attributes.contentClass) 21 .o-field-label__content(class=attributes.contentClass)
22 block 22 block
diff --git a/tpl/objects/icon-nav.pug b/tpl/objects/icon-nav.pug
index f1c7d8a..afdf2db 100644
--- a/tpl/objects/icon-nav.pug
+++ b/tpl/objects/icon-nav.pug
@@ -1,6 +1,6 @@
1include icon.pug 1include icon.pug
2include status-indicator.pug 2include status-indicator.pug
3include action-button.pug 3include button.pug
4 4
5mixin icon-nav 5mixin icon-nav
6 - 6 -
@@ -19,9 +19,9 @@ mixin icon-nav-item(icon)
19 - 19 -
20 let classes = { 20 let classes = {
21 'o-icon-nav__item': true, 21 'o-icon-nav__item': true,
22 'o-action-button': true, 22 'o-button': true,
23 'o-action-button--round': true, 23 'o-button--round': true,
24 'o-action-button--quiet': true, 24 'o-button--quiet': true,
25 'is-selected': attributes.selected, 25 'is-selected': attributes.selected,
26 } 26 }
27 if (attributes.class) { 27 if (attributes.class) {
diff --git a/tpl/objects/lightbox.pug b/tpl/objects/lightbox.pug
index 842d44a..2d520b5 100644
--- a/tpl/objects/lightbox.pug
+++ b/tpl/objects/lightbox.pug
@@ -23,14 +23,14 @@ mixin lightbox(images)
23 header.o-lightbox__header 23 header.o-lightbox__header
24 div(class=linksClasses) 24 div(class=linksClasses)
25 block 25 block
26 +action-button(theme=attributes.theme pill=true quiet=true icon='x' class='o-lightbox__close-btn') 26 +button(theme=attributes.theme pill=true quiet=true icon='x' class='o-lightbox__close-btn')
27 27
28 each img, i in images 28 each img, i in images
29 img(src=images[i] id=('image-' + i) class=`o-lightbox__img ${attributes.interactive && !i ? 'is-visible' : ''}`) 29 img(src=images[i] id=('image-' + i) class=`o-lightbox__img ${attributes.interactive && !i ? 'is-visible' : ''}`)
30 30
31 if images.length > 1 31 if images.length > 1
32 +action-button(theme=attributes.theme pill=true quiet=true icon='chevron-left' class='o-lightbox__nav-btn o-lightbox__nav-btn--prev') 32 +button(theme=attributes.theme pill=true quiet=true icon='chevron-left' class='o-lightbox__nav-btn o-lightbox__nav-btn--prev')
33 +action-button(theme=attributes.theme pill=true quiet=true icon='chevron-right' class='o-lightbox__nav-btn o-lightbox__nav-btn--next') 33 +button(theme=attributes.theme pill=true quiet=true icon='chevron-right' class='o-lightbox__nav-btn o-lightbox__nav-btn--next')
34 34
35 .o-lightbox__thumbnails 35 .o-lightbox__thumbnails
36 each img, i in images 36 each img, i in images
diff --git a/tpl/objects/menu.pug b/tpl/objects/menu.pug
index 578f9bc..802f9bd 100644
--- a/tpl/objects/menu.pug
+++ b/tpl/objects/menu.pug
@@ -1,6 +1,6 @@
1include icon.pug 1include icon.pug
2include status-indicator.pug 2include status-indicator.pug
3include action-button.pug 3include button.pug
4 4
5mixin menu 5mixin menu
6 - 6 -
diff --git a/tpl/objects/navbar.pug b/tpl/objects/navbar.pug
index 5c7642c..14ec9d3 100644
--- a/tpl/objects/navbar.pug
+++ b/tpl/objects/navbar.pug
@@ -1,6 +1,6 @@
1include icon.pug 1include icon.pug
2include status-indicator.pug 2include status-indicator.pug
3include action-button.pug 3include button.pug
4 4
5mixin navbar 5mixin navbar
6 - 6 -
diff --git a/tpl/objects/side-nav.pug b/tpl/objects/side-nav.pug
index ccd24e4..2dcbd84 100644
--- a/tpl/objects/side-nav.pug
+++ b/tpl/objects/side-nav.pug
@@ -1,6 +1,6 @@
1include icon.pug 1include icon.pug
2include status-indicator.pug 2include status-indicator.pug
3include action-button.pug 3include button.pug
4 4
5mixin side-nav 5mixin side-nav
6 - 6 -
diff --git a/tpl/objects/text-field.pug b/tpl/objects/text-field.pug
index 0342f01..6de30e9 100644
--- a/tpl/objects/text-field.pug
+++ b/tpl/objects/text-field.pug
@@ -12,6 +12,7 @@ mixin text-field
12 let classes = { 12 let classes = {
13 'o-text-field': true, 13 'o-text-field': true,
14 'o-text-field--extended': !!block, 14 'o-text-field--extended': !!block,
15 'o-text-field--pill': attributes.pill,
15 'is-invalid': attributes.invalid, 16 'is-invalid': attributes.invalid,
16 'is-disabled': attributes.disabled, 17 'is-disabled': attributes.disabled,
17 'l-media': !!block, 18 'l-media': !!block,
generated by cgit v1.2.3-70-g09d2 (git 2.50.0) at 2025-09-14 08:21:01 +0000