From c1a88b2e04968dafda5f9c4f8c0a322ad081e223 Mon Sep 17 00:00:00 2001 From: christian Date: Fri, 10 Apr 2026 12:04:44 +0000 Subject: [PATCH] feat: initial eier-homepage with nginx static site --- README.md | 10 +++++++ index.html | 76 +++++++++++++++++++++++++++++++++++++++++++++++ style.css | 86 ++++++++++++++++++++++++++++++++++++++++++++++++++++++ 3 files changed, 172 insertions(+) create mode 100644 README.md create mode 100644 index.html create mode 100644 style.css diff --git a/README.md b/README.md new file mode 100644 index 0000000..ae1ed16 --- /dev/null +++ b/README.md @@ -0,0 +1,10 @@ +# 🥚 Eier-Homepage + +Statische Website mit allem Wissenswerten rund um Eier — Aufbau, Nährwerte und Zubereitungsarten. + +## Stack +- HTML5 + CSS3 (statisch, keine Buildchain) +- Hosting: nginx auf Debian 13 LXC + +## Deployment +Die Seite wird via `git clone` nach `/var/www/html` auf dem Zielserver deployed. diff --git a/index.html b/index.html new file mode 100644 index 0000000..bac1476 --- /dev/null +++ b/index.html @@ -0,0 +1,76 @@ + + + + + + Alles über Eier + + + +
+

🥚 Alles über Eier

+

Die kleine Wunderkapsel der Natur

+
+ +
+
+

Was ist ein Ei?

+

+ Ein Ei ist eine von einer Schale umgebene Zelle, in der sich der + Embryo eines Tieres entwickelt. Das bekannteste Ei in der Küche + ist das Hühnerei – aber auch Wachteln, Enten, Gänse und Strauße + legen verzehrbare Eier. +

+
+ +
+

Aufbau eines Hühnereis

+
    +
  • Schale: Calciumcarbonat, schützt das Innere
    • +
  • Eiklar: ca. 60% des Gewichts, eiweißreich
    • +
  • Eigelb: reich an Fett, Vitaminen und Mineralien
    • +
  • Hagelschnüre: halten das Eigelb in Position
    • +
  • Luftkammer: wächst mit dem Alter des Eis
    • +
+
+ +
+

Nährwerte (pro 100 g Hühnerei)

+ + + + + + + +
NährstoffMenge
Kalorien155 kcal
Eiweiß13 g
Fett11 g
Kohlenhydrate1 g
Cholesterin373 mg
+
+ +
+

Zubereitungsarten

+
+

Weichgekocht

4–5 Minuten in kochendem Wasser

+

Hartgekocht

9–10 Minuten in kochendem Wasser

+

Spiegelei

In heißer Pfanne mit Butter braten

+

Rührei

Verquirlt langsam stocken lassen

+

Pochiert

In Essigwasser gleiten lassen

+

Omelett

Dünn ausgebacken, gefüllt

+
+
+ +
+

Schon gewusst?

+
    +
  • Ein Strauß-Ei wiegt etwa so viel wie 24 Hühnereier.
    • +
  • Die Schalenfarbe hängt von der Hühnerrasse ab – nicht von der Qualität.
    • +
  • Frische Eier sinken in Wasser, alte schwimmen oben.
    • +
  • Eier sind eine der besten natürlichen Proteinquellen mit hoher biologischer Wertigkeit.
    • +
+
+
+ + + + diff --git a/style.css b/style.css new file mode 100644 index 0000000..785a0f3 --- /dev/null +++ b/style.css @@ -0,0 +1,86 @@ +:root { + --yolk: #f9c846; + --white: #fffaf0; + --shell: #f5e9d0; + --text: #3a2e1a; + --accent: #d97706; +} + +* { box-sizing: border-box; margin: 0; padding: 0; } + +body { + font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; + background: linear-gradient(135deg, var(--shell) 0%, var(--white) 100%); + color: var(--text); + line-height: 1.6; + min-height: 100vh; +} + +header { + background: var(--yolk); + text-align: center; + padding: 3rem 1rem; + box-shadow: 0 4px 12px rgba(0,0,0,0.08); +} + +header h1 { font-size: 2.5rem; margin-bottom: 0.5rem; } +.tagline { font-style: italic; color: var(--text); opacity: 0.8; } + +main { + max-width: 800px; + margin: 2rem auto; + padding: 0 1rem; +} + +section { + background: white; + margin-bottom: 1.5rem; + padding: 1.5rem; + border-radius: 12px; + box-shadow: 0 2px 8px rgba(0,0,0,0.05); +} + +h2 { + color: var(--accent); + margin-bottom: 1rem; + border-bottom: 2px solid var(--yolk); + padding-bottom: 0.5rem; +} + +ul { padding-left: 1.5rem; margin: 0.5rem 0; } +li { margin: 0.3rem 0; } + +table { width: 100%; border-collapse: collapse; margin-top: 0.5rem; } +th, td { text-align: left; padding: 0.6rem; border-bottom: 1px solid var(--shell); } +th { background: var(--yolk); } + +.cards { + display: grid; + grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); + gap: 1rem; + margin-top: 1rem; +} + +.card { + background: var(--shell); + padding: 1rem; + border-radius: 8px; + text-align: center; + transition: transform 0.2s; +} + +.card:hover { transform: translateY(-3px); } +.card h3 { color: var(--accent); margin-bottom: 0.3rem; } + +footer { + text-align: center; + padding: 2rem 1rem; + color: var(--text); + opacity: 0.7; + font-size: 0.9rem; +} + +@media (max-width: 600px) { + header h1 { font-size: 1.8rem; } + main { padding: 0 0.5rem; } +}