whose-turn-is-it/index.css

46 lines
1 KiB
CSS
Raw Normal View History

2022-12-29 17:19:36 +01:00
.timer {
2022-12-30 13:28:28 +01:00
font-size: 10em;
font-weight: bold;
text-align: center;
line-height: 1.2;
2022-12-29 17:19:36 +01:00
}
2022-12-29 17:59:24 +01:00
@keyframes blinker {
2022-12-30 13:28:28 +01:00
50% {
opacity: 0.3;
2022-12-29 17:59:24 +01:00
}
2022-12-30 13:28:28 +01:00
}
2022-12-29 17:59:24 +01:00
.timer.my-turn {
2022-12-30 13:28:28 +01:00
color: #0f0;
animation: blinker 2s ease infinite;
2022-12-29 17:59:24 +01:00
}
2022-12-29 17:19:36 +01:00
.timer.over {
2022-12-30 13:28:28 +01:00
color: #f00;
animation: blinker 0.5s ease infinite;
}
.timer.loading {
2022-12-30 13:28:28 +01:00
font-size: 2em;
margin: auto;
margin-bottom: 2.5em;
margin-top: 2.5em;
}
2023-01-05 10:22:17 +01:00
.first-details {
padding-top: var(--spacing);
border-bottom: var(--border-width) solid var(--accordion-border-color);
border-top: var(--border-width) solid var(--accordion-border-color);
}
:is(button, input[type="submit"], input[type="button"], [role="button"]).outline.invalid, input[type="reset"].outline {
--color: var(--form-element-invalid-border-color);
--background-color: transparent;
}
:is(button, input[type="submit"], input[type="button"], [role="button"]).invalid, input[type="reset"] {
--background-color: var(--form-element-invalid-border-color);
--border-color: var(--form-element-invalid-border-color);
cursor: pointer;
}