HoloTech/twitch-subathon-timer
1
0
Fork 1
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update appearence

Browse Source
This commit is contained in:
Interitio
2025-09-22 23:27:14 +10:00
parent 0de496bf3c
commit 524ab37bbb
2 changed files with 20 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
index.html
View File

@@ -9,13 +9,8 @@
</head> </head>
<body> <body>
<div class="timer-box"> <div class="timer-box">
<div class="timer-bg">
<div class="timer-time"> <div class="timer-time">
<span class="timer-time">00:00</span> 00:00
</div>
<div class="timer-details">
</div>
<div class="timer-details">
</div> </div>
</div> </div>
</body> </body>

37
timer.css
View File

@@ -1,35 +1,36 @@
:root { :root {
--break-color: #9020BA; --time-color: #453960;
--focus-color: #EED59F; --details-color: #403060;
--stage-color: var(--break-color); --background-color: transparent;
--clip-path: none; }
html, body {
height: 100%;
margin: 0;
padding: 0;
font-family: 'Inter', sans-serif;
background-color: var(--background-color);
overflow: hidden;
} }
.timer-box{ .timer-box {
height: 175px; height: 175px;
width: 397px; width: 397px;
padding: 5px; padding: 5px;
} }
.timer-time { .timer-time {
font-size: 100px; font-size: clamp(6rem, 22vw, 16rem);
font-family: Inter;
font-weight: 400; font-weight: 400;
letter-spacing: 0%; color: var(--time-color);
text-align: center; line-height: 1;
color: #453960;
} }
.timer-details { .timer-details {
display: fill; display: fill;
font-family: Inter;
font-weight: 600; font-weight: 600;
color: var(--details-color);
font-size: 16px; font-size: 16px;
justify-content: space-between; overflow-wrap: break-word;
align-items: center;
text-align: center;
width: 65%;
margin: auto;
color: #453960;
} }