angestoepselt/homepage
5
0
Fork 0
mirror of https://codeberg.org/angestoepselt/homepage.git synced 2025-05-24 14:46:16 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Tweak logo animation

Browse source
This commit is contained in:
Yannik Rödel 2022-06-12 20:25:29 +02:00
parent 406824c122
commit be143ae1ed
1 changed files with 10 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
styles/components/_site.scss
View file

@ -17,12 +17,13 @@
> .angestoepselt-logo {
height: 1em;
vertical-align: middle;
transition: stroke motion.$subtle;
fill: none;
stroke-linecap: round;
stroke-linejoin: round;
stroke-width: 4px;
stroke: colors.$gray-900;
stroke: currentColor;
stroke-miterlimit: 10;
.plug {
@ -35,6 +36,13 @@
}
&:hover > .angestoepselt-logo {
stroke: currentColor;
.plug {
fill: colors.$yellow-500;
transition: fill #{0.5 * motion.$prominent-duration} motion.$prominent-timing;
}
@keyframes angestoepselt-logo-hover {
0% {
transform: none;
@ -43,7 +51,7 @@
transform: translateX(0.6rem);
}
100% {
transform: translateX(-0.6rem);
transform: translateX(-0.4rem);
}
}