summaryrefslogtreecommitdiffstats
path: root/tpl/objects
diff options
context:
space:
mode:
Diffstat (limited to 'tpl/objects')
-rw-r--r--tpl/objects/action-button.pug36
-rw-r--r--tpl/objects/badge.pug37
-rw-r--r--tpl/objects/button.pug26
-rw-r--r--tpl/objects/card.pug8
-rw-r--r--tpl/objects/dialog.pug6
-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
10 files changed, 35 insertions, 98 deletions
diff --git a/tpl/objects/action-button.pug b/tpl/objects/action-button.pug
deleted file mode 100644
index 0e77e58..0000000
--- a/tpl/objects/action-button.pug
+++ /dev/null
@@ -1,36 +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--secondary': attributes.secondary,
9 'o-action-button--quiet': attributes.quiet,
10 'o-action-button--pill': attributes.pill,
11 'o-action-button--static': attributes.static,
12 'o-action-button--icon': !!attributes.icon && !block,
13 'is-selected': attributes.selected,
14 }
15 if (attributes.theme) {
16 classes['o-action-button--' + attributes.theme] = true
17 }
18 if (attributes.size) {
19 classes['o-action-button--' + attributes.size] = true
20 }
21 if (attributes.class) {
22 classes[attributes.class] = true;
23 }
24
25 let href = attributes.disabled ? null : '#';
26
27 a(class=classes href=href)
28 if attributes.icon
29 +icon(attributes.icon)
30 = ' '
31 if block
32 span.o-action-button__label
33 block
34 if attributes.postIcon
35 = ' '
36 +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..c356bfe 100644
--- a/tpl/objects/button.pug
+++ b/tpl/objects/button.pug
@@ -1,22 +1,30 @@
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,
9 } 14 }
10 if (attributes.variant) { 15 if (attributes.theme) {
11 classes['o-button--' + attributes.variant] = true 16 classes['o-button--' + attributes.theme] = true
12 } 17 }
13 if (attributes.size) { 18 if (attributes.size) {
14 classes['o-button--' + attributes.size] = true 19 classes['o-button--' + attributes.size] = true
15 } 20 }
21 if (attributes.class) {
22 classes[attributes.class] = true;
23 }
16 24
17 let href = attributes.disabled ? null : '#'; 25 let href = attributes.disabled ? null : '#';
18 26
19 a(class=classes href=href aria-disabled=attributes.disabled && String(attributes.disabled)) 27 a(class=classes href=href)
20 if attributes.icon 28 if attributes.icon
21 +icon(attributes.icon) 29 +icon(attributes.icon)
22 = ' ' 30 = ' '
diff --git a/tpl/objects/card.pug b/tpl/objects/card.pug
index 1db2fe5..feb1441 100644
--- a/tpl/objects/card.pug
+++ b/tpl/objects/card.pug
@@ -1,9 +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--thumbnail': !!attributes.thumbnail, 6 'o-card--shadow': !!attributes.shadow,
7 'o-card--quiet': !!attributes.quiet,
8 'o-card--thumbnail': !!attributes.thumbnail,
7 } 9 }
8 10
9 if (attributes.class) { 11 if (attributes.class) {
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/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 -