added support for legacy tickets, fixed switching of modes and also style updates
This commit is contained in:
@@ -683,3 +683,27 @@ html.dark .doc-content code {
|
||||
}
|
||||
.doc-pagination nav span[aria-disabled="true"] > span { color: #697180 !important; cursor: not-allowed; }
|
||||
.doc-pagination nav svg { width: 1rem; height: 1rem; }
|
||||
|
||||
/* Appearance integration: every Documentation surface follows the root switch. */
|
||||
html:not(.dark) body.documentation-module { background:#f4f6f8; }
|
||||
html:not(.dark) .doc-hero {
|
||||
color:#111827;
|
||||
background:linear-gradient(135deg,#ffffff 0%,#f8fafc 48%,#eef4ff 100%);
|
||||
}
|
||||
html:not(.dark) .doc-hero h1 { color:#111827; }
|
||||
html:not(.dark) .doc-eyebrow { color:#41658f; }
|
||||
html:not(.dark) .doc-hero p { color:#667085; }
|
||||
html:not(.dark) .doc-hero-wrap,
|
||||
html:not(.dark) .doc-card { background:#ffffff; border-color:#d8dee7; }
|
||||
html:not(.dark) .doc-card-header { border-color:#e2e8f0; }
|
||||
|
||||
html.dark body.documentation-module { background:#0b0e13; }
|
||||
html.dark .doc-hero-wrap,
|
||||
html.dark .doc-card { background:var(--doc-panel); border-color:var(--doc-line); }
|
||||
html.dark .doc-hero {
|
||||
color:#ffffff;
|
||||
background:linear-gradient(135deg,#020617 0%,#0f172a 48%,#172554 100%);
|
||||
}
|
||||
html.dark .doc-hero h1 { color:#ffffff; }
|
||||
html.dark .doc-eyebrow { color:#bfdbfe; }
|
||||
html.dark .doc-hero p { color:rgba(219,234,254,.9); }
|
||||
|
||||
@@ -2497,118 +2497,102 @@ html:not(.dark) .hd-appearance-choice.is-active { background: #fff; color: #1118
|
||||
color: #3b82f6 !important;
|
||||
}
|
||||
|
||||
/* ========================================================================
|
||||
Appearance switch: final application-wide neutral surface normalisation
|
||||
Keep semantic/action colours, but every neutral view follows html.dark.
|
||||
======================================================================== */
|
||||
html:not(.dark) .hd-dashboard-heading h1,
|
||||
html:not(.dark) .hd-metric-card strong,
|
||||
html:not(.dark) .hd-dashboard-card > header h2,
|
||||
html:not(.dark) .hd-donut span,
|
||||
html:not(.dark) .hd-priority-legend strong,
|
||||
html:not(.dark) .hd-page-hero h1,
|
||||
html:not(.dark) .hd-role-card h2,
|
||||
html:not(.dark) .hd-role-card strong {
|
||||
color: #111827 !important;
|
||||
/* ============================================================
|
||||
LIGHT APPEARANCE — COMPLETE MODULE SURFACE OVERRIDES
|
||||
Keep semantic/action colours, but remove hard-coded dark chrome.
|
||||
============================================================ */
|
||||
html:not(.dark) .hd-page-hero {
|
||||
background: linear-gradient(115deg,#ffffff,#eef4ff) !important;
|
||||
border-color:#d8dee7 !important;
|
||||
box-shadow:0 1px 2px rgba(15,23,42,.06) !important;
|
||||
}
|
||||
|
||||
html:not(.dark) .hd-dashboard-heading p,
|
||||
html:not(.dark) .hd-metric-card small,
|
||||
html:not(.dark) .hd-metric-card em,
|
||||
html:not(.dark) .hd-chart-legend,
|
||||
html:not(.dark) .hd-chart-labels,
|
||||
html:not(.dark) .hd-priority-legend > div,
|
||||
html:not(.dark) .hd-latest-list small,
|
||||
html:not(.dark) .hd-latest-list time,
|
||||
html:not(.dark) .hd-requester-list em,
|
||||
html:not(.dark) .hd-empty,
|
||||
html:not(.dark) .hd-page-hero p,
|
||||
html:not(.dark) .hd-role-card p,
|
||||
html:not(.dark) .hd-field span,
|
||||
html:not(.dark) .hd-role-options small {
|
||||
color: #667085 !important;
|
||||
}
|
||||
|
||||
html:not(.dark) .hd-range-select,
|
||||
html:not(.dark) .hd-metric-card,
|
||||
html:not(.dark) .hd-dashboard-card,
|
||||
html:not(.dark) .hd-page-hero h1 { color:#111827 !important; }
|
||||
html:not(.dark) .hd-page-hero p { color:#667085 !important; }
|
||||
html:not(.dark) .hd-eyebrow { color:#41658f !important; }
|
||||
html:not(.dark) .hd-panel,
|
||||
html:not(.dark) .hd-role-card,
|
||||
html:not(.dark) .hd-role-options label {
|
||||
background: #ffffff !important;
|
||||
border-color: #d8dee7 !important;
|
||||
color: #1f2937 !important;
|
||||
box-shadow: 0 8px 24px rgba(15, 23, 42, .06) !important;
|
||||
html:not(.dark) .helpdesk-kanban-column,
|
||||
html:not(.dark) .hd-dashboard-card,
|
||||
html:not(.dark) .hd-role-card {
|
||||
background:#ffffff !important;
|
||||
border-color:#d8dee7 !important;
|
||||
color:#1f2937 !important;
|
||||
}
|
||||
|
||||
html:not(.dark) .hd-range-select select,
|
||||
html:not(.dark) .hd-search-field input,
|
||||
html:not(.dark) .hd-field input {
|
||||
color: #1f2937 !important;
|
||||
}
|
||||
|
||||
html:not(.dark) .hd-dashboard-card > header,
|
||||
html:not(.dark) .hd-latest-list > a,
|
||||
html:not(.dark) .hd-requester-list > div,
|
||||
html:not(.dark) .hd-toolbar,
|
||||
html:not(.dark) .hd-dashboard-card>header,
|
||||
html:not(.dark) .hd-latest-list>a,
|
||||
html:not(.dark) .hd-requester-list>div,
|
||||
html:not(.dark) .hd-table th,
|
||||
html:not(.dark) .hd-table td {
|
||||
border-color: #e2e8f0 !important;
|
||||
border-color:#e2e8f0 !important;
|
||||
}
|
||||
|
||||
html:not(.dark) .hd-dashboard-card > header a,
|
||||
html:not(.dark) .hd-action,
|
||||
html:not(.dark) .hd-search-field,
|
||||
html:not(.dark) .hd-toolbar { background:#f8fafc !important; }
|
||||
html:not(.dark) .hd-search-field {
|
||||
background:#ffffff !important;
|
||||
border-color:#cfd6e1 !important;
|
||||
color:#667085 !important;
|
||||
}
|
||||
html:not(.dark) .hd-search-field input { color:#1f2937 !important; }
|
||||
html:not(.dark) .hd-table th { background:#f3f5f8 !important; color:#667085 !important; }
|
||||
html:not(.dark) .hd-table td { background:#ffffff !important; color:#1f2937 !important; }
|
||||
html:not(.dark) .hd-table tbody tr:hover td { background:#f8fafc !important; }
|
||||
html:not(.dark) .hd-action:not(.hd-action-blue):not(.hd-action-green):not(.hd-action-red) {
|
||||
background:#ffffff !important; border-color:#cfd6e1 !important; color:#1f2937 !important;
|
||||
}
|
||||
html:not(.dark) .hd-role-card h2,
|
||||
html:not(.dark) .hd-role-card strong,
|
||||
html:not(.dark) .hd-dashboard-card>header h2 { color:#111827 !important; }
|
||||
html:not(.dark) .hd-role-card p,
|
||||
html:not(.dark) .hd-dashboard-card>header span,
|
||||
html:not(.dark) .hd-dashboard-card>header a,
|
||||
html:not(.dark) .hd-requester-list em,
|
||||
html:not(.dark) .hd-empty { color:#667085 !important; }
|
||||
html:not(.dark) .hd-metric-card {
|
||||
background:linear-gradient(145deg,#ffffff,#f8fafc) !important;
|
||||
border-color:#d8dee7 !important;
|
||||
box-shadow:0 8px 20px rgba(15,23,42,.07) !important;
|
||||
}
|
||||
html:not(.dark) .hd-donut:after { background:#ffffff !important; }
|
||||
html:not(.dark) .hd-donut span,
|
||||
html:not(.dark) .hd-priority-legend strong { color:#111827 !important; }
|
||||
html:not(.dark) .hd-priority-legend>div,
|
||||
html:not(.dark) .hd-latest-list>a { color:#374151 !important; }
|
||||
html:not(.dark) .hd-latest-list>a:hover { background:#f8fafc !important; }
|
||||
html:not(.dark) .hd-chart-grid-lines line { stroke:#d8dee7 !important; }
|
||||
html:not(.dark) .hd-form-grid .hd-field span { color:#374151 !important; }
|
||||
html:not(.dark) .hd-field input {
|
||||
background: #f8fafc !important;
|
||||
border-color: #d8dee7 !important;
|
||||
color: #374151 !important;
|
||||
background:#ffffff !important; color:#1f2937 !important; border-color:#cfd6e1 !important;
|
||||
}
|
||||
html:not(.dark) .hd-role-options label { background:#ffffff !important; border-color:#d8dee7 !important; }
|
||||
html:not(.dark) .hd-role-options small { color:#667085 !important; }
|
||||
html:not(.dark) .hd-kanban-drag-handle {
|
||||
background:#f3f5f8 !important; border-color:#d8dee7 !important; color:#667085 !important;
|
||||
}
|
||||
html:not(.dark) .hd-kanban-drag-handle:hover { background:#e9eef5 !important; color:#111827 !important; }
|
||||
|
||||
html:not(.dark) .hd-dashboard-card > header a:hover,
|
||||
html:not(.dark) .hd-latest-list > a:hover,
|
||||
html:not(.dark) .hd-action:hover {
|
||||
background: #eef2f7 !important;
|
||||
color: #111827 !important;
|
||||
}
|
||||
|
||||
html:not(.dark) .hd-latest-list > a,
|
||||
html:not(.dark) .hd-table td,
|
||||
html:not(.dark) .hd-priority-legend strong {
|
||||
color: #374151 !important;
|
||||
}
|
||||
|
||||
html:not(.dark) .hd-table th {
|
||||
background: #f8fafc !important;
|
||||
color: #667085 !important;
|
||||
}
|
||||
|
||||
/* The page hero is a neutral container. Accent buttons/badges keep their colour. */
|
||||
html:not(.dark) .hd-page-hero {
|
||||
background: linear-gradient(115deg, #ffffff, #f1f5f9) !important;
|
||||
border-color: #d8dee7 !important;
|
||||
box-shadow: 0 8px 24px rgba(15, 23, 42, .06) !important;
|
||||
}
|
||||
html:not(.dark) .hd-eyebrow { color: #2563eb !important; }
|
||||
|
||||
/* Neutral Tailwind surfaces used by module views. */
|
||||
html.dark .bg-white { background-color: #18181b !important; }
|
||||
html.dark .bg-zinc-50,
|
||||
html.dark .bg-zinc-100 { background-color: #27272a !important; }
|
||||
html.dark .text-zinc-900,
|
||||
html.dark .text-zinc-800,
|
||||
html.dark .text-zinc-700 { color: #f4f4f5 !important; }
|
||||
html.dark .border-zinc-200,
|
||||
html.dark .border-zinc-300 { border-color: #3f3f46 !important; }
|
||||
|
||||
/* Native controls must follow the selected colour scheme in every module. */
|
||||
html:not(.dark) .hd-shell-main input:not([type="checkbox"]):not([type="radio"]):not([type="color"]):not([type="file"]),
|
||||
html:not(.dark) .hd-shell-main textarea,
|
||||
html:not(.dark) .hd-shell-main select {
|
||||
color-scheme: light;
|
||||
}
|
||||
html.dark .hd-shell-main input:not([type="checkbox"]):not([type="radio"]):not([type="color"]):not([type="file"]),
|
||||
html.dark .hd-shell-main textarea,
|
||||
html.dark .hd-shell-main select {
|
||||
color-scheme: dark;
|
||||
/* Tailwind utility surfaces used directly by Helpdesk Blade views. */
|
||||
html:not(.dark) .bg-black,
|
||||
html:not(.dark) .bg-slate-950,
|
||||
html:not(.dark) .bg-slate-900,
|
||||
html:not(.dark) .bg-slate-800,
|
||||
html:not(.dark) .bg-slate-700,
|
||||
html:not(.dark) .bg-slate-600,
|
||||
html:not(.dark) .bg-neutral-950,
|
||||
html:not(.dark) .bg-neutral-900,
|
||||
html:not(.dark) .bg-neutral-800 {
|
||||
background-color:#ffffff !important;
|
||||
}
|
||||
html:not(.dark) [class*="bg-slate-950/"],
|
||||
html:not(.dark) [class*="bg-slate-900/"],
|
||||
html:not(.dark) [class*="bg-black/"] { background-color:#ffffff !important; }
|
||||
html:not(.dark) [class*="border-slate-"],
|
||||
html:not(.dark) [class*="border-neutral-"] { border-color:#d8dee7 !important; }
|
||||
html:not(.dark) [class*="text-slate-100"],
|
||||
html:not(.dark) [class*="text-slate-200"],
|
||||
html:not(.dark) [class*="text-neutral-100"],
|
||||
html:not(.dark) [class*="text-neutral-200"] { color:#1f2937 !important; }
|
||||
html:not(.dark) [class*="text-slate-300"],
|
||||
html:not(.dark) [class*="text-neutral-300"] { color:#374151 !important; }
|
||||
html:not(.dark) [class*="text-slate-400"],
|
||||
html:not(.dark) [class*="text-slate-500"],
|
||||
html:not(.dark) [class*="text-neutral-400"],
|
||||
html:not(.dark) [class*="text-neutral-500"] { color:#667085 !important; }
|
||||
|
||||
Reference in New Issue
Block a user