From df937c43cbe9617a0278c4845730ec8eb56e94e6 Mon Sep 17 00:00:00 2001 From: Leonardo Brandenberger Date: Thu, 26 Feb 2026 04:03:20 +0100 Subject: [PATCH] Update css/custom.css ui update --- css/custom.css | 193 ++++++++++++++++++++++++++++++++----------------- 1 file changed, 127 insertions(+), 66 deletions(-) diff --git a/css/custom.css b/css/custom.css index 6cd33cc..a743c8b 100644 --- a/css/custom.css +++ b/css/custom.css @@ -1,73 +1,134 @@ -.activeWatch { - background-color: lightgray; -} +/* css/custom.css */ +/* Keep Bootstrap in control. Only add gentle, modern enhancements. */ -h2 { - margin-left: 10px; - margin-top: 25px !important; -} - -.table-bordered { - width: 100%; - table-layout: fixed; - text-align: center; - /*border: 1px solid #0e0017 !important;*/ - -} - -td { - overflow-wrap: break-word; -} - -button { - /*background-color: lightgray;*/ - /*border: none;*/ - /*color: white;*/ - padding: 1% 5%; - text-align: center; - text-decoration: none; - display: inline-block; - /*font-size: 16px;*/ - border-radius: 20px; -} - -button, .form-group{ - margin: 5px !important; -} - -input { - text-align: center; -} - -.stopButton, .resetButton { - width: 98% !important; -} - -.form-group { - width: 98%; -} - -.tableHeader { - min-width: 100px; +:root { + --silias-radius: 14px; } html, body { - height: 100%; - margin: 0; -} -.wrapper { - min-height: 100%; - - /* Equal to height of footer */ - /* But also accounting for potential margin-bottom of last child */ - margin-bottom: -240px; -} -footer, -.push { - height: 300px; + height: 100%; } -.footer { - vertical-align: top; - text-align: left; +body { + /* Bootstrap uses system font stack, keep it */ + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; +} + +/* Navbar */ +.navbar-brand { + letter-spacing: 0.2px; +} + +/* Card polish */ +.card { + border-radius: var(--silias-radius); +} +.card.shadow-sm { + box-shadow: 0 10px 25px rgba(0,0,0,.06) !important; +} + +/* Form */ +.form-label { + font-weight: 600; +} + +.form-text { + color: #6c757d; +} + +.form-control, +.form-select { + border-radius: 0.75rem; +} + +.form-control:focus, +.form-select:focus { + box-shadow: 0 0 0 .2rem rgba(13,110,253,.15); +} + +/* Buttons: DO NOT globally style "button" tag */ +.btn { + border-radius: 0.85rem; +} +.btn-lg { + padding-top: .85rem; + padding-bottom: .85rem; +} + +/* Scroll panels (if you keep class from index.php) */ +.scrollWindow { + border-radius: 1rem; +} + +/* Checkbox rows */ +.form-check { + padding: .25rem 0; +} +.form-check-input { + cursor: pointer; +} +.form-check-label { + cursor: pointer; +} + +/* Alerts */ +.alert { + border-radius: 0.9rem; +} + +/* Footer */ +footer { + margin-top: 0; +} +footer a { + text-decoration: none; +} +footer a:hover { + text-decoration: underline; +} + +/* Small badges look nicer */ +.badge { + border-radius: 999px; + padding: .45rem .7rem; +} + +/* Optional: make long checkbox lists easier to scan */ +.scrollWindow .form-check + .form-check { + border-top: 1px solid rgba(0,0,0,.04); +} +.scrollWindow .form-check { + padding: .35rem .25rem; +} + +/* Ensure links inside muted text are readable */ +.text-muted a { + color: inherit; +} +.text-muted a:hover { + color: #0d6efd; +} + +/* Mobile tweaks */ +@media (max-width: 576px) { + .card-body { + padding: 1.25rem !important; + } +} +/* Fix: checkboxes not clipped and never overlap text */ +.scrollWindow .form-check { + padding-left: 0 !important; /* remove bootstrap offset */ + margin: 0 !important; +} + +.scrollWindow .form-check-input { + margin-left: 0 !important; /* remove negative margin */ + float: left; /* classic layout */ +} + +.scrollWindow .form-check-label { + display: block; + padding-left: 1.6rem; /* space for the checkbox */ + line-height: 1.4; } \ No newline at end of file