fs/tsv08kulmbach-website
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Ansprechpartner: 3er-Reihen mit zentrierten Rest-Reihen (3+2-Layout via Flex)

Browse Source 
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
Felix Schneider
2026-06-11 23:19:37 +02:00
parent 3a518f4a65
commit 5be2a1e6b9
1 changed files with 20 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
public/assets/css/components.css
View File

@@ -579,15 +579,22 @@
color: var(--clr-text-muted); color: var(--clr-text-muted);
} }
/* Max. 3 pro Reihe; unvollständige Reihen (z. B. 3+2) zentrieren sich automatisch */
.persons__grid { .persons__grid {
display: grid; display: flex;
grid-template-columns: repeat(auto-fit, minmax(200px, 240px)); flex-wrap: wrap;
justify-content: center; justify-content: center;
gap: 1.5rem; gap: 1.5rem;
margin-top: 2.5rem; margin-top: 2.5rem;
text-align: left; text-align: left;
} }
.persons__grid > li {
flex: 0 1 calc((100% - 3rem) / 3);
min-width: 220px;
max-width: 340px;
}
.person-card { .person-card {
display: grid; display: grid;
height: 100%; height: 100%;
@@ -1339,27 +1346,32 @@
.team-card__body { .team-card__body {
display: grid; display: grid;
gap: 0.35rem; gap: 0.4rem;
align-content: start; align-content: start;
padding: 1.1rem 1.25rem 1.25rem; padding: 1.25rem 1.4rem 1.4rem;
} }
.team-card__name { .team-card__name {
font-size: var(--fs-600); /* Coolvetica/Heading (siehe CLAUDE.md) — bewusst groß und prägnant. */
font-size: var(--fs-650);
line-height: var(--lh-heading);
} }
.team-card__meta { .team-card__meta {
font-size: var(--fs-600);
color: var(--clr-text-muted); color: var(--clr-text-muted);
font-size: var(--fs-500);
} }
.team-card__cta { .team-card__cta {
display: inline-flex; display: inline-flex;
align-items: center; align-items: center;
gap: 0.4rem; gap: 0.4rem;
margin-top: 0.4rem; margin-top: 0.6rem;
color: var(--clr-accent); font-family: var(--ff-heading);
font-size: var(--fs-500); font-size: var(--fs-500);
text-transform: uppercase;
letter-spacing: 0.04em;
color: var(--clr-accent);
} }
.team-card__arrow { .team-card__arrow {