From f8bf12680dcaf48d22a0b5bfd05e0da03573d3dc Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Mara=20Z=C3=B6llner?= Date: Wed, 3 Jun 2026 12:34:42 +0200 Subject: [PATCH] Anpassung impressum + style css --- css/style.css | 40 +++++++++++++++++++++++++++++++++++++++- impressum.html | 36 ++++++++++++++++++++++++++++++------ 2 files changed, 69 insertions(+), 7 deletions(-) diff --git a/css/style.css b/css/style.css index f0f965d..0b5b5b6 100644 --- a/css/style.css +++ b/css/style.css @@ -107,6 +107,7 @@ footer a:hover { color: #fff; } .page-hero { padding: 5rem 3rem 3.5rem; max-width: 820px; margin: 0 auto; animation: fadeUp 0.9s ease both; } .page-hero h1 { font-family: 'Bebas Neue', sans-serif; font-size: clamp(2.8rem, 7vw, 5rem); line-height: 1; letter-spacing: 0.03em; color: #fff; margin-bottom: 2rem; } .page-hero h1 span { color: var(--accent); } +.page-hero .sub { font-size: 1.05rem; font-weight: 300; color: rgba(255,255,255,0.62); line-height: 1.8; margin-bottom: 3rem; max-width: 560px; } .page { max-width: 820px; margin: 0 auto; padding: 0 3rem 4rem; } .page hr { border: none; border-top: 1px solid rgba(255,255,255,0.07); margin: 2.5rem 0; } @@ -114,10 +115,43 @@ footer a:hover { color: #fff; } .bio, .page p { font-size: 1.05rem; font-weight: 300; color: rgba(255,255,255,0.6); line-height: 1.9; margin-bottom: 0.6rem; } .skills-label, .page .label { font-size: 0.72rem; letter-spacing: 0.2em; text-transform: uppercase; color: rgba(255,255,255,0.4); margin-bottom: 1rem; } +.legal-page { max-width: 900px; padding-bottom: 5rem; } +.legal-page h1 { margin-bottom: 1rem; } +.legal-page section { + padding: 1.65rem 0 1.65rem 1.5rem; + border-left: 2px solid rgba(122,179,255,0.35); + border-bottom: 1px solid rgba(255,255,255,0.07); +} +.legal-page section + section { margin-top: 1.2rem; } +.legal-page h2 { + font-family: 'Bebas Neue', sans-serif; + font-size: 1.55rem; + font-weight: 400; + letter-spacing: 0.08em; + color: #fff; + margin-bottom: 0.9rem; +} +.legal-page p, +.legal-page address { + max-width: 680px; + font-size: 1rem; + font-style: normal; + font-weight: 300; + color: rgba(255,255,255,0.68); + line-height: 1.85; +} +.legal-page a { color: var(--accent); text-decoration: none; } +.legal-page a:hover { color: #fff; } + .skills { display: flex; flex-wrap: wrap; gap: 0.6rem; } .skill { padding: 0.4rem 1.1rem; border: 1px solid rgba(255,255,255,0.15); font-size: 0.82rem; letter-spacing: 0.08em; text-transform: uppercase; color: rgba(255,255,255,0.7); transition: border-color 0.2s, color 0.2s; } .skill:hover { border-color: var(--accent); color: var(--accent); } +@media (max-width: 640px) { + .legal-page { padding-inline: 1.5rem; } + .legal-page section { padding-left: 1rem; } +} + /* ========================= Dark Mode ========================= */ body.dark { @@ -147,10 +181,14 @@ body.dark #dark-mode-toggle { background: var(--accent); color: #0b1220; border- body.dark .page p, body.dark .bio { color: rgba(226,232,240,0.8); } body.dark .skill { border-color: rgba(226,232,240,0.2); color: rgba(226,232,240,0.7); } +body.dark .page-hero .sub, +body.dark .legal-page p, +body.dark .legal-page address { color: rgba(226,232,240,0.78); } +body.dark .legal-page section { border-left-color: rgba(96,165,250,0.45); border-bottom-color: #334155; } .dropdown { position: relative; } .dropdown-menu { display: none; position: absolute; top: 100%; left: 0; background: rgba(0,20,60,0.97); border: 1px solid rgba(255,255,255,0.07); min-width: 160px; z-index: 200; } .dropdown-menu li { list-style: none; } .dropdown-menu a { display: block; padding: 0.7rem 1.2rem; color: var(--text-muted); font-size: 0.85rem; letter-spacing: 0.08em; text-transform: uppercase; } .dropdown-menu a:hover { color: #fff; } -.dropdown.open .dropdown-menu { display: block; } \ No newline at end of file +.dropdown.open .dropdown-menu { display: block; } diff --git a/impressum.html b/impressum.html index 112f420..317c480 100644 --- a/impressum.html +++ b/impressum.html @@ -29,29 +29,53 @@ -
+

Rechtliches

Impressum

+

Privates Lernprojekt mit Glück-Auf Potenzial.

-

Angaben gemäß § 5 TMG

-
Vorname Nachname
Musterstraße 1
12345 Musterstadt
Deutschland
+

Angaben

+
+ Mara
+ Glück-Auf-Straße 4
+ 1904 Glückaufstadt
+ Deutschland +
+

Kontakt

-

E-Mail: info@beispiel.de

+

E-Mail: kontakt@example.com

+ +
+

Verantwortlich für den Inhalt

+
+ Mara
+ Glück-Auf-Straße 4
+ 1904 Glückaufstadt +
+
+

Haftung für Inhalte

-

Als Diensteanbieter sind wir gemäß § 7 Abs. 1 TMG für eigene Inhalte auf diesen Seiten nach den allgemeinen Gesetzen verantwortlich. Nach §§ 8 bis 10 TMG sind wir als Diensteanbieter jedoch nicht verpflichtet, übermittelte oder gespeicherte fremde Informationen zu überwachen.

+

Die Inhalte dieser Website wurden mit größter Sorgfalt erstellt. Für die Richtigkeit, Vollständigkeit und Aktualität der Inhalte wird jedoch keine Gewähr übernommen.

+

Haftung für Links

Unser Angebot enthält Links zu externen Websites Dritter, auf deren Inhalte wir keinen Einfluss haben. Für die Inhalte der verlinkten Seiten ist stets der jeweilige Anbieter oder Betreiber verantwortlich.

+

Urheberrecht

-

Die durch die Seitenbetreiber erstellten Inhalte und Werke auf diesen Seiten unterliegen dem deutschen Urheberrecht. Vervielfältigung und Verbreitung bedürfen der schriftlichen Zustimmung des jeweiligen Autors.

+

Die auf dieser Website erstellten Inhalte und Werke unterliegen dem deutschen Urheberrecht. Die Vervielfältigung, Bearbeitung oder Verbreitung außerhalb der Grenzen des Urheberrechts bedarf der Zustimmung der jeweiligen Rechteinhaberin.

+
+ +
+

Hinweis

+

Diese Seite ist Teil eines privaten Lernprojekts. Die Angaben sind fiktiv und nicht für eine öffentliche Veröffentlichung gedacht.