diff --git a/src/main/resources/static/css/case-management.css b/src/main/resources/static/css/case-management.css index 0cfb1c9..85cce48 100644 --- a/src/main/resources/static/css/case-management.css +++ b/src/main/resources/static/css/case-management.css @@ -1,346 +1,144 @@ -:root { - --color-bg: #161a2d; - --color-surface: #1f2544; - --color-surface-soft: #2a315c; - --color-primary: #6017a8; - --color-primary-hover: #7433bd; - --color-accent: #00d4ff; - --color-text: #ffffff; - --color-muted: #a0a0b0; - --color-success: #7cfc98; - --color-error: #ff9b9b; - --color-border: rgba(255, 255, 255, 0.14); - --color-input-bg: rgba(255, 255, 255, 0.08); - --color-row-bg: rgba(255, 255, 255, 0.05); - --shadow-panel: 0 10px 25px rgba(0, 0, 0, 0.22); -} - #content-area { - background: var(--color-bg); + padding: 28px; + background: #f4f6fb; min-height: 100vh; } -.case-management-wrapper { - display: grid; - grid-template-columns: 320px 1fr 1fr; - gap: 20px; - padding: 20px; - align-items: start; -} - -.case-panel { - background: var(--color-surface); - color: var(--color-text); - border-radius: 20px; - padding: 24px; - min-height: 70vh; - box-shadow: var(--shadow-panel); -} - -.case-panel h2 { - margin: 0 0 16px; - font-size: 2rem; - line-height: 1.2; - color: var(--color-text); -} - -.case-panel h3 { - margin: 0 0 12px; - font-size: 1.15rem; - color: var(--color-text); -} - -.case-panel p, -.case-panel label, -.case-panel strong { - color: var(--color-text); -} - -.case-panel span { - color: inherit; -} - -.registry-panel-content, -.case-record-panel-content, +.case-management-page, +.case-management-container, .case-detail-panel-content { - color: var(--color-text); + max-width: 1100px; } -.feedback-message { +#content-area h1, +#content-area h2, +#content-area h3 { margin: 0 0 12px; - font-size: 0.95rem; + color: #111827; } -.success-message { - color: var(--color-success); +#content-area h1 { + font-size: 32px; } -.error-message { - color: var(--color-error); +#content-area h2 { + font-size: 26px; } -.section-divider { - margin: 20px 0; - border: none; - border-top: 1px solid var(--color-border); +#content-area h3 { + font-size: 21px; } -.form-section-title { - margin: 20px 0 12px; - color: var(--color-text); - font-size: 1.15rem; - font-weight: 700; -} - -.case-record-heading { - margin-bottom: 18px; - color: var(--color-text); -} - -.case-record-heading-name { - color: inherit; - font-weight: 700; -} - -.case-panel .form-group { - margin-bottom: 14px; +#content-area form, +#content-area .panel, +#content-area .case-detail-panel-content { + background: white; + border-radius: 14px; + padding: 20px; + margin-bottom: 22px; + box-shadow: 0 8px 22px rgba(15, 23, 42, 0.08); } -.case-panel .form-group label { +#content-area label { display: block; - margin-bottom: 6px; - font-size: 0.95rem; - color: var(--color-text); + margin-top: 10px; + margin-bottom: 4px; + font-weight: 700; + color: #374151; } -.case-panel .form-group input, -.case-panel .form-group textarea, -.case-panel .form-group select { +#content-area input, +#content-area textarea, +#content-area select { width: 100%; + max-width: 420px; padding: 10px 12px; - border-radius: 10px; - border: 1px solid var(--color-border); - background: var(--color-input-bg); - color: var(--color-text); - outline: none; - box-sizing: border-box; - font-size: 1rem; + border: 1px solid #cbd5e1; + border-radius: 8px; + font-size: 15px; + background: #fff; } -.case-panel .form-group input::placeholder, -.case-panel .form-group textarea::placeholder { - color: var(--color-muted); -} - -.case-panel .form-group textarea { - min-height: 100px; +#content-area textarea { + min-height: 90px; resize: vertical; } -.case-panel .form-group input:focus, -.case-panel .form-group textarea:focus, -.case-panel .form-group select:focus { - border-color: var(--color-accent); - box-shadow: 0 0 0 3px rgba(0, 212, 255, 0.16); -} - -.case-panel .form-group select option { - color: #111111; -} - -.btn-primary { - display: inline-block; +#content-area button, +#content-area .btn-primary { width: 100%; + max-width: 420px; + margin-top: 14px; padding: 12px 16px; border: none; - border-radius: 12px; - background: var(--color-primary); - color: var(--color-text); - font-size: 1rem; + border-radius: 10px; + background: #6b21a8; + color: white; font-weight: 700; cursor: pointer; - transition: background 0.2s ease, transform 0.2s ease, opacity 0.2s ease; - box-sizing: border-box; - appearance: none; - -webkit-appearance: none; } -.btn-primary:hover { - background: var(--color-primary-hover); - transform: translateY(-1px); -} - -.btn-primary:active { - transform: translateY(0); -} - -.registry-list, -.case-record-list, -.case-file-list { - list-style: none; - display: flex; - flex-direction: column; - gap: 12px; - padding: 0; - margin: 16px 0 0 0; +#content-area button:hover, +#content-area .btn-primary:hover { + background: #581c87; } -.registry-list li, -.case-record-list li, -.case-file-list li { +#content-area ul { list-style: none; - margin: 0; padding: 0; - background: transparent; -} - -.registry-button, -.case-record-button { - display: block; - width: 100%; - padding: 14px 16px; - border: 1px solid var(--color-border); - border-radius: 14px; - background: linear-gradient(180deg, var(--color-surface-soft), var(--color-primary)); - color: var(--color-text); - cursor: pointer; - text-align: left; - font-size: 1rem; - font-weight: 600; - box-sizing: border-box; - transition: background 0.2s ease, transform 0.2s ease, border-color 0.2s ease; - appearance: none; - -webkit-appearance: none; -} - -.registry-button:hover, -.case-record-button:hover { - background: linear-gradient(180deg, var(--color-primary-hover), var(--color-primary)); - transform: translateY(-1px); - border-color: rgba(255, 255, 255, 0.22); + margin: 10px 0 20px; } -.registry-button:active, -.case-record-button:active { - transform: translateY(0); +#content-area li { + margin-bottom: 8px; } -.registry-name, -.case-record-number { - color: inherit; +#content-area li a, +#content-area li button, +#content-area .case-list button { + display: inline-block; + width: auto; + max-width: none; + margin: 0; + padding: 8px 12px; + border-radius: 8px; + border: 1px solid #ddd6fe; + background: #f5f3ff; + color: #4c1d95; font-weight: 700; -} - -.registry-code, -.case-record-title { - margin-left: 8px; - color: rgba(255, 255, 255, 0.92); -} - -.empty-state { - color: var(--color-muted); - font-style: italic; - padding: 4px 0; -} - -.file-row { - display: flex; - align-items: center; - justify-content: space-between; - gap: 12px; - padding: 10px 12px; - border-radius: 10px; - background: var(--color-row-bg); - border: 1px solid var(--color-border); -} - -.file-actions { - display: flex; - gap: 8px; - align-items: center; -} - -.file-actions a, -.file-actions button { - border: none; - background: transparent; - color: var(--color-accent); - cursor: pointer; - font-size: 0.95rem; text-decoration: none; } -.file-actions a:hover, -.file-actions button:hover { - opacity: 0.85; -} - -@media (max-width: 1100px) { - .case-management-wrapper { - grid-template-columns: 1fr; - } - - .case-panel { - min-height: auto; - } -} - -/* större luft efter huvudrubrik */ -.case-panel h2 { - margin-bottom: 20px; -} - -/* spacing runt formulärsektion */ -.form-section-title { - margin-top: 24px; - margin-bottom: 12px; -} - -/* extra luft före listor */ -.case-record-list, -.registry-list { - margin-top: 12px; +#content-area li a:hover, +#content-area li button:hover, +#content-area .case-list button:hover { + background: #ede9fe; } -/* lite luft efter formulär */ -form { - margin-bottom: 16px; -} - -/* snyggare separator */ -.section-divider { - margin: 24px 0; +#content-area strong { + color: #111827; } -.registry-panel-content, -.case-record-panel-content, -.case-detail-panel-content { - display: flex; - flex-direction: column; - gap: 20px; +#content-area p { + margin: 8px 0; + font-size: 16px; } -.form-help { - display: block; - margin-top: 6px; - font-size: 0.85rem; - color: var(--color-muted); -} - -.feedback-message { - padding: 10px 12px; +.feedback-message, +.success-message, +.error-message { + padding: 12px 14px; border-radius: 10px; - font-size: 0.95rem; - font-weight: 600; - margin: 8px 0 12px; + margin-bottom: 16px; + font-weight: 700; } .success-message { - color: #0f5132; - background: #d1e7dd; + background: #dcfce7; + color: #166534; } .error-message { - color: #842029; - background: #f8d7da; + background: #fee2e2; + color: #991b1b; } \ No newline at end of file diff --git a/src/main/resources/templates/dashboard-layout.html b/src/main/resources/templates/dashboard-layout.html index bb82fc9..fb99979 100644 --- a/src/main/resources/templates/dashboard-layout.html +++ b/src/main/resources/templates/dashboard-layout.html @@ -9,6 +9,7 @@ +