From bcbffb62aa66569549bfe3d14b998a5b2abf8d8f Mon Sep 17 00:00:00 2001 From: Yasen Pramatarov Date: Thu, 20 Nov 2025 12:09:41 +0200 Subject: [PATCH] Adds CSS for dashboard widgets --- public_html/static/css/main.css | 102 ++++++++++++++++++++++++++++++++ 1 file changed, 102 insertions(+) diff --git a/public_html/static/css/main.css b/public_html/static/css/main.css index 9a9676a..2f32f4f 100644 --- a/public_html/static/css/main.css +++ b/public_html/static/css/main.css @@ -5,6 +5,108 @@ html, body { padding: 0; } +/* Dashboard widgets */ +.tm-widget-card { + background: rgba(255, 255, 255, 0.97); + border-radius: 1.25rem; + box-shadow: 0 20px 45px rgba(15, 23, 42, 0.08); + padding: 1.75rem; + margin-bottom: 1.75rem; +} + +.tm-widget-header { + display: flex; + justify-content: space-between; + align-items: flex-start; + gap: 1rem; + margin-bottom: 1rem; +} + +.tm-widget-eyebrow { + text-transform: uppercase; + font-size: 0.7rem; + letter-spacing: 0.2em; + color: #94a3b8; + margin-bottom: 0.3rem; +} + +.tm-widget-title { + background: none; + border: none; + padding: 0; + margin: 0; + font-size: 1.35rem; + font-weight: 600; + color: #0f172a; + display: flex; + align-items: center; + gap: 0.5rem; + cursor: pointer; +} + +.tm-widget-title:focus { + outline: none; +} + +.tm-widget-chevron { + font-size: 0.85rem; + color: #94a3b8; +} + +.tm-widget-tools { + display: flex; + gap: 0.75rem; + align-items: center; +} + +.tm-widget-tools #filter_form { + display: flex; + gap: 0.5rem; + flex-wrap: wrap; + align-items: center; +} + +.tm-widget-tools #filter_form input[type="text"], +.tm-widget-tools #filter_form input[type="date"] { + padding: 0.4rem 0.75rem; + border-radius: 0.6rem; + border: 1px solid rgba(148, 163, 184, 0.7); + font-size: 0.85rem; +} + +.tm-widget-tools #filter_form input[type="button"], +.tm-widget-tools #filter_form input[type="submit"] { + border-radius: 0.6rem; + padding: 0.4rem 0.75rem; + border: none; + background: #1d4ed8; + color: white; + font-size: 0.85rem; + cursor: pointer; +} + +.tm-widget-body { + border-top: 1px solid rgba(148, 163, 184, 0.2); + padding-top: 1rem; +} + +.tm-widget-table thead { + background: rgba(15, 23, 42, 0.85); + color: #fff; +} + +.tm-widget-table th, +.tm-widget-table td { + vertical-align: middle; + border-color: rgba(148, 163, 184, 0.3); +} + +.tm-widget-empty { + margin: 1rem 0; + color: #94a3b8; + font-style: italic; +} + /* Credentials management */ .tm-cred-card { max-width: 900px;