diff options
Diffstat (limited to 'tpl/objects')
-rw-r--r-- | tpl/objects/backdrop.pug | 5 | ||||
-rw-r--r-- | tpl/objects/lightbox.pug | 8 |
2 files changed, 8 insertions, 5 deletions
diff --git a/tpl/objects/backdrop.pug b/tpl/objects/backdrop.pug index 227700c..f577961 100644 --- a/tpl/objects/backdrop.pug +++ b/tpl/objects/backdrop.pug | |||
@@ -8,7 +8,10 @@ mixin backdrop | |||
8 | classes[attributes.class] = true; | 8 | classes[attributes.class] = true; |
9 | } | 9 | } |
10 | 10 | ||
11 | let styles = { width: '100%', 'min-height': '5em', 'max-height': '40em' } | 11 | let styles = { width: '100%', 'min-height': '5em' } |
12 | if (attributes.maxHeight) { | ||
13 | styles['max-height'] = '40em'; | ||
14 | } | ||
12 | if (attributes.pad) { | 15 | if (attributes.pad) { |
13 | styles['padding'] = '2em'; | 16 | styles['padding'] = '2em'; |
14 | } | 17 | } |
diff --git a/tpl/objects/lightbox.pug b/tpl/objects/lightbox.pug index 02a3200..85c468f 100644 --- a/tpl/objects/lightbox.pug +++ b/tpl/objects/lightbox.pug | |||
@@ -4,6 +4,7 @@ mixin lightbox(images) | |||
4 | - | 4 | - |
5 | let classes = { | 5 | let classes = { |
6 | 'o-lightbox': true, | 6 | 'o-lightbox': true, |
7 | 'o-lightbox--interactive': attributes.interactive, | ||
7 | } | 8 | } |
8 | let linksClasses = { | 9 | let linksClasses = { |
9 | 's-links': true, | 10 | 's-links': true, |
@@ -19,15 +20,14 @@ mixin lightbox(images) | |||
19 | div(class=linksClasses) | 20 | div(class=linksClasses) |
20 | block | 21 | block |
21 | +action-button(theme=attributes.theme pill=true quiet=true icon='x' class='o-lightbox__close-btn') | 22 | +action-button(theme=attributes.theme pill=true quiet=true icon='x' class='o-lightbox__close-btn') |
23 | |||
22 | each img, i in images | 24 | each img, i in images |
23 | img.o-lightbox__img(src=images[i] id='image-' + i) | 25 | img(src=images[i] id=('image-' + i) class=`o-lightbox__img ${attributes.interactive && !i ? 'is-visible' : ''}`) |
24 | +action-button(theme=attributes.theme pill=true quiet=true icon='chevron-left' class='o-lightbox__nav-btn o-lightbox__nav-btn--prev') | ||
25 | +action-button(theme=attributes.theme pill=true quiet=true icon='chevron-right' class='o-lightbox__nav-btn o-lightbox__nav-btn--next') | ||
26 | 26 | ||
27 | img.o-lightbox__img.o-lightbox__img--default(src=images[0]) | ||
28 | if images.length > 1 | 27 | if images.length > 1 |
29 | +action-button(theme=attributes.theme pill=true quiet=true icon='chevron-left' class='o-lightbox__nav-btn o-lightbox__nav-btn--prev') | 28 | +action-button(theme=attributes.theme pill=true quiet=true icon='chevron-left' class='o-lightbox__nav-btn o-lightbox__nav-btn--prev') |
30 | +action-button(theme=attributes.theme pill=true quiet=true icon='chevron-right' class='o-lightbox__nav-btn o-lightbox__nav-btn--next') | 29 | +action-button(theme=attributes.theme pill=true quiet=true icon='chevron-right' class='o-lightbox__nav-btn o-lightbox__nav-btn--next') |
30 | |||
31 | .o-lightbox__thumbnails | 31 | .o-lightbox__thumbnails |
32 | each img, i in images | 32 | each img, i in images |
33 | - classes = i === 0 ? 'is-selected' : '' | 33 | - classes = i === 0 ? 'is-selected' : '' |