sigmasternchen/glitch-countdown
1
0
Fork 0
mirror of https://github.com/sigmasternchen/glitch-countdown synced 2025-03-15 10:38:53 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

style: Add start/end animations

Browse source
This commit is contained in:
overflowerror 2023-10-30 14:06:08 +01:00
parent 18dac39bd0
commit 9496cffe2d
1 changed files with 12 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

14
dist/main.css vendored
View file

@ -78,6 +78,8 @@ header h2:after {
#countdown .separator { #countdown .separator {
font-size: 12vw; font-size: 12vw;
opacity: 1;
transition: opacity 0.1s;
} }
#countdown.blink .separator { #countdown.blink .separator {
@ -89,8 +91,14 @@ header h2:after {
text-align: center; text-align: center;
height: 9.6vw; height: 9.6vw;
background: transparent; background: transparent;
border: solid; border: solid white;
transition: border 0.2s;
font-variant-numeric: tabular-nums; font-variant-numeric: tabular-nums;
box-sizing: border-box;
}
#countdown.counting input {
border: black;
} }
#countdown #days input { #countdown #days input {
@ -154,6 +162,8 @@ header h2:after {
line-height: 9vw; line-height: 9vw;
width: 3.5vw; width: 3.5vw;
text-align: center; text-align: center;
transition: opacity 0.2s;
opacity: 1;
left: calc(50% - 1.5vw); left: calc(50% - 1.5vw);
transform: rotate(90deg); transform: rotate(90deg);
cursor: pointer; cursor: pointer;
@ -169,7 +179,7 @@ header h2:after {
#countdown.counting .up, #countdown.counting .up,
#countdown.counting .down { #countdown.counting .down {
display: none; opacity: 0;
} }