summaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
-rw-r--r--package.json4
-rw-r--r--src/objects/_lightbox.scss38
-rw-r--r--tpl/objects/action-button.pug2
-rw-r--r--tpl/objects/icon.pug3
-rw-r--r--yarn.lock51
5 files changed, 52 insertions, 46 deletions
diff --git a/package.json b/package.json
index 22207c8..13c1056 100644
--- a/package.json
+++ b/package.json
@@ -27,8 +27,8 @@
27 "postcss-scss": "^4.0.3", 27 "postcss-scss": "^4.0.3",
28 "pug": "^3.0.0", 28 "pug": "^3.0.0",
29 "pug-cli": "^1.0.0-alpha6", 29 "pug-cli": "^1.0.0-alpha6",
30 "sass": "^1.28.0", 30 "sass": "^1.49.8",
31 "stylelint": "^14.5.0", 31 "stylelint": "^14.5.1",
32 "stylelint-config-sass-guidelines": "^9.0.1", 32 "stylelint-config-sass-guidelines": "^9.0.1",
33 "svg-sprite": "^1.5.4" 33 "svg-sprite": "^1.5.4"
34 } 34 }
diff --git a/src/objects/_lightbox.scss b/src/objects/_lightbox.scss
index 9a79ee8..6d83f01 100644
--- a/src/objects/_lightbox.scss
+++ b/src/objects/_lightbox.scss
@@ -10,12 +10,14 @@
10 --thumbnail: ( 10 --thumbnail: (
11 --size: fn.global-dim(--size --800), 11 --size: fn.global-dim(--size --800),
12 --spacing: fn.global-dim(--size --100), 12 --spacing: fn.global-dim(--size --100),
13 --selected: 3px, 13 --selected: 3px, //fn.global-dim(--border-width --medium),
14 ),
15 --button: (
16 --font-size: fn.global-dim(--font-size --200),
14 ), 17 ),
15 --nav-btn: ( 18 --nav-btn: (
16 --font-size: fn.global-dim(--font-size --400), 19 --width: fn.global-dim(--size --3800),
17 --pad-x: fn.global-dim(--size --300), 20 --height: fn.global-dim(--size --3800),
18 --pad-y: fn.global-dim(--size --300),
19 ), 21 ),
20 ), 22 ),
21 ), 'dims'); 23 ), 'dims');
@@ -26,9 +28,8 @@
26 --size: fn.global-dim(--size --600), 28 --size: fn.global-dim(--size --600),
27 ), 29 ),
28 --nav-btn: ( 30 --nav-btn: (
29 --font-size: fn.global-dim(--font-size --300), 31 --width: fn.global-dim(--size --2500),
30 --pad-x: fn.global-dim(--size --150), 32 --height: fn.global-dim(--size --2500),
31 --pad-y: fn.global-dim(--size --150),
32 ), 33 ),
33 ), 34 ),
34 ), 'md'); 35 ), 'md');
@@ -47,6 +48,7 @@
47 grid-template-columns: minmax(0, 1fr) auto; 48 grid-template-columns: minmax(0, 1fr) auto;
48 grid-template-areas: 'header close' 'content content' 'footer footer'; 49 grid-template-areas: 'header close' 'content content' 'footer footer';
49 gap: fn.dim(--spacing); 50 gap: fn.dim(--spacing);
51 position: relative;
50 height: 100%; 52 height: 100%;
51 53
52 @include iro.bem-elem('footer') { 54 @include iro.bem-elem('footer') {
@@ -70,7 +72,7 @@
70 max-width: 100%; 72 max-width: 100%;
71 max-height: 100%; 73 max-height: 100%;
72 margin: auto; 74 margin: auto;
73 padding: 0 calc(fn.dim(--nav-btn --font-size) + fn.dim(--nav-btn --pad-x)); 75 padding: 0 calc(fn.dim(--button --font-size) + 2 * fn.foreign-dim(--action-button, --pad-x) + 2px);
74 } 76 }
75 77
76 @include iro.bem-elem('thumbnail') { 78 @include iro.bem-elem('thumbnail') {
@@ -95,18 +97,28 @@
95 } 97 }
96 98
97 @include iro.bem-elem('close-btn') { 99 @include iro.bem-elem('close-btn') {
98 --icon-stroke-width: 2px;
99
100 grid-area: close; 100 grid-area: close;
101 font-size: fn.global-dim(--font-size --150); 101 font-size: fn.dim(--button --font-size);
102 } 102 }
103 103
104 @include iro.bem-elem('prev-btn', 'next-btn') { 104 @include iro.bem-elem('prev-btn', 'next-btn') {
105 position: absolute; 105 position: absolute;
106 top: 50%; 106 top: 50%;
107 padding: fn.dim(--nav-btn --pad-y) fn.dim(--nav-btn --pad-x); 107 overflow: visible;
108 transform: translate(0, -50%); 108 transform: translate(0, -50%);
109 font-size: fn.dim(--nav-btn --font-size); 109 font-size: fn.dim(--button --font-size);
110
111 &::after {
112 content: '';
113 display: block;
114 position: absolute;
115 z-index: -1;
116 top: 50%;
117 left: 50%;
118 width: fn.dim(--nav-btn --width);
119 height: fn.dim(--nav-btn --height);
120 transform: translate(-50%, -50%);
121 }
110 } 122 }
111 123
112 @include iro.bem-elem('prev-btn') { 124 @include iro.bem-elem('prev-btn') {
diff --git a/tpl/objects/action-button.pug b/tpl/objects/action-button.pug
index d752fa6..0467bd7 100644
--- a/tpl/objects/action-button.pug
+++ b/tpl/objects/action-button.pug
@@ -17,7 +17,7 @@ mixin action-button
17 17
18 a(class=classes href=href) 18 a(class=classes href=href)
19 if attributes.icon 19 if attributes.icon
20 +icon(attributes.icon) 20 +icon(attributes.icon)(block=!block)
21 = ' ' 21 = ' '
22 if block 22 if block
23 span.o-action-button__label 23 span.o-action-button__label
diff --git a/tpl/objects/icon.pug b/tpl/objects/icon.pug
index 494abf6..1ed6052 100644
--- a/tpl/objects/icon.pug
+++ b/tpl/objects/icon.pug
@@ -2,7 +2,8 @@ mixin icon(id)
2 - 2 -
3 let href = 'icons.svg#' + id 3 let href = 'icons.svg#' + id
4 let classes = { 4 let classes = {
5 'o-icon': true 5 'o-icon': true,
6 'o-icon--block': attributes.block,
6 } 7 }
7 if (attributes.class) { 8 if (attributes.class) {
8 classes[attributes.class] = true; 9 classes[attributes.class] = true;
diff --git a/yarn.lock b/yarn.lock
index a946522..3745f64 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -623,10 +623,10 @@ cosmiconfig@^7.0.1:
623 path-type "^4.0.0" 623 path-type "^4.0.0"
624 yaml "^1.10.0" 624 yaml "^1.10.0"
625 625
626css-functions-list@^3.0.0: 626css-functions-list@^3.0.1:
627 version "3.0.0" 627 version "3.0.1"
628 resolved "https://registry.yarnpkg.com/css-functions-list/-/css-functions-list-3.0.0.tgz#faa770a0666aea11435efc0889935336cea564be" 628 resolved "https://registry.yarnpkg.com/css-functions-list/-/css-functions-list-3.0.1.tgz#1460df7fb584d1692c30b105151dbb988c8094f9"
629 integrity sha512-rfwhBOvXVFcKrSwmLxD8JQyuEEy/3g3Y9FMI2l6iV558Coeo1ucXypXb4rwrVpk5Osh5ViXp2DTgafw8WxglhQ== 629 integrity sha512-PriDuifDt4u4rkDgnqRCLnjfMatufLmWNfQnGCq34xZwpY3oabwhB9SqRBmuvWUgndbemCFlKqg+nO7C2q0SBw==
630 630
631css-select-base-adapter@^0.1.1: 631css-select-base-adapter@^0.1.1:
632 version "0.1.1" 632 version "0.1.1"
@@ -1266,7 +1266,7 @@ internal-slot@^1.0.3:
1266 1266
1267"iro-icons@git+https://git.vulpes.one/git/iro-icons.git": 1267"iro-icons@git+https://git.vulpes.one/git/iro-icons.git":
1268 version "1.0.0" 1268 version "1.0.0"
1269 resolved "git+https://git.vulpes.one/git/iro-icons.git#14ba13c215955ca8d22f37b49e0a60b3dd53e783" 1269 resolved "git+https://git.vulpes.one/git/iro-icons.git#b871fcd977047a20812ebac8d82f7a1d695eee2b"
1270 1270
1271"iro-sass@git+https://git.vulpes.one/git/iro-sass.git": 1271"iro-sass@git+https://git.vulpes.one/git/iro-sass.git":
1272 version "1.0.2" 1272 version "1.0.2"
@@ -1435,7 +1435,7 @@ is-symbol@^1.0.2, is-symbol@^1.0.3:
1435 dependencies: 1435 dependencies:
1436 has-symbols "^1.0.2" 1436 has-symbols "^1.0.2"
1437 1437
1438is-typedarray@^1.0.0, is-typedarray@~1.0.0: 1438is-typedarray@~1.0.0:
1439 version "1.0.0" 1439 version "1.0.0"
1440 resolved "https://registry.yarnpkg.com/is-typedarray/-/is-typedarray-1.0.0.tgz#e479c80858df0c1b11ddda6940f96011fcda4a9a" 1440 resolved "https://registry.yarnpkg.com/is-typedarray/-/is-typedarray-1.0.0.tgz#e479c80858df0c1b11ddda6940f96011fcda4a9a"
1441 integrity sha1-5HnICFjfDBsR3dppQPlgEfzaSpo= 1441 integrity sha1-5HnICFjfDBsR3dppQPlgEfzaSpo=
@@ -2458,10 +2458,10 @@ safer-buffer@^2.0.2, safer-buffer@^2.1.0, safer-buffer@~2.1.0:
2458 resolved "https://registry.yarnpkg.com/safer-buffer/-/safer-buffer-2.1.2.tgz#44fa161b0187b9549dd84bb91802f9bd8385cd6a" 2458 resolved "https://registry.yarnpkg.com/safer-buffer/-/safer-buffer-2.1.2.tgz#44fa161b0187b9549dd84bb91802f9bd8385cd6a"
2459 integrity sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg== 2459 integrity sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==
2460 2460
2461sass@^1.28.0: 2461sass@^1.49.8:
2462 version "1.49.7" 2462 version "1.49.8"
2463 resolved "https://registry.yarnpkg.com/sass/-/sass-1.49.7.tgz#22a86a50552b9b11f71404dfad1b9ff44c6b0c49" 2463 resolved "https://registry.yarnpkg.com/sass/-/sass-1.49.8.tgz#9bbbc5d43d14862db07f1c04b786c9da9b641828"
2464 integrity sha512-13dml55EMIR2rS4d/RDHHP0sXMY3+30e1TKsyXaSz3iLWVoDWEoboY8WzJd5JMnxrRHffKO3wq2mpJ0jxRJiEQ== 2464 integrity sha512-NoGOjvDDOU9og9oAxhRnap71QaTjjlzrvLnKecUJ3GxhaQBrV6e7gPuSPF28u1OcVAArVojPAe4ZhOXwwC4tGw==
2465 dependencies: 2465 dependencies:
2466 chokidar ">=3.0.0 <4.0.0" 2466 chokidar ">=3.0.0 <4.0.0"
2467 immutable "^4.0.0" 2467 immutable "^4.0.0"
@@ -2498,7 +2498,7 @@ side-channel@^1.0.4:
2498 get-intrinsic "^1.0.2" 2498 get-intrinsic "^1.0.2"
2499 object-inspect "^1.9.0" 2499 object-inspect "^1.9.0"
2500 2500
2501signal-exit@^3.0.2: 2501signal-exit@^3.0.7:
2502 version "3.0.7" 2502 version "3.0.7"
2503 resolved "https://registry.yarnpkg.com/signal-exit/-/signal-exit-3.0.7.tgz#a9a1767f8af84155114eaabd73f99273c8f59ad9" 2503 resolved "https://registry.yarnpkg.com/signal-exit/-/signal-exit-3.0.7.tgz#a9a1767f8af84155114eaabd73f99273c8f59ad9"
2504 integrity sha512-wnD2ZE+l+SPC/uoS0vXeE9L1+0wuaMqKlfz9AMUo38JsyLSBWSFcHR1Rri62LZc12vLr1gb3jl7iwQhgwpAbGQ== 2504 integrity sha512-wnD2ZE+l+SPC/uoS0vXeE9L1+0wuaMqKlfz9AMUo38JsyLSBWSFcHR1Rri62LZc12vLr1gb3jl7iwQhgwpAbGQ==
@@ -2693,15 +2693,15 @@ stylelint-scss@^4.0.0:
2693 postcss-selector-parser "^6.0.6" 2693 postcss-selector-parser "^6.0.6"
2694 postcss-value-parser "^4.1.0" 2694 postcss-value-parser "^4.1.0"
2695 2695
2696stylelint@^14.5.0: 2696stylelint@^14.5.1:
2697 version "14.5.0" 2697 version "14.5.1"
2698 resolved "https://registry.yarnpkg.com/stylelint/-/stylelint-14.5.0.tgz#d94252027164bc918303a6b782652931421d8871" 2698 resolved "https://registry.yarnpkg.com/stylelint/-/stylelint-14.5.1.tgz#2b2575ccaf14bb057209d48fc87c17d5b684f8db"
2699 integrity sha512-4dvQjrhAz2njLoE1OvUEZpryNWcmx2w5Lq5jlibxFv6b5W6O8/vob12M2ZzhX3Ndzs5f67F+BEYmhnQXOwfVYQ== 2699 integrity sha512-8Hf4HtnhxlWlf7iXF9zFfhSc3X0teRnVzl6PqPs2JEFx+dy/mhMhghZfiTDW4QG0ihDw9+WP7GZw5Nzx7cQF5A==
2700 dependencies: 2700 dependencies:
2701 balanced-match "^2.0.0" 2701 balanced-match "^2.0.0"
2702 colord "^2.9.2" 2702 colord "^2.9.2"
2703 cosmiconfig "^7.0.1" 2703 cosmiconfig "^7.0.1"
2704 css-functions-list "^3.0.0" 2704 css-functions-list "^3.0.1"
2705 debug "^4.3.3" 2705 debug "^4.3.3"
2706 execall "^2.0.0" 2706 execall "^2.0.0"
2707 fast-glob "^3.2.11" 2707 fast-glob "^3.2.11"
@@ -2738,7 +2738,7 @@ stylelint@^14.5.0:
2738 svg-tags "^1.0.0" 2738 svg-tags "^1.0.0"
2739 table "^6.8.0" 2739 table "^6.8.0"
2740 v8-compile-cache "^2.3.0" 2740 v8-compile-cache "^2.3.0"
2741 write-file-atomic "^4.0.0" 2741 write-file-atomic "^4.0.1"
2742 2742
2743supports-color@^2.0.0: 2743supports-color@^2.0.0:
2744 version "2.0.0" 2744 version "2.0.0"
@@ -2912,11 +2912,6 @@ type-fest@^0.8.1:
2912 resolved "https://registry.yarnpkg.com/type-fest/-/type-fest-0.8.1.tgz#09e249ebde851d3b1e48d27c105444667f17b83d" 2912 resolved "https://registry.yarnpkg.com/type-fest/-/type-fest-0.8.1.tgz#09e249ebde851d3b1e48d27c105444667f17b83d"
2913 integrity sha512-4dbzIzqvjtgiM5rw1k5rEHtBANKmdudhGyBEajN01fEyhaAIhsoKNy6y7+IN93IfpFtwY9iqi7kD+xwKhQsNJA== 2913 integrity sha512-4dbzIzqvjtgiM5rw1k5rEHtBANKmdudhGyBEajN01fEyhaAIhsoKNy6y7+IN93IfpFtwY9iqi7kD+xwKhQsNJA==
2914 2914
2915typedarray-to-buffer@^4.0.0:
2916 version "4.0.0"
2917 resolved "https://registry.yarnpkg.com/typedarray-to-buffer/-/typedarray-to-buffer-4.0.0.tgz#cdd2933c61dd3f5f02eda5d012d441f95bfeb50a"
2918 integrity sha512-6dOYeZfS3O9RtRD1caom0sMxgK59b27+IwoNy8RDPsmslSGOyU+mpTamlaIW7aNKi90ZQZ9DFaZL3YRoiSCULQ==
2919
2920typedarray@^0.0.6: 2915typedarray@^0.0.6:
2921 version "0.0.6" 2916 version "0.0.6"
2922 resolved "https://registry.yarnpkg.com/typedarray/-/typedarray-0.0.6.tgz#867ac74e3864187b1d3d47d996a78ec5c8830777" 2917 resolved "https://registry.yarnpkg.com/typedarray/-/typedarray-0.0.6.tgz#867ac74e3864187b1d3d47d996a78ec5c8830777"
@@ -3113,15 +3108,13 @@ wrappy@1:
3113 resolved "https://registry.yarnpkg.com/wrappy/-/wrappy-1.0.2.tgz#b5243d8f3ec1aa35f1364605bc0d1036e30ab69f" 3108 resolved "https://registry.yarnpkg.com/wrappy/-/wrappy-1.0.2.tgz#b5243d8f3ec1aa35f1364605bc0d1036e30ab69f"
3114 integrity sha1-tSQ9jz7BqjXxNkYFvA0QNuMKtp8= 3109 integrity sha1-tSQ9jz7BqjXxNkYFvA0QNuMKtp8=
3115 3110
3116write-file-atomic@^4.0.0: 3111write-file-atomic@^4.0.1:
3117 version "4.0.0" 3112 version "4.0.1"
3118 resolved "https://registry.yarnpkg.com/write-file-atomic/-/write-file-atomic-4.0.0.tgz#0eff5dc687d3e22535ca3fca8558124645a4b053" 3113 resolved "https://registry.yarnpkg.com/write-file-atomic/-/write-file-atomic-4.0.1.tgz#9faa33a964c1c85ff6f849b80b42a88c2c537c8f"
3119 integrity sha512-JhcWoKffJNF7ivO9yflBhc7tn3wKnokMUfWpBriM9yCXj4ePQnRPcWglBkkg1AHC8nsW/EfxwwhqsLtOy59djA== 3114 integrity sha512-nSKUxgAbyioruk6hU87QzVbY279oYT6uiwgDoujth2ju4mJ+TZau7SQBhtbTmUyuNYTuXnSyRn66FV0+eCgcrQ==
3120 dependencies: 3115 dependencies:
3121 imurmurhash "^0.1.4" 3116 imurmurhash "^0.1.4"
3122 is-typedarray "^1.0.0" 3117 signal-exit "^3.0.7"
3123 signal-exit "^3.0.2"
3124 typedarray-to-buffer "^4.0.0"
3125 3118
3126xpath@^0.0.32: 3119xpath@^0.0.32:
3127 version "0.0.32" 3120 version "0.0.32"