Invario/Inventarsystem
3
1
Fork 0
Code Issues 9 Pull Requests Actions Packages Projects Releases 392 Wiki Activity

changes to the style
Release Inventarsystem / release-docker (push) Successful in 2m27s
Details

Browse Source
This commit is contained in:
AIIrondev
2026-09-14 10:24:45 +02:00
parent acfb633cda
commit 2c6043399e
3 changed files with 256 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Web/static/css/styles.css
+108
View File
@@ -31,6 +31,9 @@
--ui-text: #f8fafc;
--ui-text-muted: #94a3b8;
--ui-title: #ffffff;
--ui-overlay: #020617;
--ui-overlay-surface: #1e293b;
--ui-overlay-border: #64748b;
--ui-shadow-sm: 0 4px 12px rgba(0, 0, 0, 0.4), inset 0 0 0 1px rgba(255, 255, 255, 0.05);
--ui-shadow-md: 0 10px 30px rgba(0, 0, 0, 0.6), inset 0 0 0 1px rgba(255, 255, 255, 0.05);
@@ -39,6 +42,10 @@
--ui-btn-radius: 99px; /* Pillenform für Buttons */
}
:root[data-theme="dark"] {
color-scheme: dark;
}
/* Safe Area Support for iPad notches, Dynamic Island, and rounded corners */
html {
/* Ensure viewport-fit is respected */
@@ -1002,3 +1009,104 @@ html, body {
:root[data-theme="dark"] .favorite-item {
outline: 2px solid #f59e0b !important;
}
/* Keep overlays and dialogs sufficiently opaque for readable content. */
:root[data-theme="dark"] .modal,
:root[data-theme="dark"] .modal-backdrop,
:root[data-theme="dark"] .ui-modal-overlay,
:root[data-theme="dark"] .item-modal,
:root[data-theme="dark"] .reset-modal-overlay,
:root[data-theme="dark"] #onboarding-overlay,
:root[data-theme="dark"] [id$="-modal"][style*="inset"],
:root[data-theme="dark"] [id$="Modal"][style*="inset"] {
background-color: var(--ui-overlay) !important;
}
:root[data-theme="dark"] .modal-content,
:root[data-theme="dark"] .ui-modal-surface,
:root[data-theme="dark"] .reset-modal-container,
:root[data-theme="dark"] #onboarding-modal,
:root[data-theme="dark"] [id$="-modal"] > div,
:root[data-theme="dark"] [id$="Modal"] > div {
background-color: var(--ui-overlay-surface) !important;
color: var(--ui-text) !important;
border-color: var(--ui-overlay-border) !important;
}
/* Inline light surfaces must not become translucent or low-contrast in dark mode. */
:root[data-theme="dark"] [style*="background: white"],
:root[data-theme="dark"] [style*="background:#fff"],
:root[data-theme="dark"] [style*="background: #fff"],
:root[data-theme="dark"] [style*="background-color: white"],
:root[data-theme="dark"] [style*="background-color:#fff"],
:root[data-theme="dark"] [style*="background-color: #fff"] {
background-color: var(--ui-surface) !important;
color: var(--ui-text) !important;
}
/* Shared dark-mode surfaces for every template that extends base.html. */
:root[data-theme="dark"] .container,
:root[data-theme="dark"] .card,
:root[data-theme="dark"] .card-body,
:root[data-theme="dark"] .card-header,
:root[data-theme="dark"] .card-footer,
:root[data-theme="dark"] .content,
:root[data-theme="dark"] .form-card,
:root[data-theme="dark"] .form-container,
:root[data-theme="dark"] .upload-container,
:root[data-theme="dark"] .edit-container,
:root[data-theme="dark"] .admin-content-container,
:root[data-theme="dark"] .calendar-container,
:root[data-theme="dark"] .table-container,
:root[data-theme="dark"] .notice-card,
:root[data-theme="dark"] .settings-card,
:root[data-theme="dark"] .summary-card,
:root[data-theme="dark"] .invoice-card,
:root[data-theme="dark"] .student-card-form,
:root[data-theme="dark"] .user-management-container,
:root[data-theme="dark"] .error-container,
:root[data-theme="dark"] .library-filter-panel,
:root[data-theme="dark"] .library-items-table,
:root[data-theme="dark"] .info-box {
background-color: var(--ui-surface) !important;
color: var(--ui-text) !important;
border-color: var(--ui-border) !important;
}
:root[data-theme="dark"] .table,
:root[data-theme="dark"] .table-responsive,
:root[data-theme="dark"] .table > :not(caption) > *,
:root[data-theme="dark"] .table > :not(caption) > * > *,
:root[data-theme="dark"] .library-items-table td,
:root[data-theme="dark"] .library-items-table th {
background-color: var(--ui-surface) !important;
color: var(--ui-text) !important;
border-color: var(--ui-border) !important;
}
:root[data-theme="dark"] .table-striped > tbody > tr:nth-of-type(odd) > *,
:root[data-theme="dark"] .table-light,
:root[data-theme="dark"] .table-light > *,
:root[data-theme="dark"] .bg-white,
:root[data-theme="dark"] .bg-light,
:root[data-theme="dark"] .bg-body,
:root[data-theme="dark"] .bg-body-secondary {
background-color: var(--ui-surface-soft) !important;
color: var(--ui-text) !important;
}
:root[data-theme="dark"] .form-text,
:root[data-theme="dark"] .text-muted,
:root[data-theme="dark"] small,
:root[data-theme="dark"] .library-load-hint {
color: var(--ui-text-muted) !important;
}
/* White translucent template decorations become stable, readable surfaces. */
:root[data-theme="dark"] [style*="background: rgba(255,255,255"],
:root[data-theme="dark"] [style*="background: rgba(255, 255, 255"],
:root[data-theme="dark"] [style*="background-color: rgba(255,255,255"],
:root[data-theme="dark"] [style*="background-color: rgba(255, 255, 255"] {
background-color: var(--ui-surface-soft) !important;
color: var(--ui-text) !important;
}