Skip to content

Commit d9cfd8f

Browse files
authored
Merge pull request #26 from Revolution-Hacks/mini
i broke prod lol
2 parents 017afa6 + 4c0759f commit d9cfd8f

File tree

1 file changed

+49
-0
lines changed

1 file changed

+49
-0
lines changed

src/routes/mini/+page.svelte

Lines changed: 49 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -108,12 +108,61 @@
108108
margin: auto;
109109
gap: 1em;
110110
111+
@keyframes logo-a {
112+
0% {
113+
stroke-dasharray: 0 100;
114+
}
115+
116+
20% {
117+
stroke-dasharray: 100 100;
118+
}
119+
120+
100% {
121+
stroke-dasharray: 100 100;
122+
}
123+
}
124+
125+
@keyframes logo-b {
126+
0% {
127+
stroke-dasharray: 0 100;
128+
}
129+
130+
20% {
131+
stroke-dasharray: 0 100;
132+
}
133+
134+
100% {
135+
stroke-dasharray: 100 100;
136+
}
137+
}
138+
111139
:global(.logo) {
112140
/* I'm not sure why this is needed. Maybe because it's another component */
113141
grid-area: 1 / 1 / 1 / 1;
114142
width: 3em;
115143
height: 3em;
116144
align-self: center;
145+
146+
stroke: rgb(var(--fg));
147+
}
148+
149+
:global(.logo .a) {
150+
stroke-dasharray: 0 100;
151+
animation: 1s cubic-bezier(.05,.09,.23,1) logo-a forwards;
152+
animation-delay: 200ms;
153+
}
154+
155+
:global(.logo .b) {
156+
stroke-dasharray: 0 100;
157+
animation: 1s cubic-bezier(.05,.09,.23,1) logo-b forwards;
158+
animation-delay: 200ms;
159+
}
160+
161+
@media (prefers-reduced-motion) {
162+
:global(.logo .a), :global(.logo .b) {
163+
animation: none;
164+
stroke-dasharray: 100 100;
165+
}
117166
}
118167
119168
.header {

0 commit comments

Comments
 (0)