summaryrefslogtreecommitdiffstats
path: root/tpl/objects
diff options
context:
space:
mode:
Diffstat (limited to 'tpl/objects')
-rw-r--r--tpl/objects/card.pug12
-rw-r--r--tpl/objects/lightbox.pug27
2 files changed, 31 insertions, 8 deletions
diff --git a/tpl/objects/card.pug b/tpl/objects/card.pug
index d7595d1..d622d3b 100644
--- a/tpl/objects/card.pug
+++ b/tpl/objects/card.pug
@@ -17,7 +17,16 @@ mixin card
17 block 17 block
18 18
19mixin card-image 19mixin card-image
20 .o-card__image 20 -
21 let classes = {
22 'o-card__image': true,
23 }
24
25 if (attributes.class) {
26 classes[attributes.class] = true;
27 }
28
29 div(class=classes)
21 img.o-card__image-img(src=attributes.src style=attributes.style) 30 img.o-card__image-img(src=attributes.src style=attributes.style)
22 31
23mixin card-body 32mixin card-body
@@ -34,6 +43,7 @@ mixin card-avatar
34mixin card-content 43mixin card-content
35 .o-card__content 44 .o-card__content
36 block 45 block
46
37mixin card-footer 47mixin card-footer
38 footer.o-card__footer 48 footer.o-card__footer
39 block 49 block
diff --git a/tpl/objects/lightbox.pug b/tpl/objects/lightbox.pug
index 58abdae..02a3200 100644
--- a/tpl/objects/lightbox.pug
+++ b/tpl/objects/lightbox.pug
@@ -1,20 +1,33 @@
1include icon.pug 1include icon.pug
2 2
3mixin lightbox(images) 3mixin lightbox(images)
4 .o-lightbox 4 -
5 let classes = {
6 'o-lightbox': true,
7 }
8 let linksClasses = {
9 's-links': true,
10 }
11
12 if (attributes.theme) {
13 classes[`o-lightbox--${attributes.theme}`] = true;
14 linksClasses[`s-links--${attributes.theme}`] = true;
15 }
16
17 div(class=classes)
5 header.o-lightbox__header 18 header.o-lightbox__header
6 .s-links.s-links--colored 19 div(class=linksClasses)
7 block 20 block
8 +action-button(round=true quiet=true icon='x' class='o-lightbox__close-btn') 21 +action-button(theme=attributes.theme pill=true quiet=true icon='x' class='o-lightbox__close-btn')
9 each img, i in images 22 each img, i in images
10 img.o-lightbox__img(src=images[i] id='image-' + i) 23 img.o-lightbox__img(src=images[i] id='image-' + i)
11 +action-button(round=true quiet=true icon='chevron-left' class='o-lightbox__nav-btn o-lightbox__nav-btn--prev') 24 +action-button(theme=attributes.theme pill=true quiet=true icon='chevron-left' class='o-lightbox__nav-btn o-lightbox__nav-btn--prev')
12 +action-button(round=true quiet=true icon='chevron-right' class='o-lightbox__nav-btn o-lightbox__nav-btn--next') 25 +action-button(theme=attributes.theme pill=true quiet=true icon='chevron-right' class='o-lightbox__nav-btn o-lightbox__nav-btn--next')
13 26
14 img.o-lightbox__img.o-lightbox__img--default(src=images[0]) 27 img.o-lightbox__img.o-lightbox__img--default(src=images[0])
15 if images.length > 1 28 if images.length > 1
16 +action-button(round=true quiet=true icon='chevron-left' class='o-lightbox__nav-btn o-lightbox__nav-btn--prev') 29 +action-button(theme=attributes.theme pill=true quiet=true icon='chevron-left' class='o-lightbox__nav-btn o-lightbox__nav-btn--prev')
17 +action-button(round=true quiet=true icon='chevron-right' class='o-lightbox__nav-btn o-lightbox__nav-btn--next') 30 +action-button(theme=attributes.theme pill=true quiet=true icon='chevron-right' class='o-lightbox__nav-btn o-lightbox__nav-btn--next')
18 .o-lightbox__thumbnails 31 .o-lightbox__thumbnails
19 each img, i in images 32 each img, i in images
20 - classes = i === 0 ? 'is-selected' : '' 33 - classes = i === 0 ? 'is-selected' : ''