rene/vereinshaus
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Refactor: CSS-Variablen für alle Farbwerte (theme.css)

Browse source
This commit is contained in:
rene 2026-05-22 08:59:35 +02:00
parent e2d7655e13
commit 4fee85bd22
19 changed files with 521 additions and 461 deletions
Download patch file Download diff file Expand all files Collapse all files

52
app/src/routes/(app)/nachrichten/+page.svelte
View file

@ -201,25 +201,25 @@
margin-bottom: 1.25rem;
}
.top .btn-primary { flex: none; padding: 0.45rem 0.9rem; font-size: 0.875rem; }
h1 { font-size: 1.4rem; font-weight: 700; color: #1e293b; }
h1 { font-size: 1.4rem; font-weight: 700; color: var(--c-text); }
.success {
background: #dcfce7;
border: 1px solid #86efac;
background: var(--c-success-bg);
border: 1px solid var(--c-success-light);
border-radius: 8px;
padding: 0.75rem 1rem;
font-size: 0.875rem;
color: #166534;
color: var(--c-success-dark);
margin-bottom: 1rem;
}
.hint { color: #94a3b8; font-size: 0.95rem; text-align: center; margin-top: 3rem; }
.hint { color: var(--c-text-hint); font-size: 0.95rem; text-align: center; margin-top: 3rem; }
.liste { list-style: none; padding: 0; display: flex; flex-direction: column; gap: 0.5rem; }
.karte {
background: #fff;
border: 1px solid #e2e8f0;
background: var(--c-bg-card);
border: 1px solid var(--c-border);
border-radius: 10px;
padding: 0.9rem 1rem;
display: flex;
@ -233,10 +233,10 @@
align-items: baseline;
gap: 0.5rem;
}
.karte-betreff { font-weight: 600; font-size: 0.95rem; color: #1e293b; }
.karte-datum { font-size: 0.75rem; color: #94a3b8; flex-shrink: 0; }
.karte-meta { font-size: 0.78rem; color: #64748b; }
.karte-vorschau { font-size: 0.85rem; color: #475569; margin: 0; }
.karte-betreff { font-weight: 600; font-size: 0.95rem; color: var(--c-text); }
.karte-datum { font-size: 0.75rem; color: var(--c-text-hint); flex-shrink: 0; }
.karte-meta { font-size: 0.78rem; color: var(--c-text-muted); }
.karte-vorschau { font-size: 0.85rem; color: var(--c-text-secondary); margin: 0; }
/* Sheet */
.overlay {
@ -251,7 +251,7 @@
padding-bottom: calc(1rem + env(safe-area-inset-bottom));
}
.sheet {
background: #fff;
background: var(--c-bg-card);
border-radius: 16px;
padding: 1.5rem;
width: 100%;
@ -259,24 +259,24 @@
max-height: 92dvh;
overflow-y: auto;
}
h2 { font-size: 1.1rem; font-weight: 700; color: #1e293b; margin-bottom: 1rem; }
h2 { font-size: 1.1rem; font-weight: 700; color: var(--c-text); margin-bottom: 1rem; }
.field { display: flex; flex-direction: column; gap: 0.3rem; margin-bottom: 0.9rem; }
label, .field-label { font-size: 0.875rem; font-weight: 500; color: #475569; }
label, .field-label { font-size: 0.875rem; font-weight: 500; color: var(--c-text-secondary); }
input, textarea {
padding: 0.65rem 0.85rem;
border: 1.5px solid #e2e8f0;
border: 1.5px solid var(--c-border);
border-radius: 8px;
font-size: 1rem;
background: #fff;
background: var(--c-bg-card);
width: 100%;
box-sizing: border-box;
transition: border-color 0.15s;
font-family: inherit;
resize: vertical;
}
input:focus, textarea:focus { outline: none; border-color: #1e40af; }
input:focus, textarea:focus { outline: none; border-color: var(--c-primary); }
.checkboxes { display: flex; flex-wrap: wrap; gap: 0.4rem; margin-top: 0.25rem; }
.check-label {
@ -284,30 +284,30 @@
align-items: center;
gap: 0.35rem;
padding: 0.35rem 0.7rem;
border: 1.5px solid #e2e8f0;
border: 1.5px solid var(--c-border);
border-radius: 20px;
font-size: 0.82rem;
cursor: pointer;
transition: border-color 0.15s, background 0.15s;
}
.check-label.active { border-color: #1e40af; background: #e0e7ff; color: #1e40af; }
.check-label.active { border-color: var(--c-primary); background: var(--c-primary-light); color: var(--c-primary); }
.check-label input { display: none; }
.versand-info {
font-size: 0.8rem;
color: #94a3b8;
color: var(--c-text-hint);
margin-bottom: 0.75rem;
}
.error { color: #dc2626; font-size: 0.875rem; margin-bottom: 0.75rem; }
.error { color: var(--c-error); font-size: 0.875rem; margin-bottom: 0.75rem; }
.actions { display: flex; gap: 0.75rem; margin-top: 0.5rem; }
.btn-primary {
flex: 1;
padding: 0.75rem;
background: #1e40af;
color: #fff;
background: var(--c-primary);
color: var(--c-bg-card);
border: none;
border-radius: 8px;
font-size: 1rem;
@ -315,16 +315,16 @@
cursor: pointer;
transition: background 0.15s;
}
.btn-primary:hover:not(:disabled) { background: #1d3a9e; }
.btn-primary:hover:not(:disabled) { background: var(--c-primary-dark); }
.btn-primary:disabled { opacity: 0.55; cursor: not-allowed; }
.btn-ghost {
padding: 0.75rem 1rem;
background: none;
border: 1.5px solid #e2e8f0;
border: 1.5px solid var(--c-border);
border-radius: 8px;
font-size: 1rem;
color: #64748b;
color: var(--c-text-muted);
cursor: pointer;
}
</style>