diff --git a/content/demo/index.md b/content/demo/index.md index 5437a21..c1acfe1 100644 --- a/content/demo/index.md +++ b/content/demo/index.md @@ -198,7 +198,7 @@ Alternatively, you can append the following URL anchors. It can be more handy in
-![Toolbx header image](https://containertoolbx.org/assets/toolbx.gif#full#pixels#transparent#no-hover) +[![Toolbx header image](https://containertoolbx.org/assets/toolbx.gif#full#pixels#transparent#no-hover)](https://containertoolbx.org)
Full-width image with an alt text, pixel-art rendering, no shadow and rounded corners, and no zoom on hover
diff --git a/sass/_article-list.scss b/sass/_article-list.scss index 9ca83e0..0412c3d 100644 --- a/sass/_article-list.scss +++ b/sass/_article-list.scss @@ -321,13 +321,13 @@ padding-block-start: 0.5rem; } - .blurhash { + .blurnail { position: absolute; opacity: var(--dim-opacity); z-index: -2; - filter: var(--blurhash-blur); + filter: var(--blurnail-blur); inset: 0; - background-image: var(--blurhash); + background-image: var(--blurnail); background-position: center; background-size: cover; } diff --git a/sass/_article.scss b/sass/_article.scss index cf7c691..ddf0144 100644 --- a/sass/_article.scss +++ b/sass/_article.scss @@ -84,12 +84,24 @@ transform-origin: bottom right; animation: toc-dropdown-open var(--transition); + :root[dir*="rtl"] & { + transform-origin: bottom left; + animation: toc-dropdown-open-rtl var(--transition); + } + @keyframes toc-dropdown-open { from { transform: scale(50%) translate(1rem, 1rem); opacity: 0; } } + + @keyframes toc-dropdown-open-rtl { + from { + transform: scale(50%) translate(-1rem, 1rem); + opacity: 0; + } + } } summary { diff --git a/sass/_variables.scss b/sass/_variables.scss index 6ccf78b..0164e8e 100644 --- a/sass/_variables.scss +++ b/sass/_variables.scss @@ -34,7 +34,7 @@ --yellow-fg: rgb(248 228 92); // FILTERS - --blurhash-blur: brightness(25%) blur(1rem); + --blurnail-blur: brightness(25%) blur(1rem); color-scheme: dark; } @@ -73,7 +73,7 @@ // FILTERS --blur: saturate(180%) blur(0.75rem); - --blurhash-blur: contrast(25%) brightness(175%) blur(1rem); + --blurnail-blur: contrast(25%) brightness(175%) blur(1rem); // FONT SIZES --font-size-xx-small: 0.625rem; diff --git a/templates/partials/articles.html b/templates/partials/articles.html index 5040fad..2c41324 100644 --- a/templates/partials/articles.html +++ b/templates/partials/articles.html @@ -73,8 +73,8 @@ {%- endif -%} {%- if page.extra.banner -%} - {%- set blurhash = resize_image(path=page.colocated_path ~ page.extra.banner, width=16, height=8, op="fill", format="webp") -%} -
+ {%- set blurnail = resize_image(path=page.colocated_path ~ page.extra.banner, width=16, height=8, op="fill", format="webp") -%} +
{%- endif -%}