From 1ae8976fc9036d9b198c48459f448f26bc387447 Mon Sep 17 00:00:00 2001 From: Iris Date: Tue, 16 Jun 2026 14:31:12 +0000 Subject: [PATCH] style: Aya Dark Premium redesign --- .gitea/workflows/ci.yaml | 45 ++++++ Dockerfile | 5 + README.md | 3 + css/style.css | 298 +++++++++++++++++++++++++++++++++++++++ index.html | 55 ++++++++ nginx.conf | 21 +++ 6 files changed, 427 insertions(+) create mode 100755 .gitea/workflows/ci.yaml create mode 100755 Dockerfile create mode 100755 README.md create mode 100755 css/style.css create mode 100755 index.html create mode 100755 nginx.conf diff --git a/.gitea/workflows/ci.yaml b/.gitea/workflows/ci.yaml new file mode 100755 index 0000000..f29af2c --- /dev/null +++ b/.gitea/workflows/ci.yaml @@ -0,0 +1,45 @@ +name: CI - Build & Test +run-name: πŸ” CI ${{ gitea.ref_name }} by @${{ gitea.actor }} + +on: + push: + branches: [main] + pull_request: + branches: [main] + +jobs: + lint: + name: Lint & Build + runs-on: linux + steps: + - name: Checkout + uses: actions/checkout@v4 + + - name: HTML Validate + run: | + echo "Checking HTML structure..." + if grep -q "" index.html; then + echo "βœ… HTML5 doctype present" + else + echo "❌ Missing HTML5 doctype" + exit 1 + fi + + - name: CSS Check + run: | + echo "Checking CSS..." + if grep -q "@media" css/style.css; then + echo "βœ… Responsive styles present" + else + echo "⚠️ No responsive styles found" + fi + + - name: Nginx Config Test + run: | + echo "Checking nginx conf..." + docker run --rm -v $PWD/nginx.conf:/tmp/nginx.conf:ro nginx:1.27-alpine nginx -t -c /tmp/nginx.conf 2>&1 || true + + - name: Build Docker Image + run: | + docker build -t noveria-landing:ci . + echo "βœ… Build successful" \ No newline at end of file diff --git a/Dockerfile b/Dockerfile new file mode 100755 index 0000000..3ea88ae --- /dev/null +++ b/Dockerfile @@ -0,0 +1,5 @@ +FROM nginx:1.27-alpine +COPY nginx.conf /etc/nginx/conf.d/default.conf +COPY index.html /usr/share/nginx/html/ +COPY css/ /usr/share/nginx/html/css/ +EXPOSE 80 diff --git a/README.md b/README.md new file mode 100755 index 0000000..1455e97 --- /dev/null +++ b/README.md @@ -0,0 +1,3 @@ +# noveria-landing + +Noveria.net Landingpage \ No newline at end of file diff --git a/css/style.css b/css/style.css new file mode 100755 index 0000000..7594174 --- /dev/null +++ b/css/style.css @@ -0,0 +1,298 @@ +/* ═══════════════════════════════════════════════ + Noveria Landing – Galaxy Theme + Aya Design + Dark Premium Style: Monochrome + Violett-Akzent + ═══════════════════════════════════════════════ */ + +:root { + --bg: #080a0f; + --tx: #ffffff; + --tx-2: #9ca3af; + --tx-3: #6b7280; + --accent: #8b5cf6; + --accent-strong: #a78bfa; + --accent-glow: rgba(139, 92, 246, .35); + --grad: linear-gradient(135deg, #7c3aed, #a855f7, #6366f1); + --holographic: linear-gradient(135deg, rgba(249,115,22,.06), rgba(236,72,153,.06), rgba(99,102,241,.06)); +} + +* { box-sizing: border-box; margin: 0; padding: 0; } + +html, body { + height: 100%; + overflow: hidden; + font-family: 'Space Grotesk', Inter, ui-sans-serif, system-ui, -apple-system, sans-serif; + color: var(--tx); + background: var(--bg); +} + +/* ═══ Galaxy Background ═══ */ +.galaxy { + position: fixed; + inset: 0; + z-index: 0; + background: + radial-gradient(80% 60% at 50% 40%, rgba(139, 92, 246, .10), transparent 60%), + radial-gradient(60% 50% at 80% 80%, rgba(168, 85, 247, .06), transparent 55%), + radial-gradient(50% 40% at 20% 20%, rgba(99, 102, 241, .05), transparent 50%), + var(--bg); +} + +/* Aya: Holographic premium gradient layer */ +.holographic { + position: absolute; + inset: 0; + background: var(--holographic); + mix-blend-mode: screen; + pointer-events: none; +} + +.stars, .stars2, .stars3 { + position: absolute; + inset: 0; +} + +.stars { + background-image: + radial-gradient(1px 1px at 10% 15%, rgba(255,255,255,.8), transparent), + radial-gradient(1px 1px at 25% 45%, rgba(255,255,255,.6), transparent), + radial-gradient(1.5px 1.5px at 40% 10%, rgba(200,190,255,.9), transparent), + radial-gradient(1px 1px at 55% 70%, rgba(255,255,255,.7), transparent), + radial-gradient(1px 1px at 70% 30%, rgba(255,255,255,.5), transparent), + radial-gradient(1.5px 1.5px at 85% 55%, rgba(180,170,255,.8), transparent), + radial-gradient(1px 1px at 15% 80%, rgba(255,255,255,.6), transparent), + radial-gradient(1px 1px at 60% 85%, rgba(255,255,255,.4), transparent), + radial-gradient(1px 1px at 90% 20%, rgba(255,255,255,.7), transparent); +} + +.stars2 { + background-image: + radial-gradient(1px 1px at 5% 25%, rgba(255,255,255,.9), transparent), + radial-gradient(1.5px 1.5px at 20% 60%, rgba(220,210,255,.8), transparent), + radial-gradient(1px 1px at 35% 35%, rgba(255,255,255,.5), transparent), + radial-gradient(1px 1px at 50% 15%, rgba(255,255,255,.6), transparent), + radial-gradient(1px 1px at 65% 55%, rgba(255,255,255,.7), transparent), + radial-gradient(1.5px 1.5px at 80% 75%, rgba(200,190,255,.8), transparent), + radial-gradient(1px 1px at 95% 40%, rgba(255,255,255,.5), transparent), + radial-gradient(1px 1px at 45% 90%, rgba(255,255,255,.4), transparent); + animation: twinkle 4s ease-in-out infinite alternate; +} + +.stars3 { + background-image: + radial-gradient(1px 1px at 8% 65%, rgba(255,255,255,.6), transparent), + radial-gradient(1px 1px at 18% 15%, rgba(255,255,255,.5), transparent), + radial-gradient(1.5px 1.5px at 30% 80%, rgba(210,200,255,.7), transparent), + radial-gradient(1px 1px at 48% 45%, rgba(255,255,255,.8), transparent), + radial-gradient(1px 1px at 62% 25%, rgba(255,255,255,.4), transparent), + radial-gradient(1px 1px at 75% 65%, rgba(255,255,255,.6), transparent), + radial-gradient(1px 1px at 88% 8%, rgba(255,255,255,.7), transparent), + radial-gradient(1.5px 1.5px at 12% 48%, rgba(190,180,255,.8), transparent); + animation: twinkle 6s ease-in-out infinite alternate-reverse; +} + +@keyframes twinkle { + 0% { opacity: .5; } + 100% { opacity: 1; } +} + +/* ═══ Aya: Floating Ambient Orbs ═══ */ +.orb { + position: fixed; + border-radius: 50%; + filter: blur(80px); + z-index: 0; + pointer-events: none; +} +.orb-1 { + width: 320px; height: 320px; + top: -60px; right: -80px; + background: rgba(139, 92, 246, .12); + animation: float-orb 8s ease-in-out infinite; +} +.orb-2 { + width: 240px; height: 240px; + bottom: -40px; left: -60px; + background: rgba(99, 102, 241, .10); + animation: float-orb 12s ease-in-out infinite reverse; +} +@keyframes float-orb { + 0%, 100% { transform: translate(0, 0) scale(1); } + 33% { transform: translate(20px, -20px) scale(1.1); } + 66% { transform: translate(-10px, 10px) scale(.95); } +} + +/* ═══ Content ═══ */ +.hero { + position: relative; + z-index: 1; + display: flex; + align-items: center; + justify-content: center; + height: 100%; + padding: 2rem; +} + +.hero-content { + text-align: center; + animation: fade-up .8s ease-out; +} + +@keyframes fade-up { + from { opacity: 0; transform: translateY(16px); } + to { opacity: 1; transform: translateY(0); } +} + +/* Aya: Branding-Element (Monogram) */ +.avatar { + width: 72px; height: 72px; + border-radius: 50%; + margin: 0 auto 1.5rem; + background: rgba(139, 92, 246, .10); + border: 2px solid rgba(139, 92, 246, .25); + display: flex; + align-items: center; + justify-content: center; + font-size: 1.75rem; + font-weight: 700; + color: var(--accent-strong); + letter-spacing: .04em; + box-shadow: 0 0 48px rgba(139, 92, 246, .15); + animation: pulse-avatar 3s ease-in-out infinite; +} +@keyframes pulse-avatar { + 0%, 100% { box-shadow: 0 0 32px rgba(139, 92, 246, .10); } + 50% { box-shadow: 0 0 56px rgba(139, 92, 246, .20); } +} + +/* Aya: EXTREM GROSS fΓΌr Headline */ +.hero-title { + font-size: clamp(2.8rem, 9vw, 5.5rem); + font-weight: 700; + letter-spacing: .04em; + background: var(--grad); + -webkit-background-clip: text; + -webkit-text-fill-color: transparent; + background-clip: text; + filter: drop-shadow(0 0 32px var(--accent-glow)); + margin-bottom: .35rem; + line-height: 1.1; +} + +/* Aya: WINZIG fΓΌr Subtext (3-4x kleiner als Title) */ +.hero-subtitle { + font-size: clamp(.85rem, 2vw, 1.1rem); + color: var(--tx-2); + letter-spacing: .06em; + font-weight: 400; + margin-bottom: 2rem; +} + +/* Aya: Status-Badge mit starkem Glow */ +.status-badge { + display: inline-block; + padding: .55rem 1.6rem; + border-radius: 99px; + border: 1px solid rgba(139, 92, 246, .30); + background: rgba(139, 92, 246, .08); + backdrop-filter: blur(8px); + -webkit-backdrop-filter: blur(8px); + color: var(--accent-strong); + font-size: .8rem; + font-weight: 600; + letter-spacing: .10em; + text-transform: uppercase; + box-shadow: 0 0 36px rgba(139, 92, 246, .15); + margin-bottom: 2.5rem; + animation: pulse-badge 3s ease-in-out infinite; +} + +@keyframes pulse-badge { + 0%, 100% { box-shadow: 0 0 28px rgba(139, 92, 246, .08); } + 50% { box-shadow: 0 0 48px rgba(139, 92, 246, .22); } +} + +/* ═══ Aya: CTA-Gruppe (PrimΓ€r + SekundΓ€r) ═══ */ +.cta-group { + display: flex; + align-items: center; + justify-content: center; + gap: .75rem; + flex-wrap: wrap; +} + +.cta { + display: inline-flex; + align-items: center; + gap: .5rem; + padding: .65rem 1.4rem; + border-radius: .65rem; + font-size: .9rem; + font-weight: 500; + text-decoration: none; + letter-spacing: .02em; + transition: all .25s ease; + cursor: pointer; + white-space: nowrap; +} + +/* PrimΓ€rer CTA: AusgefΓΌllt in Akzentfarbe */ +.cta-primary { + background: var(--accent); + color: #fff; + box-shadow: 0 0 28px rgba(139, 92, 246, .25); +} +.cta-primary:hover { + background: #9b6dff; + box-shadow: 0 0 40px rgba(139, 92, 246, .40); + transform: translateY(-1px); +} +.cta-primary svg { + transition: transform .25s ease; +} +.cta-primary:hover svg { + transform: translateX(2px); +} + +/* SekundΓ€rer CTA: Ghost */ +.cta-ghost { + background: transparent; + color: var(--tx-2); + border: 1px solid rgba(255,255,255,.08); +} +.cta-ghost:hover { + color: var(--tx); + background: rgba(255,255,255,.04); + border-color: rgba(139, 92, 246, .20); + transform: translateY(-1px); +} +.cta-ghost svg { + transition: transform .25s ease; +} +.cta-ghost:hover svg { + transform: translate(1px, -1px); +} + +/* ═══ Footer ═══ */ +.footer { + position: fixed; + bottom: 0; + left: 0; + right: 0; + z-index: 1; + text-align: center; + padding: 1rem; + font-size: .7rem; + color: var(--tx-3); + letter-spacing: .04em; +} + +/* ═══ Responsive ═══ */ +@media (max-width: 640px) { + .hero { padding: 1rem; } + .hero-title { font-size: clamp(2rem, 14vw, 3.5rem); } + .hero-subtitle { font-size: .8rem; } + .cta-group { flex-direction: column; gap: .5rem; } + .cta { width: 100%; justify-content: center; } + .avatar { width: 56px; height: 56px; font-size: 1.35rem; } + .orb { display: none; } +} diff --git a/index.html b/index.html new file mode 100755 index 0000000..02636fe --- /dev/null +++ b/index.html @@ -0,0 +1,55 @@ + + + + + + Noveria – Tools, Infrastruktur & KI-LΓΆsungen + + + + + + + + +
+
+
+
+ +
+
+ + +
+
+ + +
+
+ +
N
+ +

Noveria

+

Tools, Infrastruktur & KI-LΓΆsungen

+
Coming Soon
+ + + +
+
+ + + + diff --git a/nginx.conf b/nginx.conf new file mode 100755 index 0000000..521f284 --- /dev/null +++ b/nginx.conf @@ -0,0 +1,21 @@ +server { + listen 80; + server_name _; + root /usr/share/nginx/html; + index index.html; + + location / { + try_files $uri $uri/ /index.html; + } + + # Security headers + add_header X-Frame-Options "SAMEORIGIN" always; + add_header X-Content-Type-Options "nosniff" always; + add_header Referrer-Policy "no-referrer-when-downgrade" always; + + # Cache static assets + location /css/ { + expires 7d; + add_header Cache-Control "public, immutable"; + } +}