From ceded156a8657c81e2bd3017e5d9bcecee0058ec Mon Sep 17 00:00:00 2001 From: daudix Date: Mon, 9 Sep 2024 19:30:36 +0300 Subject: [PATCH] Rename --shine to --shimmer, make sure images are always on top when hovered --- CHANGELOG.md | 1 + sass/_comments.scss | 4 ++-- sass/_media.scss | 1 + sass/_pre-container.scss | 4 ++-- 4 files changed, 6 insertions(+), 4 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index d0d84cf..9e1ed50 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -57,6 +57,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 - `config.extra.fix_contrast_dark` should now work even if `config.extra.primary_color_dark` is not set. - Don't add `::before` pseudo element to color pickers. +- Fix images being covered by other images in some scenarios. - Load auto-menu-close script if navbar sublinks are present. ## [4.8.0](https://codeberg.org/daudix/duckquill/compare/v4.7.1...v4.8.0) diff --git a/sass/_comments.scss b/sass/_comments.scss index 60e6cc5..a66ea49 100644 --- a/sass/_comments.scss +++ b/sass/_comments.scss @@ -38,8 +38,8 @@ margin-block-start: 2rem; #load-comments { - --shine: rgb(from var(--primary-color) r g b / calc(var(--color-opacity) * 2)); - background-image: linear-gradient(to right, var(--fg-muted-1) 50%, var(--shine) 75%, var(--fg-muted-1) 100%); + --shimmer: rgb(from var(--primary-color) r g b / calc(var(--color-opacity) * 2)); + background-image: linear-gradient(to right, var(--fg-muted-1) 50%, var(--shimmer) 75%, var(--fg-muted-1) 100%); background-size: 200%; background-color: transparent; diff --git a/sass/_media.scss b/sass/_media.scss index c973c4b..60d04f2 100644 --- a/sass/_media.scss +++ b/sass/_media.scss @@ -85,6 +85,7 @@ img { z-index: 1; box-shadow: var(--edge-highlight), var(--shadow-raised); border-radius: 0; + position: relative; } &.start, diff --git a/sass/_pre-container.scss b/sass/_pre-container.scss index 3d49de9..7dcd2a6 100644 --- a/sass/_pre-container.scss +++ b/sass/_pre-container.scss @@ -4,9 +4,9 @@ border-radius: var(--rounded-corner); .header { - --shine: rgb(from var(--primary-color) r g b / calc(var(--color-opacity) * 2)); + --shimmer: rgb(from var(--primary-color) r g b / calc(var(--color-opacity) * 2)); border-radius: var(--rounded-corner) var(--rounded-corner) 0 0; - background-image: linear-gradient(to right, var(--fg-muted-1) 50%, var(--shine) 75%, var(--fg-muted-1) 100%); + background-image: linear-gradient(to right, var(--fg-muted-1) 50%, var(--shimmer) 75%, var(--fg-muted-1) 100%); background-size: 200%; padding: 0.25rem; height: 2.5rem;