diff options
author | Volpeon <git@volpeon.ink> | 2022-06-14 20:35:37 +0200 |
---|---|---|
committer | Volpeon <git@volpeon.ink> | 2022-06-14 20:35:37 +0200 |
commit | 7d9bb5fee50561bdce8fe7440ae9d1b8aae48bd0 (patch) | |
tree | d8955670f0bff46eaa06997e84a450143e8e5302 | |
parent | Fix print style bg (diff) | |
download | volpeon.ink-7d9bb5fee50561bdce8fe7440ae9d1b8aae48bd0.tar.gz volpeon.ink-7d9bb5fee50561bdce8fe7440ae9d1b8aae48bd0.tar.bz2 volpeon.ink-7d9bb5fee50561bdce8fe7440ae9d1b8aae48bd0.zip |
Update
-rw-r--r-- | assets/css/_base.scss | 12 | ||||
-rw-r--r-- | assets/css/components/_figure.scss | 21 | ||||
-rw-r--r-- | assets/css/style.scss | 1 | ||||
-rw-r--r-- | content/art/drawings/2022-ava-shading/index.md | 8 | ||||
-rwxr-xr-x[-rw-r--r--] | content/art/drawings/2022-ava-shading/pic.png | bin | 601222 -> 473946 bytes | |||
-rwxr-xr-x | content/art/drawings/2022-ava-shading/thumbnail.png | bin | 0 -> 165693 bytes | |||
-rw-r--r-- | content/main.js | 16 | ||||
-rw-r--r-- | content/notebook/index.md | 2 | ||||
-rw-r--r-- | filters/macros.lua | 7 | ||||
-rw-r--r-- | yarn.lock | 2 |
10 files changed, 51 insertions, 18 deletions
diff --git a/assets/css/_base.scss b/assets/css/_base.scss index 93db12f..f06dc4a 100644 --- a/assets/css/_base.scss +++ b/assets/css/_base.scss | |||
@@ -25,15 +25,3 @@ img { | |||
25 | display: block; | 25 | display: block; |
26 | max-width: 100%; | 26 | max-width: 100%; |
27 | } | 27 | } |
28 | |||
29 | figure { | ||
30 | margin: fn.dim(--paragraph --margin-top) 0 0; | ||
31 | padding: 0; | ||
32 | |||
33 | img { | ||
34 | display: block; | ||
35 | max-width: 100%; | ||
36 | max-height: 70vh; | ||
37 | object-fit: contain; | ||
38 | } | ||
39 | } | ||
diff --git a/assets/css/components/_figure.scss b/assets/css/components/_figure.scss new file mode 100644 index 0000000..78e13c0 --- /dev/null +++ b/assets/css/components/_figure.scss | |||
@@ -0,0 +1,21 @@ | |||
1 | @use 'iro-sass/src/index' as iro; | ||
2 | @use 'iro-design/src/functions' as fn; | ||
3 | @use 'iro-design/src/mixins' as mx; | ||
4 | @use '../functions' as fn2; | ||
5 | |||
6 | @include iro.props-namespace('figure') { | ||
7 | @include iro.bem-component(iro.props-namespace()) { | ||
8 | margin: fn.global-dim(--paragraph --margin-top) 0 0; | ||
9 | padding: 0; | ||
10 | |||
11 | @include iro.bem-elem('link') { | ||
12 | display: block; | ||
13 | } | ||
14 | |||
15 | @include iro.bem-elem('image') { | ||
16 | display: block; | ||
17 | max-width: 100%; | ||
18 | max-height: 70vh; | ||
19 | } | ||
20 | } | ||
21 | } | ||
diff --git a/assets/css/style.scss b/assets/css/style.scss index b525e7b..9ec6483 100644 --- a/assets/css/style.scss +++ b/assets/css/style.scss | |||
@@ -21,6 +21,7 @@ | |||
21 | @use 'components/header'; | 21 | @use 'components/header'; |
22 | @use 'components/hnav'; | 22 | @use 'components/hnav'; |
23 | @use 'components/card'; | 23 | @use 'components/card'; |
24 | @use 'components/figure'; | ||
24 | 25 | ||
25 | @use 'iro-design/src/scopes/blockquotes' as iro-blockquotes; | 26 | @use 'iro-design/src/scopes/blockquotes' as iro-blockquotes; |
26 | @use 'iro-design/src/scopes/code' as iro-code; | 27 | @use 'iro-design/src/scopes/code' as iro-code; |
diff --git a/content/art/drawings/2022-ava-shading/index.md b/content/art/drawings/2022-ava-shading/index.md index e3c4a10..9dcea6a 100644 --- a/content/art/drawings/2022-ava-shading/index.md +++ b/content/art/drawings/2022-ava-shading/index.md | |||
@@ -1,10 +1,12 @@ | |||
1 | --- | 1 | --- |
2 | title: Avatar with shading | 2 | title: Autumn Fox |
3 | date: 2021-12-27 | 3 | date: 2022-02-25 |
4 | thumbnail: png | 4 | thumbnail: png |
5 | unlisted: true | ||
6 | --- | 5 | --- |
7 | 6 | ||
7 | First attempt at cel shading. | ||
8 | It's actually incomplete, but I felt like I had hit a roadblock with the shading and wanted to try again with another drawing. | ||
9 | |||
8 | ::: figure | 10 | ::: figure |
9 | ![](pic.png) | 11 | ![](pic.png) |
10 | ::: | 12 | ::: |
diff --git a/content/art/drawings/2022-ava-shading/pic.png b/content/art/drawings/2022-ava-shading/pic.png index 5e7dcec..0689364 100644..100755 --- a/content/art/drawings/2022-ava-shading/pic.png +++ b/content/art/drawings/2022-ava-shading/pic.png | |||
Binary files differ | |||
diff --git a/content/art/drawings/2022-ava-shading/thumbnail.png b/content/art/drawings/2022-ava-shading/thumbnail.png new file mode 100755 index 0000000..dc39092 --- /dev/null +++ b/content/art/drawings/2022-ava-shading/thumbnail.png | |||
Binary files differ | |||
diff --git a/content/main.js b/content/main.js index 3257c39..760d40a 100644 --- a/content/main.js +++ b/content/main.js | |||
@@ -22,6 +22,7 @@ | |||
22 | (() => { | 22 | (() => { |
23 | let currentIndex = 0; | 23 | let currentIndex = 0; |
24 | let visible = false; | 24 | let visible = false; |
25 | let mouseDown = false; | ||
25 | 26 | ||
26 | const mainEl = document.querySelector("main"); | 27 | const mainEl = document.querySelector("main"); |
27 | const lightboxContainerEl = document.querySelector(".js-lightbox"); | 28 | const lightboxContainerEl = document.querySelector(".js-lightbox"); |
@@ -90,6 +91,21 @@ | |||
90 | return thumbnailButtonEl; | 91 | return thumbnailButtonEl; |
91 | }); | 92 | }); |
92 | 93 | ||
94 | document.addEventListener('mousedown', (e) => { | ||
95 | if (visible) { | ||
96 | mouseDown = !lightboxEl.contains(e.target) || lightboxEl === e.target; | ||
97 | } | ||
98 | }); | ||
99 | |||
100 | document.addEventListener('click', (e) => { | ||
101 | if (visible && mouseDown) { | ||
102 | mouseDown = false; | ||
103 | e.preventDefault(); | ||
104 | e.stopPropagation(); | ||
105 | hide(); | ||
106 | } | ||
107 | }, { capture: true }); | ||
108 | |||
93 | window.addEventListener("keydown", e => { | 109 | window.addEventListener("keydown", e => { |
94 | if (e.defaultPrevented || !visible) { | 110 | if (e.defaultPrevented || !visible) { |
95 | return; | 111 | return; |
diff --git a/content/notebook/index.md b/content/notebook/index.md index b1e2d2a..2cebe5c 100644 --- a/content/notebook/index.md +++ b/content/notebook/index.md | |||
@@ -6,3 +6,5 @@ list_order: date_desc | |||
6 | list_flatten: true | 6 | list_flatten: true |
7 | feed: true | 7 | feed: true |
8 | --- | 8 | --- |
9 | |||
10 | Essays, notes, blogs, thoughts... all kinds of textual content. | ||
diff --git a/filters/macros.lua b/filters/macros.lua index 2864bef..36cc459 100644 --- a/filters/macros.lua +++ b/filters/macros.lua | |||
@@ -10,8 +10,11 @@ function figure(el) | |||
10 | pandoc.walk_block(el, { Image = function(iel) images:insert(iel) end }) | 10 | pandoc.walk_block(el, { Image = function(iel) images:insert(iel) end }) |
11 | 11 | ||
12 | return pandoc.RawBlock("html", | 12 | return pandoc.RawBlock("html", |
13 | "<figure><a href=\"" .. images[1].src .. "\"><img src=\"" .. images[1].src .. "\" title=\"" .. | 13 | "<figure class=\"c-figure\">\ |
14 | images[1].title .. "\" /></a></figure>") | 14 | <a class=\"c-figure__link\" href=\"" .. images[1].src .. "\">\ |
15 | <img class=\"c-figure__image\" src=\"" .. images[1].src .. "\" title=\"" .. images[1].title .. "\" />\ | ||
16 | </a>\ | ||
17 | </figure>") | ||
15 | end | 18 | end |
16 | 19 | ||
17 | function Div(el) | 20 | function Div(el) |
@@ -1280,7 +1280,7 @@ internal-slot@^1.0.3: | |||
1280 | 1280 | ||
1281 | "iro-design@git+https://git.vulpes.one/git/iro-design.git": | 1281 | "iro-design@git+https://git.vulpes.one/git/iro-design.git": |
1282 | version "1.0.0" | 1282 | version "1.0.0" |
1283 | resolved "git+https://git.vulpes.one/git/iro-design.git#e62df622527bcd9e3ee45d3efd9a06b553d41b82" | 1283 | resolved "git+https://git.vulpes.one/git/iro-design.git#fb32c0014dd4f74b37b179fdc596badf2f055bd4" |
1284 | dependencies: | 1284 | dependencies: |
1285 | "@oddbird/blend" "^0.2.3" | 1285 | "@oddbird/blend" "^0.2.3" |
1286 | include-media "^1.4.9" | 1286 | include-media "^1.4.9" |