From d742a926ca81d6aeea86f3c2c0e7bce37fbcfb8f Mon Sep 17 00:00:00 2001 From: Mika Date: Sat, 28 Mar 2026 16:47:33 +0000 Subject: [PATCH] Add 2_interference_visualization/css/base.css --- 2_interference_visualization/css/base.css | 104 ++++++++++++++++++++++ 1 file changed, 104 insertions(+) create mode 100644 2_interference_visualization/css/base.css diff --git a/2_interference_visualization/css/base.css b/2_interference_visualization/css/base.css new file mode 100644 index 0000000..b9bfec1 --- /dev/null +++ b/2_interference_visualization/css/base.css @@ -0,0 +1,104 @@ +:root { + /* Farbpalette */ + --primary-color: #1a73e8; + --secondary-color: #2d2d2d; + --accent-color: #009688; + --background-color: #f8f9fa; + --surface-color: #ffffff; + --border-color: #e0e0e0; + --text-color: #212121; + --text-muted: #757575; + --error-color: #d32f2f; + + /* Typografie */ + --font-family-base: 'Inter', sans-serif; + --font-size-base: 16px; + --font-size-sm: 0.875rem; + --font-size-lg: 1.25rem; + --line-height-base: 1.5; + + /* Abstände */ + --spacing-xs: 0.25rem; + --spacing-sm: 0.5rem; + --spacing-md: 1rem; + --spacing-lg: 1.5rem; + --spacing-xl: 2rem; + + /* Breakpoints */ + --bp-sm: 640px; + --bp-md: 768px; + --bp-lg: 1024px; + --bp-xl: 1280px; + + /* Layout */ + --max-width: 1200px; + --radius-sm: 4px; + --radius-md: 8px; + --transition-base: all 0.3s ease; +} + +/* Body Layout */ +html { + box-sizing: border-box; + font-size: 100%; +} + +*, *::before, *::after { + box-sizing: inherit; + margin: 0; + padding: 0; +} + +body { + font-family: var(--font-family-base); + font-size: var(--font-size-base); + color: var(--text-color); + background-color: var(--background-color); + line-height: var(--line-height-base); + min-height: 100vh; + display: flex; + flex-direction: column; + align-items: center; +} + +.app-main { + width: 100%; + max-width: var(--max-width); + flex: 1; + padding: var(--spacing-md); + display: flex; + flex-direction: column; + gap: var(--spacing-md); + background-color: var(--surface-color); + border-radius: var(--radius-md); + box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1); +} + +@media (min-width: 640px) { + .app-main { + padding: var(--spacing-lg); + } +} + +@media (min-width: 1024px) { + body { + justify-content: center; + } + .app-main { + padding: var(--spacing-xl); + } +} + +/* Footer Style (falls vorhanden) */ +footer { + font-size: var(--font-size-sm); + color: var(--text-muted); + text-align: center; + padding: var(--spacing-md) 0; +} + +footer::after { + content: "© 2026 Donau2Space.de"; + display: block; + margin-top: var(--spacing-xs); +} \ No newline at end of file