fixed check boxes

This commit is contained in:
durn
2026-04-21 19:16:53 -06:00
parent 18e58ca5a5
commit d0910dabe8
+46 -9
View File
@@ -25,12 +25,20 @@
font-style: normal; font-style: normal;
} }
/* body, html { */
/* height: 100vh; */
/* margin: 0; */
/* font-family: 'Mali', cursive; */
/* background-color: var(--pale-yellow); */
/* overflow: clip; */
/* } */
body, html { body, html {
height: 100vh; height: 100vh;
margin: 0; margin: 0;
font-family: 'Mali', cursive; font-family: 'Mali', cursive;
background-color: var(--pale-yellow); background-color: var(--pale-yellow);
overflow: clip; overflow: hidden;
} }
/* ========================= /* =========================
@@ -199,22 +207,47 @@ body, html {
color: var(--dusty-red-hover); color: var(--dusty-red-hover);
font-size: 0.9em; font-size: 0.9em;
margin: 8px 0 10px; margin: 8px 0 10px;
} }
#filter-form label { #filter-form label {
display: flex; display: flex;
align-items: center; align-items: center;
gap: 4px; gap: 4px;
font-size: 0.75em; font-size: 0.9em;
color: var(--dusty-red); color: var(--dusty-red);
margin-bottom: 4px; margin-bottom: 10px;
align-self: flex-start;
justify-content: flex-start;
} }
#filter-form input[type="checkbox"] { #filter-form input[type="checkbox"] {
accent-color: var(--dusty-red); appearance: none;
width: 16px; -webkit-appearance: none;
height: 16px; width: 24px;
height: 24px;
border: 3px solid var(--dusty-red);
border-radius: 3px;
background: var(--pale-yellow);
cursor: pointer; cursor: pointer;
position: relative;
}
#filter-form input[type="checkbox"]:checked {
background: var(--dusty-red);
}
#filter-form input[type="checkbox"]:checked::after {
content: "✔";
position: absolute;
color: var(--pale-yellow);
font-size: 20px;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
font-family: 'Delius Swash Caps', cursive;;
font-weight: 400;
} }
/* ========================= /* =========================
@@ -227,9 +260,12 @@ body, html {
flex-direction: column; flex-direction: column;
justify-content: flex-start; justify-content: flex-start;
align-items: flex-start; align-items: flex-start;
overflow: auto; /* overflow: auto; */
scrollbar-color: var(--dusty-red) var(--pale-yellow); scrollbar-color: var(--dusty-red) var(--pale-yellow);
height: auto; /* height: auto; */
height: calc(100vh - 40px); /* subtract header height */
overflow-y: auto;
padding-bottom: 40px;
} }
@@ -375,6 +411,7 @@ input[type="search"]::-webkit-search-cancel-button {
overflow-y: auto; overflow-y: auto;
flex: 1; flex: 1;
scrollbar-color: var(--dusty-red) var(--pale-yellow); scrollbar-color: var(--dusty-red) var(--pale-yellow);
padding-bottom: 80px;
} }
@@ -448,4 +485,4 @@ a {
.card-right { .card-right {
flex-shrink: 0; flex-shrink: 0;
width: 50%; width: 50%;
} }