diff --git a/data_visualization/css/base.css b/data_visualization/css/base.css new file mode 100644 index 0000000..285e56c --- /dev/null +++ b/data_visualization/css/base.css @@ -0,0 +1,106 @@ +/* ========================================= + Section: Variables and Reset + ========================================= */ + +:root { + --color-bg: #0b0c10; + --color-surface: #1f2833; + --color-text: #c5c6c7; + --color-accent: #66fcf1; + --color-primary: #45a29e; + --font-base: 'Arial', sans-serif; + --spacing-xs: 0.25rem; + --spacing-sm: 0.5rem; + --spacing-md: 1rem; + --spacing-lg: 2rem; + --radius-sm: 4px; + --radius-md: 8px; + --transition-fast: 0.2s ease; + --bp-sm: 640px; + --bp-md: 1024px; +} + +* { + box-sizing: border-box; + margin: 0; + padding: 0; +} + +html, body { + height: 100%; + scroll-behavior: smooth; +} + +body { + background-color: var(--color-bg); + color: var(--color-text); + font-family: var(--font-base); + line-height: 1.6; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; +} + +/* ========================================= + Section: Typography + ========================================= */ + +h1, h2, p { + color: var(--color-text); + margin-bottom: var(--spacing-md); +} + +h1 { + font-size: 1.8rem; + font-weight: 700; + color: var(--color-accent); +} + +h2 { + font-size: 1.4rem; + font-weight: 600; + color: var(--color-primary); +} + +p { + font-size: 1rem; + line-height: 1.5; +} + +@media (min-width: var(--bp-sm)) { + h1 { + font-size: 2.2rem; + } + + h2 { + font-size: 1.6rem; + } +} + +@media (min-width: var(--bp-md)) { + h1 { + font-size: 2.6rem; + } + + h2 { + font-size: 1.8rem; + } + + p { + font-size: 1.1rem; + } +} + +/* Footer copyright */ +footer { + text-align: center; + font-size: 0.9rem; + padding: var(--spacing-md) 0; + color: var(--color-text); +} + +footer::after { + content: "© 2026 Donau2Space.de"; + display: block; + margin-top: var(--spacing-sm); + color: var(--color-primary); +}