created space for more settings

2025-05-26 09:46:24 +02:00
parent 026b899db3
commit 86cc6bbff2
8 changed files with 476 additions and 295 deletions
--- a/static/css/settings.css
+++ b/static/css/settings.css
@@ -0,0 +1,108 @@
+/* TEST - This should make all nav links bright red */
+.card-header-tabs .nav-link {
+    color: var(--text-muted);
+    background: var(--bg-light);
+    border: none;
+    padding: 0.75rem 1.25rem;
+    font-weight: 500;
+    transition: all 0.2s;
+    margin-right: 0.5rem;
+    border-radius: 0.375rem 0.375rem 0 0;
+}
+
+:root {
+    --bs-nav-link-color: var(--text-muted) !important;
+    --bs-nav-link-hover-color: var(--primary-color) !important;
+    --bs-nav-link-disabled-color: var(--text-muted) !important;
+    --bs-nav-link-active-color: var(--primary-color) !important;
+}
+
+/* Override base nav-link styles */
+.card-header-tabs .nav-link,
+.card-header-tabs .nav-link:focus,
+.card-header-tabs .nav-link:hover,
+.card-header-tabs .nav-link.active,
+.card-header-tabs .nav-item.show .nav-link {
+    color: var(--text-muted);
+}
+
+.card-header-tabs .nav-link:hover,
+.card-header-tabs .nav-link:focus,
+.card-header-tabs .nav-link.active,
+.card-header-tabs .nav-item.show .nav-link {
+    color: var(--primary-color);
+}
+
+.nav-tabs {
+    border-bottom: 1px solid var(--border-light);
+}
+
+.card-header-tabs .nav-link:hover {
+    color: var(--primary-color);
+    background: var(--primary-bg-light);
+    border: none;
+}
+
+.card-header-tabs .nav-link.active {
+    color: var(--primary-color);
+    background: var(--white);
+    border: none;
+    border-bottom: 2px solid var(--primary-color);
+    font-weight: 600;
+}
+
+.card-header-tabs .nav-link i {
+    width: 1.25rem;
+    text-align: center;
+    color: var(--primary-color);
+    opacity: 0.7;
+}
+
+.card-header-tabs .nav-link.active i {
+    opacity: 1;
+}
+
+.card-header {
+    border-bottom: 1px solid var(--border-light);
+    padding: 1rem;
+    background: var(--bg-light);
+}
+
+.card-header-tabs {
+    margin: -0.5rem -1rem;
+    padding: 0.5rem 1rem;
+}
+
+.tab-content {
+    padding: 1.5rem;
+    background: var(--white);
+    border-radius: 0 0 0.375rem 0.375rem;
+}
+
+/* Override Bootstrap's default tab colors */
+.card-header-tabs .nav-link:focus,
+.card-header-tabs .nav-link:hover {
+    border-color: transparent;
+    isolation: isolate;
+}
+
+.card-header-tabs .nav-link.active,
+.card-header-tabs .nav-item.show .nav-link {
+    background-color: var(--white);
+    border-color: transparent transparent var(--primary-color);
+}
+
+/* Override Bootstrap's default text colors */
+.nav-tabs .nav-link,
+.nav-tabs .nav-link:focus,
+.nav-tabs .nav-link:hover,
+.nav-tabs .nav-link.active,
+.nav-tabs .nav-item.show .nav-link {
+    color: var(--text-muted) !important;
+}
+
+.nav-tabs .nav-link:hover,
+.nav-tabs .nav-link.active,
+.nav-tabs .nav-item.show .nav-link {
+    color: var(--primary-color) !important;
+}