luci-theme-material: fix unreadable text

Fix low-contrast text in dark mode that caused
labels to be hard to read.

Signed-off-by: Brian White <brianwhitedev1996@gmail.com>
This commit is contained in:
Brian White
2026-01-23 21:09:33 -03:00
committed by Paul Donald
parent ed4a3fa933
commit ef8ef56430
2 changed files with 41 additions and 10 deletions

View File

@@ -501,36 +501,36 @@ header > .fill > .container > .status > * {
.alert-message.notice,
.label.notice {
background-color: var(--notice-color);
color: var(--on-notice-color);
background-color: var(--notice-color) !important;
color: var(--on-notice-color) !important;
}
.alert-message.danger,
.btn.danger,
.label.danger {
background-color: var(--danger-color);
color: var(--on-danger-color);
background-color: var(--danger-color) !important;
color: var(--on-danger-color) !important;
}
.alert-message.warning,
.btn.warning,
.label.warning {
background-color: var(--warning-color);
color: var(--on-warning-color);
background-color: var(--warning-color) !important;
color: var(--on-warning-color) !important;
}
.alert-message.success,
.btn.success,
.label.success {
background-color: var(--success-color);
color: var(--on-success-color);
background-color: var(--success-color) !important;
color: var(--on-success-color) !important;
}
.alert-message.error,
.btn.error,
.label.error {
background-color: var(--on-error-color);
color: var(--error-color);
background-color: var(--error-color) !important;
color: var(--on-error-color) !important;
}
[data-indicator]:not([data-style="inactive"]) {
@@ -542,6 +542,17 @@ header > .fill > .container > .status > * {
margin-top: 1rem;
}
/* Fix for table text in notifications - ensures table content inherits notification colors */
.alert-message.notice table,
.alert-message.notice .table,
.alert-message.notice td,
.alert-message.notice th,
.alert-message.notice .td,
.alert-message.notice .th {
color: var(--on-notice-color) !important;
background: transparent !important;
}
.main > .main-left > .nav {
margin-top: .5rem;
}

View File

@@ -874,21 +874,30 @@ p > a {
}
.alert-message.info {
color: var(--secondary-bright-color);
background: var(--main-bright-color);
}
.alert-message.warning {
color: var(--secondary-bright-color);
background: var(--warning-color);
}
.alert-message.danger {
color: var(--secondary-bright-color);
background: var(--danger-color);
}
.alert-message.success {
color: var(--secondary-bright-color);
background: var(--success-color);
}
.alert-message.notice {
color: var(--main-bright-color);
background: var(--secondary-bright-color);
}
.alert-message .btn {
box-shadow: 0 0 2px var(--secondary-bright-color);
}
@@ -897,6 +906,17 @@ p > a {
box-shadow: 0 0 4px 1px var(--secondary-bright-color);
}
/* Fix for table text in notifications */
.alert-message.notice table,
.alert-message.notice .table,
.alert-message.notice td,
.alert-message.notice th,
.alert-message.notice .td,
.alert-message.notice .th {
color: var(--main-bright-color) !important;
background: transparent !important;
}
@keyframes fade-in {
0% { opacity: 0; }
100% { opacity: 1; }