From de625bbc490b904d01fb300abc606c0e94c2cc02 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=C2=ABschmona=C2=BB?= <«simona.oswald@proton.me»>
Date: Sat, 28 Mar 2026 17:27:41 +0100
Subject: [PATCH] Anpassung CSS an globales Stylesheet
---
.vscode/launch.json | 15 +++
css/event_create.css | 31 ------
css/event_overview.css | 127 -----------------------
css/stylesheet.css | 105 -------------------
css/stylesheet_global.css | 210 ++++++++++++++++++++++++++++++++++++++
event_create.html | 28 +++--
event_overview.html | 11 +-
login.html | 27 +++--
8 files changed, 269 insertions(+), 285 deletions(-)
create mode 100644 .vscode/launch.json
delete mode 100644 css/stylesheet.css
create mode 100644 css/stylesheet_global.css
diff --git a/.vscode/launch.json b/.vscode/launch.json
new file mode 100644
index 0000000..2ba986f
--- /dev/null
+++ b/.vscode/launch.json
@@ -0,0 +1,15 @@
+{
+ // Use IntelliSense to learn about possible attributes.
+ // Hover to view descriptions of existing attributes.
+ // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
+ "version": "0.2.0",
+ "configurations": [
+ {
+ "type": "chrome",
+ "request": "launch",
+ "name": "Launch Chrome against localhost",
+ "url": "http://localhost:8080",
+ "webRoot": "${workspaceFolder}"
+ }
+ ]
+}
\ No newline at end of file
diff --git a/css/event_create.css b/css/event_create.css
index e118a3e..9bccef6 100644
--- a/css/event_create.css
+++ b/css/event_create.css
@@ -1,35 +1,4 @@
:root {
- --color-bg: #f7f7f2;
- --color-surface: #ffffff;
- --color-surface-soft: #f0eee7;
- --color-text: #1f1f1f;
- --color-text-secondary: #303030;
- --color-muted: #6b6b6b;
- --color-border: #d8d8d2;
- --color-border-strong: #202020;
- --color-primary: #222222;
- --color-primary-hover: #111111;
- --color-focus: #2f6fed;
- --color-error: #b42318;
- --color-progress-bg: #ddddda;
- --color-divider: #ecece7;
-
- --shadow-soft: 0 10px 30px rgba(0, 0, 0, 0.06);
-
- --radius-sm: 0.875rem;
- --radius-md: 1.25rem;
- --radius-lg: 1.5rem;
- --radius-pill: 999px;
-
- --space-1: 0.25rem;
- --space-2: 0.5rem;
- --space-3: 0.75rem;
- --space-4: 1rem;
- --space-5: 1.5rem;
- --space-6: 2rem;
- --space-7: 3rem;
- --space-8: 4rem;
-
--max-width: 1120px;
--content-width: 760px;
--header-height: 4.5rem;
diff --git a/css/event_overview.css b/css/event_overview.css
index 89b022d..30901c9 100644
--- a/css/event_overview.css
+++ b/css/event_overview.css
@@ -1,41 +1,3 @@
-:root {
- --black: #221c1a;
- --white: #fff;
- --gray-bg: #f4f4f4;
- --border: 1px solid #221c1a;
- --olive: #6b6b05;
- --tomato: #d44b24;
- --olive-light: #e5e1b7;
- --cream: #f3efcf;
- --butter: #fffde3;
- --brown: #66340D;
-
- /* Spacing Scale */
- --space-1: 8px;
- --space-2: 12px;
- --space-3: 16px;
- --space-4: 20px;
- --space-5: 24px;
- --space-6: 32px;
-
- /* Radius Scale */
- --radius-pill: 999px;
- --radius-md: 20px;
- --radius-lg: 30px;
-
- /* Letter Spacing Scale */
- --ls-none: 0;
- --ls-ui: 0.03em;
- --ls-label: 0.045em;
-}
-
-body {
- font-family: "Jost", sans-serif;
- margin: 0;
- padding: 0;
- background: var(--butter);
-}
-
.container { max-width: 1100px; margin: 0 auto; padding: 20px; }
/* ---------------------------------------------------------
@@ -101,95 +63,6 @@ body {
line-height: 1.15;
}
-/* ---------------------------------------------------------
- Top Navigation
---------------------------------------------------------- */
-.top-nav-wrap {
- background: var(--butter);
- padding: 6px 12px;
-}
-
-.top-nav {
- background: rgba(255, 255, 255, 0.95);
- border-radius: var(--radius-lg);
- box-shadow: 0 3px 12px rgba(102, 52, 13, 0.1);
- display: flex;
- justify-content: space-between;
- align-items: center;
- min-height: 58px;
- padding: 3px 9px 3px var(--space-5);
- max-width: none;
- width: 100%;
- box-sizing: border-box;
- margin: 0 auto;
-}
-
-.brand {
- display: inline-flex;
- align-items: center;
- height: 50px;
- text-decoration: none;
-}
-
-.brand img {
- width: auto;
- height: 100%;
- max-width: 104px;
- display: block;
-}
-
-.top-nav-links {
- display: flex;
- align-items: center;
- gap: 16px;
-
-}
-
-.nav-link {
- color: var(--black);
- line-height: 1.3;
- text-decoration: none;
- padding: var(--space-1) var(--space-4);
- border-radius: var(--radius-md);
- border-width: 2px;
- border-color: var(--olive-light);
- border-style: solid;
- border-radius: 20px
-}
-
-.nav-link:hover,
-.nav-link.active,
-.nav-link:focus-visible {
- background: var(--olive);
- color: var(--white);
- border-color: var(--olive);
-}
-
-.login-pill {
- background: var(--olive);
- border-radius: var(--radius-md);
- color: var(--butter);
- line-height: 1.3;
- padding: var(--space-1) var(--space-4);
- text-decoration: none;
-}
-
-.profile-pill {
- width: 38px;
- height: 38px;
- border-radius: 19px;
- background: var(--tomato);
- color: var(--butter);
- font-size: 17px;
- font-weight: 500;
- letter-spacing: var(--ls-ui);
- line-height: 1.3;
- display: inline-flex;
- align-items: center;
- justify-content: center;
- text-decoration: none;
-}
-
/* ---------------------------------------------------------
Overview Header + Filters
--------------------------------------------------------- */
diff --git a/css/stylesheet.css b/css/stylesheet.css
deleted file mode 100644
index 42df5d5..0000000
--- a/css/stylesheet.css
+++ /dev/null
@@ -1,105 +0,0 @@
-/* Font Import */
-
-@import url('https://fonts.googleapis.com/css2?family=Bagel+Fat+One&display=swap');
-@import url('https://fonts.googleapis.com/css2?family=Jost:wght@300;400;600&display=swap');
-
-
-/* Reset / Normalize */
-*,
-*::before,
-*::after {
- margin: 0;
- padding: 0;
- box-sizing: border-box;
-}
-
-/* Colors + Main Font */
-:root {
- --primary-color: #D44B24;
- --primary-color-dark: #D44B24;
- --secondary-color: #6B6B05;
- --secondary-color-dark: #5C5C05;
- --white: #ffffff;
- --black: #221C1A;
- --brown: #66340d;
-
- --font-main: 'Jost', sans-serif;
- --font-size-base: 16px;
-}
-
-/* Base Styles */
-body {
- font-family: var(--font-main);
- font-size: 1.125em;
- line-height: 1.5;
- color: var(--black);
- background-color: #FFFDE3;
-}
-
-img {
- max-width: 100%;
- display: block;
-}
-
-/* Typography */
-
-h1, h2 {
- font-family: 'Bagel Fat One';
- margin-bottom: 0.5em;
-}
-
-p {
- font-family: 'Jost', sans-serif;
- margin-bottom: 1em;
-}
-
-/* Layout */
-.container {
- width: 90%;
- max-width: 1200px;
- margin: 0 auto;
-}
-
-/* Components */
-.button {
- display: inline-block;
- padding: 0.5em 1.25em;
- background-color: var(--secondary-color);
- font-family: 'Jost', sans-serif;
- font-size: 1em;
- color: #FFFDE3;
- border: none;
- border-radius: 2em;
- cursor: pointer;
-
-}
-
-.button:hover {
- background-color: var(--secondary-color-dark);
-}
-
-/* Navigation */
-.nav {
- display: flex;
- gap: 1rem;
-}
-
-/* Utilities */
-.text-center {
- text-align: left;
-}
-
-.hidden {
- display: none;
-}
-
-/* Media Queries (Responsive) */
-@media (max-width: 768px) {
- .container {
- width: 95%;
- }
-
- .nav {
- flex-direction: column;
- }
-}
\ No newline at end of file
diff --git a/css/stylesheet_global.css b/css/stylesheet_global.css
new file mode 100644
index 0000000..5b2120b
--- /dev/null
+++ b/css/stylesheet_global.css
@@ -0,0 +1,210 @@
+/* Font Import */
+
+@import url('https://fonts.googleapis.com/css2?family=Bagel+Fat+One&display=swap');
+@import url('https://fonts.googleapis.com/css2?family=Jost:wght@300;400;600&display=swap');
+
+
+/* Reset / Normalize */
+*,
+*::before,
+*::after {
+ margin: 0;
+ padding: 0;
+ box-sizing: border-box;
+}
+
+/* Colors + Main Font */
+:root {
+ --tomato: #D44B24;
+ --tomato-dark: #D44B24;
+ --olive: #6B6B05;
+ --olive-dark: #5C5C05;
+ --olive-light: #E5E1B7;
+ --butter: #FFFBD1;
+ --butter-light: #FFFDE3;
+ --white: #ffffff;
+ --black: #221C1A;
+ --brown: #66340d;
+
+ --font-main: 'Jost', sans-serif;
+ --font-size-base: 16px;
+
+/* Spacing Scale */
+ --space-1: 8px;
+ --space-2: 12px;
+ --space-3: 16px;
+ --space-4: 20px;
+ --space-5: 24px;
+ --space-6: 32px;
+
+/* Radius Scale */
+ --radius-pill: 999px;
+ --radius-md: 20px;
+ --radius-lg: 30px;
+
+/* Letter Spacing Scale */
+ --ls-none: 0;
+ --ls-ui: 0.03em;
+ --ls-label: 0.045em;
+}
+
+/* Base Styles */
+body {
+ font-family: var(--font-main);
+ font-size: 1.125em;
+ line-height: 1.5;
+ color: var(--black);
+ background-color: var(--butter);
+}
+
+img {
+ max-width: 100%;
+ display: block;
+}
+
+/* Typography */
+
+h1, h2 {
+ font-family: 'Bagel Fat One';
+ margin-bottom: 0.5em;
+}
+
+p {
+ font-family: 'Jost', sans-serif;
+ margin-bottom: 1em;
+}
+
+/* Layout */
+.container {
+ width: 90%;
+ max-width: 1200px;
+ margin: 0 auto;
+}
+
+/* Top Navigation */
+.top-nav-wrap {
+ background: var(--butter);
+ padding: 6px 12px;
+}
+
+.top-nav {
+ background: rgba(255, 255, 255, 0.95);
+ border-radius: var(--radius-lg);
+ box-shadow: 0 3px 12px rgba(102, 52, 13, 0.1);
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ min-height: 58px;
+ padding: 3px 9px 3px var(--space-5);
+ max-width: none;
+ width: 100%;
+ box-sizing: border-box;
+ margin: 0 auto;
+}
+
+.brand {
+ display: inline-flex;
+ align-items: center;
+ height: 50px;
+ text-decoration: none;
+}
+
+.brand img {
+ width: auto;
+ height: 100%;
+ max-width: 104px;
+ display: block;
+}
+
+.top-nav-links {
+ display: flex;
+ align-items: center;
+ gap: 16px;
+
+}
+
+.nav-link {
+ color: var(--black);
+ line-height: 1.3;
+ text-decoration: none;
+ padding: var(--space-1) var(--space-4);
+ border-radius: var(--radius-md);
+ border-width: 2px;
+ border-color: none;
+ border-radius: 20px
+}
+
+.nav-link:hover,
+.nav-link:focus-visible {
+ background: var(--olive-light);
+ color: var(--black);
+}
+
+.login-pill {
+ background: var(--olive);
+ border-radius: var(--radius-md);
+ color: var(--butter);
+ line-height: 1.3;
+ padding: var(--space-1) var(--space-4);
+ text-decoration: none;
+}
+
+.profile-pill {
+ width: 38px;
+ height: 38px;
+ border-radius: 19px;
+ background: var(--tomato);
+ color: var(--butter);
+ font-size: 17px;
+ font-weight: 500;
+ letter-spacing: var(--ls-ui);
+ line-height: 1.3;
+ display: inline-flex;
+ align-items: center;
+ justify-content: center;
+ text-decoration: none;
+}
+
+/* Components */
+.button {
+ display: inline-block;
+ padding: 0.5em 1.25em;
+ background-color: var(--olive-color);
+ font-family: 'Jost', sans-serif;
+ font-size: 1em;
+ color: var(--butter-light);
+ border: none;
+ border-radius: 2em;
+ cursor: pointer;
+
+}
+
+.button:hover {
+ background-color: var(--olive-dark);
+}
+
+/* Navigation */
+.nav {
+ display: flex;
+ gap: 1rem;
+}
+
+/* Utilities */
+.text-center {
+ text-align: left;
+}
+
+.hidden {
+ display: none;
+}
+
+/* Media Queries (Responsive) */
+@media (max-width: 768px) {
+ .container {
+ width: 95%;
+ }
+
+ .nav {
+ flex-direction: column;
+ }
+}
\ No newline at end of file
diff --git a/event_create.html b/event_create.html
index 0730088..54b635b 100644
--- a/event_create.html
+++ b/event_create.html
@@ -4,19 +4,27 @@
Event erstellen | Invité
+
+
+
+
+
-
+
+
+
+
+