hak8or/blog
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

More pointless variables

Browse Source
This commit is contained in:
daudix
2024-09-14 04:25:53 +03:00
parent 7df26217f8
commit 4ead8a1396
6 changed files with 9 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
CHANGELOG.md
View File

@ -10,7 +10,8 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
### Added ### Added
- Add `--color-opacity` CSS variable for setting global color opacity. - Add `--color-opacity` CSS variable for setting global color opacity.
- Add `--disabled` CSS variable for setting opacity of disabled elements. - Add `--dim-opacity` CSS variable for setting opacity of dimmed elements.
- Add `--disabled-opacity` CSS variable for setting opacity of disabled elements.
- Add `--hover` CSS variable for setting zoom on hover. - Add `--hover` CSS variable for setting zoom on hover.
- Add `external` class to comment timestamp. - Add `external` class to comment timestamp.
- Add `h1` with page/section title by default. - Add `h1` with page/section title by default.

2
sass/_external.scss
View File

@ -3,7 +3,7 @@ a.external::after {
-webkit-mask-image: var(--icon); -webkit-mask-image: var(--icon);
-webkit-mask-size: cover; -webkit-mask-size: cover;
display: inline-block; display: inline-block;
opacity: var(--disabled); opacity: var(--dim-opacity);
mask-image: var(--icon); mask-image: var(--icon);
mask-size: cover; mask-size: cover;
margin-inline-start: 0.25rem; margin-inline-start: 0.25rem;

2
sass/_footnotes-list.scss
View File

@ -27,7 +27,7 @@
a + a[href*="#fr-"], a + a[href*="#fr-"],
li:target a[href*="#fr-"] { li:target a[href*="#fr-"] {
opacity: var(--disabled); opacity: var(--dim-opacity);
background-color: var(--accent-color); background-color: var(--accent-color);
&:hover { &:hover {

2
sass/_input.scss
View File

@ -16,7 +16,7 @@ input[type="color"] {
} }
&:disabled { &:disabled {
opacity: var(--disabled); opacity: var(--disabled-opacity);
&:hover { &:hover {
cursor: not-allowed; cursor: not-allowed;

4
sass/_spoiler.scss
View File

@ -23,7 +23,7 @@ span.spoiler {
img.spoiler, img.spoiler,
img[src*="#spoiler"] { img[src*="#spoiler"] {
opacity: var(--disabled); opacity: var(--dim-opacity);
clip-path: inset(0% 0% 0% 0% round var(--rounded-corner)); clip-path: inset(0% 0% 0% 0% round var(--rounded-corner));
filter: blur(1rem); filter: blur(1rem);
@ -37,7 +37,7 @@ img[src*="#spoiler"] {
&.solid, &.solid,
&[src*="#solid"] { &[src*="#solid"] {
clip-path: none; clip-path: none;
filter: brightness(0%); filter: brightness(0%) contrast(50%);
box-shadow: none; box-shadow: none;
&:hover, &:hover,

3
sass/_variables.scss
View File

@ -65,7 +65,8 @@
--blur: saturate(180%) blur(0.75rem); --blur: saturate(180%) blur(0.75rem);
--color-opacity: 0.1; --color-opacity: 0.1;
--container-width: 720px; --container-width: 720px;
--disabled: 0.6; --dim-opacity: 0.8;
--disabled-opacity: 0.6;
--edge-highlight: inset 0 0.0625rem 0 rgb(255 255 255 / 0.1); --edge-highlight: inset 0 0.0625rem 0 rgb(255 255 255 / 0.1);
--hover: scale(1.1); --hover: scale(1.1);
--rounded-corner-small: 0.5rem; --rounded-corner-small: 0.5rem;