denizk0461/pages
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

changed transition timing for all animations to use exponential function

Browse Source
This commit is contained in:
denizk0461
2026-03-07 13:43:38 +01:00
parent 41ef47d53d
commit b8eaa69cc0
6 changed files with 13 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/lib/components/outlined-button.svelte
View File

@@ -25,7 +25,7 @@
color: var(--color-highlight);
font-weight: 700;
cursor: pointer;
transition: background-color var(--duration-animation) ease-out;
transition: background-color var(--duration-animation) var(--anim-curve);
}
.outlined-button:hover {

6
src/lib/components/ring.svelte
View File

@@ -66,9 +66,9 @@
line-height: 1.4rem;
font-weight: 500;
/* border: var(--border-width); */
transition: color var(--duration-animation) ease-out,
font-weight var(--duration-animation) ease-out;
/* border-color var(--duration-animation) ease-out; */
transition: color var(--duration-animation) var(--anim-curve),
font-weight var(--duration-animation) var(--anim-curve);
/* border-color var(--duration-animation) var(--anim-curve); */
}
a:link, a:visited, span {
color: var(--color-highlight);

2
src/lib/components/scroll-top-button.svelte
View File

@@ -24,7 +24,7 @@
background-color: var(--color-background-highlight);
backdrop-filter: blur(var(--blur-radius-background));
padding: 12px;
transition: background-color var(--duration-animation) ease-out;
transition: background-color var(--duration-animation) var(--anim-curve);
z-index: 10;
}

2
src/lib/components/subtitled-image.svelte
View File

@@ -61,7 +61,7 @@
text-decoration: none;
box-sizing: border-box;
backdrop-filter: blur(var(--blur-radius-background));
transition: background-color var(--duration-animation) ease-out;
transition: background-color var(--duration-animation) var(--anim-curve);
}
.subtitled-img-container-centred {

4
src/lib/components/table-of-contents.svelte
View File

@@ -107,8 +107,8 @@
display: inline-block;
text-decoration: none;
box-sizing: border-box;
/* transition: color var(--duration-animation) ease-out,
background-color var(--duration-animation) ease-out; */
/* transition: color var(--duration-animation) var(--anim-curve),
background-color var(--duration-animation) var(--anim-curve); */
}
.toc-list a, .toc-list a:link, .toc-list a:visited {
color: var(--color-text);