Thomas/Bratonien-Adventskalender
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

adventskalender/2025/css/main.css aktualisiert

Browse Source
This commit is contained in:
Thomas Dannenberg
2025-11-04 11:53:16 +00:00
parent 8a49d1f6db
commit 51f445cb93
1 changed files with 19 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

39
adventskalender/2025/css/main.css
View File

@@ -45,29 +45,28 @@
background 0.2s ease; background 0.2s ease;
} }
/* Glitzer-Animation */
@keyframes glitter { @keyframes glitter {
0% { 0% { background-position: -200% 0; opacity: 0.0; }
background-position: -200% 0; 30% { opacity: 1; }
} 70% { opacity: 1; }
100% { 100% { background-position: 200% 0; opacity: 0.0; }
background-position: 200% 0;
}
} }
/* Hover-Effekt mit Glitzern */ /* Hover-Effekt mit goldenem Glitzern */
.door:hover { .door:hover::after {
content: "";
position: absolute;
inset: 0;
border-radius: inherit;
pointer-events: none;
/* goldener Lichtschimmer */
background: linear-gradient( background: linear-gradient(
110deg, 120deg,
color-mix(in srgb, var(--ci-gold) 40%, transparent) 0%, transparent 0%,
color-mix(in srgb, var(--ci-creamwhite) 50%, transparent) 45%, color-mix(in srgb, var(--ci-gold) 60%, transparent) 45%,
color-mix(in srgb, var(--ci-gold) 40%, transparent) 90% transparent 90%
); );
background-size: 200% 100%; background-size: 200% 100%;
animation: glitter 1.8s linear infinite; animation: glitter 1.8s ease-in-out 1;
box-shadow:
0 0 18px color-mix(in srgb, var(--ci-gold) 60%, transparent),
inset 0 0 12px rgba(255,255,255,0.4);
transform: scale(1.05);
}