Thomas Peterson
c3e05257cb
Infrastruktur als Code für den Skalierungs-Test auf Hetzner: - deploy/terraform: privates Netz, Firewalls, 2 App-Nodes, DB-Node, Load Balancer (Health-Check /health); cloud-init bootet Docker + Stack je Node - deploy/compose/docker-compose.prod.yml + nginx.prod.conf: App-Node-Stack (PHP-FPM + Nginx) routet /api,/p,/t,/css,/health → Symfony, Rest → Vue-SPA - App-Anpassungen: HealthController (/health für LB), brand.css nach /css verschoben (kein Pfad-Clash mit SPA-Assets im Prod-Routing) - deploy/README.md: Anleitung inkl. JWT-Key-Verteilung & Cross-Node-Test - reference.php (auto-generiert) aus Versionierung entfernt Terraform validiert (terraform validate), Prod-Compose-Syntax geprüft. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
83 lines
2.3 KiB
CSS
83 lines
2.3 KiB
CSS
/* vcard4reseller — Marken-Design-System (orientiert an vcard4reseller.de) */
|
|
:root {
|
|
--psc-orange: #f58220;
|
|
--psc-orange-dark: #d96500;
|
|
--psc-orange-soft: #fff2e7;
|
|
--psc-orange-soft-2: #fff8f1;
|
|
--psc-border: #f4d4bb;
|
|
--text: #343434;
|
|
--dark: #222222;
|
|
--muted: #6f6f6f;
|
|
--bg: #f7f7f7;
|
|
--white: #ffffff;
|
|
--success: #238636;
|
|
--shadow: 0 18px 45px rgba(30, 30, 30, 0.10);
|
|
--shadow-sm: 0 6px 18px rgba(30, 30, 30, 0.08);
|
|
--radius: 22px;
|
|
--radius-sm: 14px;
|
|
--font: Arial, Helvetica, sans-serif;
|
|
}
|
|
|
|
* { box-sizing: border-box; }
|
|
|
|
body {
|
|
margin: 0;
|
|
font-family: var(--font);
|
|
color: var(--text);
|
|
background: var(--bg);
|
|
line-height: 1.55;
|
|
-webkit-font-smoothing: antialiased;
|
|
}
|
|
|
|
h1, h2, h3 { color: var(--dark); font-weight: 700; line-height: 1.2; margin: 0 0 .4em; }
|
|
|
|
a { color: var(--psc-orange-dark); text-decoration: none; }
|
|
a:hover { text-decoration: underline; }
|
|
|
|
/* Marken-Logo (Wortmarke) */
|
|
.brand-logo {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
font-weight: 700;
|
|
font-size: 1.15rem;
|
|
color: var(--dark);
|
|
letter-spacing: -0.01em;
|
|
}
|
|
.brand-logo .tag {
|
|
background: var(--psc-orange);
|
|
color: var(--white);
|
|
padding: 2px 10px;
|
|
border-radius: 999px;
|
|
margin-left: 4px;
|
|
}
|
|
|
|
/* Pill-Buttons */
|
|
.btn {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
gap: .5rem;
|
|
padding: .7rem 1.4rem;
|
|
border-radius: var(--radius-sm);
|
|
font-weight: 600;
|
|
font-size: .95rem;
|
|
border: 1px solid transparent;
|
|
cursor: pointer;
|
|
transition: transform .08s ease, box-shadow .15s ease, background .15s ease;
|
|
}
|
|
.btn:hover { text-decoration: none; transform: translateY(-1px); }
|
|
.btn-primary { background: var(--psc-orange); color: var(--white); box-shadow: var(--shadow-sm); }
|
|
.btn-primary:hover { background: var(--psc-orange-dark); color: var(--white); }
|
|
.btn-soft { background: var(--psc-orange-soft); color: var(--psc-orange-dark); }
|
|
.btn-soft:hover { background: var(--psc-border); color: var(--psc-orange-dark); }
|
|
.btn-ghost { background: var(--white); color: var(--dark); border-color: #e7e7e7; }
|
|
|
|
/* Karte */
|
|
.card {
|
|
background: var(--white);
|
|
border-radius: var(--radius);
|
|
box-shadow: var(--shadow);
|
|
border: 1px solid #f0f0f0;
|
|
}
|
|
|
|
.muted { color: var(--muted); }
|