64 lines
1.1 KiB
CSS
64 lines
1.1 KiB
CSS
@import url(palette.css);
|
|
|
|
.clock {
|
|
display: flex;
|
|
justify-content: space-around;
|
|
align-content: center;
|
|
align-items: center;
|
|
height: 5rem;
|
|
}
|
|
|
|
.clock .analog-clock {
|
|
width: 4rem;
|
|
height: 4rem;
|
|
}
|
|
|
|
.clock .digital-clock {
|
|
height: 75%;
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
}
|
|
|
|
.clock .digital-clock .time {
|
|
margin: 0;
|
|
}
|
|
|
|
.clock .led-off,
|
|
.clock .led-on {
|
|
font-family: "dseg14-regular";
|
|
font-size: 1rem;
|
|
overflow: hidden;
|
|
white-space: nowrap;
|
|
text-align: left;
|
|
}
|
|
|
|
.clock .led-off {
|
|
position: relative;
|
|
margin: 0 auto;
|
|
color: var(--background-100);
|
|
background-color: var(--background-50);
|
|
border: .2em solid var(--background-50);
|
|
}
|
|
|
|
.clock .led-on {
|
|
position: absolute;
|
|
top: 0;
|
|
width: 100%;
|
|
color: var(--primary-500);
|
|
}
|
|
|
|
.clock .slider .text-spacing {
|
|
padding: 0 0.5em;
|
|
}
|
|
|
|
.clock .slider {
|
|
display: flex;
|
|
justify-content: space-evenly;
|
|
align-items: center;
|
|
}
|
|
|
|
.slider .option {
|
|
width: 3em;
|
|
} |