Styling: Admin-Screenshot vollbreit, Karten ohne Icons, Nova-Button/Nav-Kontraste
Deploy tibi-docs / build-and-deploy (push) Failing after 29s
Deploy tibi-docs / build-and-deploy (push) Failing after 29s
This commit is contained in:
apairon committed
1 parent
a2b8ab9eea
commit
db702084f3
4 files changed
+98
-49
No files matched your search
Binary file not shown.
|
After Width: | Height: | Size: 13 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 96 KiB |
+10
-12
@@ -4,37 +4,35 @@ description: Entwickler- und Anwender-Dokumentation für Tibi-Server und Tibi-Ad
|
||||
template: splash
|
||||
hero:
|
||||
tagline: Headless-CMS mit Go-Backend und Svelte-Frontends — hier steht, wie man damit baut.
|
||||
image:
|
||||
file: ../../assets/favicon.svg
|
||||
actions:
|
||||
- text: Schnellstart
|
||||
link: /einstieg/schnellstart/
|
||||
icon: right-arrow
|
||||
- text: Tibi-Server
|
||||
link: /server/uebersicht/
|
||||
icon: open-book
|
||||
variant: minimal
|
||||
- text: Tibi-Admin-Nova
|
||||
link: /nova/konzept/
|
||||
icon: open-book
|
||||
variant: minimal
|
||||
---
|
||||
|
||||
import { Card, CardGrid } from '@astrojs/starlight/components';
|
||||
|
||||
|
||||
|
||||
## Wo finde ich was?
|
||||
|
||||
<CardGrid stagger>
|
||||
<Card title="Einstieg" icon="rocket">
|
||||
Was ist Tibi, Schnellstart mit Docker, Begriffe von Namespace bis Collection.
|
||||
<Card title="Einstieg">
|
||||
Was ist Tibi, Schnellstart mit Docker, Begriffe von Namespace bis Collection. [Los geht's](/einstieg/was-ist-tibi/).
|
||||
</Card>
|
||||
<Card title="Tibi-Server" icon="server">
|
||||
Go-Backend: Collections-YAML, Hooks, Auth, Jobs, Realtime, LLM, Deploy. Wird aus dem Server-Repo synchronisiert.
|
||||
<Card title="Tibi-Server">
|
||||
Go-Backend: Collections-YAML, Hooks, Auth, Jobs, Realtime, LLM, Deploy. [Zur Übersicht](/server/uebersicht/).
|
||||
</Card>
|
||||
<Card title="Tibi-Admin-Nova" icon="pencil">
|
||||
Svelte-Admin: Sammlungen pflegen, Exporte, Rollen, Testpläne.
|
||||
<Card title="Tibi-Admin-Nova">
|
||||
Svelte-Admin: Sammlungen pflegen, Exporte, Rollen, Testpläne. [Zum Konzept](/nova/konzept/).
|
||||
</Card>
|
||||
<Card title="Referenz" icon="document">
|
||||
Autogeneriert: OpenAPI-Spec, Hook-JS-API, Collection-Schema. Nicht von Hand pflegen.
|
||||
<Card title="Referenz">
|
||||
Autogeneriert: OpenAPI-Spec, Hook-JS-API, Collection-Schema. [Zur Referenz](/reference/).
|
||||
</Card>
|
||||
</CardGrid>
|
||||
+88
-37
@@ -1,48 +1,37 @@
|
||||
/* Tibi Doku — an Tibi-Admin-Nova angelehntes Theme (Inter, Near-Black + Nova-Orange) */
|
||||
/* Tibi Doku — Nova-angelehnt: Inter, Near-Black-Akzent, Nova-Orange als Zweitakzent.
|
||||
Hinweis: --sl-color-white/black/gray bewusst NICHT überschrieben (Starlight
|
||||
dreht sie je Theme, eigenes Mapping zerstört Kontraste auf Buttons/Nav). */
|
||||
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');
|
||||
|
||||
:root {
|
||||
--sl-font: 'Inter', system-ui, -apple-system, sans-serif;
|
||||
|
||||
/* Akzent = Nova Near-Black (Light Mode) */
|
||||
--sl-color-accent-low: #e5e7eb;
|
||||
--sl-color-accent: #111827;
|
||||
--sl-color-accent-high: #000000;
|
||||
--sl-color-white: #ffffff;
|
||||
--sl-color-gray-1: #f8f9fa;
|
||||
--sl-color-gray-2: #f1f3f5;
|
||||
--sl-color-gray-3: #e5e7eb;
|
||||
--sl-color-gray-4: #d1d5db;
|
||||
--sl-color-gray-5: #9ca3af;
|
||||
--sl-color-gray-6: #6b7280;
|
||||
--sl-color-black: #111827;
|
||||
/* Akzent-Skala: Text-Akzent muss auf Weiß lesbar sein → dunkel */
|
||||
--sl-color-accent-low: #e8eaed;
|
||||
--sl-color-accent: #374151;
|
||||
--sl-color-accent-high: #111827;
|
||||
|
||||
/* Nova-Orange als Zweitakzent für Badges, Links-Hover, Hero
|
||||
(Trio: --tibi-nova Sienna, --tibi-nova-core Petrol, --tibi-nova-outer Rot) */
|
||||
/* Nova-Farben nur als Deko, nie als Textfarbe auf hellem Grund */
|
||||
--tibi-nova: #c2410c;
|
||||
--tibi-nova-core: #4da8b8;
|
||||
--tibi-nova-outer: #dc2626;
|
||||
--tibi-sidebar: #f8f9fa;
|
||||
--tibi-topbar: #ffffff;
|
||||
--tibi-card-border: #e5e7eb;
|
||||
}
|
||||
|
||||
:root[data-theme='dark'] {
|
||||
--sl-color-accent-low: #2a2a2a;
|
||||
--sl-color-accent: #e5e7eb;
|
||||
--sl-color-accent-high: #ffffff;
|
||||
--sl-color-white: #1e1e1e;
|
||||
--sl-color-gray-1: #2a2a2a;
|
||||
--sl-color-gray-2: #151515;
|
||||
--sl-color-gray-3: #333333;
|
||||
--sl-color-gray-4: #333333;
|
||||
--sl-color-gray-5: #9ca3af;
|
||||
--sl-color-gray-6: #6b7280;
|
||||
--sl-color-black: #e5e7eb;
|
||||
--tibi-sidebar: #1e1e1e;
|
||||
--tibi-topbar: #1e1e1e;
|
||||
/* Auf dunklem Grund muss Text-Akzent hell sein */
|
||||
--sl-color-accent-low: #2b3138;
|
||||
--sl-color-accent: #9aa4b2;
|
||||
--sl-color-accent-high: #e5e7eb;
|
||||
|
||||
--tibi-sidebar: #16181d;
|
||||
--tibi-topbar: #16181d;
|
||||
--tibi-card-border: #333a44;
|
||||
}
|
||||
|
||||
/* Sidebar / Topbar leicht Nova-nah */
|
||||
/* ---------- Flächen in Nova-Nähe ---------- */
|
||||
.sidebar-pane {
|
||||
background-color: var(--tibi-sidebar);
|
||||
}
|
||||
@@ -50,19 +39,81 @@
|
||||
background-color: var(--tibi-topbar);
|
||||
}
|
||||
|
||||
/* Hero-Akzent: Nova-Flamme als dezenter Verlauf */
|
||||
/* ---------- Hero ---------- */
|
||||
.hero {
|
||||
background:
|
||||
radial-gradient(ellipse 60% 50% at 50% 0%, rgba(194, 65, 12, 0.12), transparent),
|
||||
radial-gradient(ellipse 40% 30% at 50% 0%, rgba(77, 168, 184, 0.08), transparent),
|
||||
radial-gradient(ellipse 25% 20% at 70% 0%, rgba(220, 38, 38, 0.06), transparent);
|
||||
radial-gradient(ellipse 60% 50% at 50% 0%, rgba(194, 65, 12, 0.1), transparent),
|
||||
radial-gradient(ellipse 40% 30% at 50% 0%, rgba(77, 168, 184, 0.07), transparent),
|
||||
radial-gradient(ellipse 25% 20% at 70% 0%, rgba(220, 38, 38, 0.05), transparent);
|
||||
}
|
||||
:root[data-theme='dark'] .hero {
|
||||
background:
|
||||
radial-gradient(ellipse 60% 50% at 50% 0%, rgba(194, 65, 12, 0.16), transparent),
|
||||
radial-gradient(ellipse 40% 30% at 50% 0%, rgba(77, 168, 184, 0.1), transparent);
|
||||
}
|
||||
.hero img {
|
||||
border: 1px solid var(--tibi-card-border);
|
||||
border-radius: 0.75rem;
|
||||
box-shadow: 0 20px 50px -20px rgba(17, 24, 39, 0.35);
|
||||
max-width: min(100%, 45rem);
|
||||
}
|
||||
|
||||
/* Externe Nova-Links / primäre Aktionen in Nova-Orange */
|
||||
/* Inhaltsbilder (z. B. Startseiten-Screenshot): gerahmt, zentriert */
|
||||
.sl-markdown-content p > img:only-child {
|
||||
border: 1px solid var(--tibi-card-border);
|
||||
border-radius: 0.75rem;
|
||||
box-shadow: 0 24px 60px -24px rgba(17, 24, 39, 0.4);
|
||||
display: block;
|
||||
margin: 0 auto;
|
||||
max-width: min(100%, 58rem);
|
||||
}
|
||||
|
||||
/* ---------- Buttons: immer lesbar, Nova-Nähe ---------- */
|
||||
.sl-link-button.primary {
|
||||
background: #111827;
|
||||
border-color: #111827;
|
||||
color: #ffffff;
|
||||
}
|
||||
.sl-link-button.primary:hover {
|
||||
background: #000000;
|
||||
border-color: #000000;
|
||||
color: #ffffff;
|
||||
}
|
||||
.sl-link-button.minimal,
|
||||
.sl-link-button.secondary {
|
||||
color: #111827;
|
||||
}
|
||||
.sl-link-button.minimal:hover,
|
||||
.sl-link-button.secondary:hover {
|
||||
color: #c2410c;
|
||||
}
|
||||
:root[data-theme='dark'] .sl-link-button.primary {
|
||||
background: #e5e7eb;
|
||||
border-color: #e5e7eb;
|
||||
color: #111827;
|
||||
}
|
||||
:root[data-theme='dark'] .sl-link-button.primary:hover {
|
||||
background: #ffffff;
|
||||
border-color: #ffffff;
|
||||
color: #111827;
|
||||
}
|
||||
:root[data-theme='dark'] .sl-link-button.minimal,
|
||||
:root[data-theme='dark'] .sl-link-button.secondary {
|
||||
color: #e5e7eb;
|
||||
}
|
||||
:root[data-theme='dark'] .sl-link-button.minimal:hover,
|
||||
:root[data-theme='dark'] .sl-link-button.secondary:hover {
|
||||
color: #fbbf24;
|
||||
}
|
||||
|
||||
/* ---------- Karten: ruhig, Nova-Rahmen, Orange nur bei Hover ---------- */
|
||||
.sl-link-card,
|
||||
.card {
|
||||
border-color: var(--tibi-card-border);
|
||||
}
|
||||
.sl-link-card:hover {
|
||||
border-color: var(--tibi-nova);
|
||||
}
|
||||
a[href*='tibi-admin-nova'],
|
||||
a[href*='tibicms'] {
|
||||
text-decoration-color: var(--tibi-nova);
|
||||
.card .icon {
|
||||
display: none;
|
||||
}
|
||||
Reference in new issue
Block a user