summaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
-rw-r--r--src/objects/_lightbox.scss25
-rw-r--r--tpl/objects/lightbox.pug3
2 files changed, 28 insertions, 0 deletions
diff --git a/src/objects/_lightbox.scss b/src/objects/_lightbox.scss
index 09a228b..f2f83ef 100644
--- a/src/objects/_lightbox.scss
+++ b/src/objects/_lightbox.scss
@@ -80,15 +80,39 @@
80 @include iro.bem-sibling-elem('img') { 80 @include iro.bem-sibling-elem('img') {
81 @include iro.bem-modifier('default') { 81 @include iro.bem-modifier('default') {
82 display: block; 82 display: block;
83
84 @include iro.bem-next-elem('nav-btn') {
85 display: block;
86
87 @include iro.bem-next-elem('nav-btn') {
88 display: block;
89 }
90 }
83 } 91 }
84 } 92 }
85 93
86 @include iro.bem-multi('&:target', 'is' 'visible') { 94 @include iro.bem-multi('&:target', 'is' 'visible') {
87 display: block; 95 display: block;
88 96
97 @include iro.bem-next-elem('nav-btn') {
98 display: block;
99
100 @include iro.bem-next-elem('nav-btn') {
101 display: block;
102 }
103 }
104
89 @include iro.bem-sibling-elem('img') { 105 @include iro.bem-sibling-elem('img') {
90 @include iro.bem-modifier('default') { 106 @include iro.bem-modifier('default') {
91 display: none; 107 display: none;
108
109 @include iro.bem-next-elem('nav-btn') {
110 display: none;
111
112 @include iro.bem-next-elem('nav-btn') {
113 display: none;
114 }
115 }
92 } 116 }
93 } 117 }
94 } 118 }
@@ -150,6 +174,7 @@
150 } 174 }
151 175
152 @include iro.bem-elem('nav-btn') { 176 @include iro.bem-elem('nav-btn') {
177 display: none;
153 position: relative; 178 position: relative;
154 align-self: center; 179 align-self: center;
155 overflow: visible; 180 overflow: visible;
diff --git a/tpl/objects/lightbox.pug b/tpl/objects/lightbox.pug
index 633cf3f..58abdae 100644
--- a/tpl/objects/lightbox.pug
+++ b/tpl/objects/lightbox.pug
@@ -8,6 +8,9 @@ mixin lightbox(images)
8 +action-button(round=true quiet=true icon='x' class='o-lightbox__close-btn') 8 +action-button(round=true quiet=true icon='x' class='o-lightbox__close-btn')
9 each img, i in images 9 each img, i in images
10 img.o-lightbox__img(src=images[i] id='image-' + i) 10 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')
12 +action-button(round=true quiet=true icon='chevron-right' class='o-lightbox__nav-btn o-lightbox__nav-btn--next')
13
11 img.o-lightbox__img.o-lightbox__img--default(src=images[0]) 14 img.o-lightbox__img.o-lightbox__img--default(src=images[0])
12 if images.length > 1 15 if images.length > 1
13 +action-button(round=true quiet=true icon='chevron-left' class='o-lightbox__nav-btn o-lightbox__nav-btn--prev') 16 +action-button(round=true quiet=true icon='chevron-left' class='o-lightbox__nav-btn o-lightbox__nav-btn--prev')