93 lines
1.7 KiB
CSS

#filename {
font-size: 80%;
font-style: italic;
}
#unsaved {
color: #9d4916;
font-size: 80%;
&:not(.show) {
display: none;
}
}
table {
border-collapse: collapse;
width: 100%;
th, td {
padding: 0.4em 0.8em;
}
tbody {
tr {
&:nth-child(even) {
background-color: #ececec;
}
td {
text-align: center;
}
}
}
}
input[type="checkbox"] {
--size: 0.6em;
--pad: 0.2em;
width: calc((var(--size) * 2 + var(--pad)) * 2);
height: calc((var(--size) + var(--pad)) * 2);
border-radius: calc(var(--size) + var(--pad));
appearance: none;
background-color: #e1e1e1;
position: relative;
cursor: pointer;
&::after {
content: "";
width: calc(var(--size) * 2);
height: calc(var(--size) * 2);
border-radius: calc(var(--size));
background-color: #9b9b9b;
position: absolute;
top: 50%;
left: var(--pad);
transform: translateY(-50%);
}
&:checked {
background-color: #daf0d1;
&::after {
left: auto;
right: var(--pad);
background-color: #6ee74a;
}
}
}
.popup {
display: grid;
place-items: center;
position: fixed;
inset: 0;
background-color: #5c5c5c5c;
&:not(.show) {
display: none;
}
.container {
padding: 1.2em;
border-radius: 0.4em;
background-color: white;
display: flex;
flex-direction: column;
gap: 0.8em;
.title {
text-align: center;
}
}
}