From d0910dabe89d3f849326bd94f4bd23c2646dc846 Mon Sep 17 00:00:00 2001 From: durn Date: Tue, 21 Apr 2026 19:16:53 -0600 Subject: [PATCH] fixed check boxes --- src/main/resources/static/css/explore.css | 55 +++++++++++++++++++---- 1 file changed, 46 insertions(+), 9 deletions(-) diff --git a/src/main/resources/static/css/explore.css b/src/main/resources/static/css/explore.css index 86a0df9..c9e1898 100644 --- a/src/main/resources/static/css/explore.css +++ b/src/main/resources/static/css/explore.css @@ -25,12 +25,20 @@ font-style: normal; } +/* body, html { */ +/* height: 100vh; */ +/* margin: 0; */ +/* font-family: 'Mali', cursive; */ +/* background-color: var(--pale-yellow); */ +/* overflow: clip; */ +/* } */ + body, html { height: 100vh; margin: 0; font-family: 'Mali', cursive; background-color: var(--pale-yellow); - overflow: clip; + overflow: hidden; } /* ========================= @@ -199,22 +207,47 @@ body, html { color: var(--dusty-red-hover); font-size: 0.9em; margin: 8px 0 10px; + } #filter-form label { display: flex; align-items: center; gap: 4px; - font-size: 0.75em; + font-size: 0.9em; color: var(--dusty-red); - margin-bottom: 4px; + margin-bottom: 10px; + align-self: flex-start; + justify-content: flex-start; + } #filter-form input[type="checkbox"] { - accent-color: var(--dusty-red); - width: 16px; - height: 16px; + appearance: none; + -webkit-appearance: none; + width: 24px; + height: 24px; + border: 3px solid var(--dusty-red); + border-radius: 3px; + background: var(--pale-yellow); 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; justify-content: flex-start; align-items: flex-start; - overflow: auto; +/* overflow: auto; */ 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; flex: 1; scrollbar-color: var(--dusty-red) var(--pale-yellow); + padding-bottom: 80px; } @@ -448,4 +485,4 @@ a { .card-right { flex-shrink: 0; width: 50%; -} +} \ No newline at end of file