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); color: var(--color-highlight);
font-weight: 700; font-weight: 700;
cursor: pointer; cursor: pointer;
transition: background-color var(--duration-animation) ease-out; transition: background-color var(--duration-animation) var(--anim-curve);
} }
.outlined-button:hover { .outlined-button:hover {

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

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

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

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

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

@@ -61,7 +61,7 @@
text-decoration: none; text-decoration: none;
box-sizing: border-box; box-sizing: border-box;
backdrop-filter: blur(var(--blur-radius-background)); 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 { .subtitled-img-container-centred {

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

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

10
src/lib/lists/gallery-row.svelte
View File

@@ -40,9 +40,9 @@
margin: 0; margin: 0;
padding: 8px; padding: 8px;
text-decoration: none; text-decoration: none;
transition: background-color var(--duration-animation) ease-out, transition: background-color var(--duration-animation) var(--anim-curve),
border-color var(--duration-animation) ease-out, border-color var(--duration-animation) var(--anim-curve),
backdrop-filter var(--duration-blur) ease-out; backdrop-filter var(--duration-blur) var(--anim-curve);
border: var(--border-dash-size) var(--border-style) transparent; border: var(--border-dash-size) var(--border-style) transparent;
} }
@@ -53,7 +53,7 @@
} }
.row-entry:hover .row-img { .row-entry:hover .row-img {
scale: 1.06; scale: 1.2;
} }
.row-img-container { .row-img-container {
@@ -67,7 +67,7 @@
.row-img { .row-img {
width: 100%; width: 100%;
object-fit: cover; object-fit: cover;
transition: scale var(--duration-animation) ease-out; transition: scale var(--duration-animation) var(--anim-curve);
} }
.row-text-container { .row-text-container {