georg/njaa-frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[General]: Under Maintenance page has been added.

Browse Source
This commit is contained in:
georg-njaa
2026-04-01 07:18:37 +02:00
parent 5788da18ec
commit 71d9d2104c
7 changed files with 110 additions and 40 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
src/components/Navigation.tsx
View File

@@ -23,17 +23,17 @@ export default function Navigation() {
}, [isOpen]); }, [isOpen]);
const links = [ const links = [
{ name: 'Portfolio', href: '#' }, { name: 'Portfolio', href: '/under-construction' },
{ name: 'Solutions', href: '#' }, { name: 'Solutions', href: '/under-construction' },
{ name: 'Legal Notice', href: '#' }, { name: 'Legal Notice', href: '/under-construction' },
]; ];
return ( return (
<nav className={`fixed top-0 left-0 right-0 z-40 transition-all duration-300 ${scrolled ? 'py-4' : 'py-6'}`}> <nav className={`fixed top-0 left-0 right-0 z-40 transition-all duration-300 ${scrolled ? 'py-4' : 'py-6'}`}>
<div className={`mx-auto px-6 md:px-12 transition-all duration-300 ${scrolled ? 'max-w-4xl' : 'max-w-7xl'}`}> <div className={`mx-auto px-6 md:px-12 transition-all duration-300 ${scrolled ? 'max-w-4xl' : 'max-w-7xl'}`}>
<div className={`relative flex items-center justify-between p-4 rounded-2xl border transition-all duration-300 ${scrolled <div className={`relative flex items-center justify-between p-4 rounded-2xl border transition-all duration-300 ${scrolled
? 'bg-neutral-900/80 backdrop-blur-md border-white/10 shadow-lg shadow-black/50' ? 'bg-neutral-900/80 backdrop-blur-md border-white/10 shadow-lg shadow-black/50'
: 'bg-transparent border-transparent' : 'bg-transparent border-transparent'
}`}> }`}>
{/* Logo */} {/* Logo */}
@@ -55,7 +55,7 @@ export default function Navigation() {
))} ))}
<a <a
href="#" href="/under-construction"
className="px-5 py-2.5 bg-white text-black text-sm font-bold rounded-full hover:bg-[var(--color-accent)] transition-colors" className="px-5 py-2.5 bg-white text-black text-sm font-bold rounded-full hover:bg-[var(--color-accent)] transition-colors"
> >
Client Portal Client Portal
@@ -86,7 +86,7 @@ export default function Navigation() {
))} ))}
<hr className="border-white/10 my-2" /> <hr className="border-white/10 my-2" />
<a <a
href="#" href="/under-construction"
className="text-center px-5 py-3 bg-white text-black font-bold rounded-xl hover:bg-[var(--color-accent)] transition-colors" className="text-center px-5 py-3 bg-white text-black font-bold rounded-xl hover:bg-[var(--color-accent)] transition-colors"
> >
Client Portal Client Portal

12
src/components/sections/FooterSection.tsx
View File

@@ -24,10 +24,10 @@ export default function FooterSection() {
<div className="flex flex-col gap-5"> <div className="flex flex-col gap-5">
<span className="text-[10px] font-mono text-neutral-500 uppercase tracking-widest">Navigation</span> <span className="text-[10px] font-mono text-neutral-500 uppercase tracking-widest">Navigation</span>
<ul className="flex flex-col gap-3"> <ul className="flex flex-col gap-3">
<li><a href="#" className="text-neutral-300 hover:text-[var(--color-accent)] transition-colors text-sm">Home</a></li> <li><a href="/" className="text-neutral-300 hover:text-[var(--color-accent)] transition-colors text-sm">Home</a></li>
<li><a href="#" className="text-neutral-300 hover:text-[var(--color-accent)] transition-colors text-sm">Philosophy</a></li> <li><a href="/under-construction" className="text-neutral-300 hover:text-[var(--color-accent)] transition-colors text-sm">Client Portal</a></li>
<li><a href="#" className="text-neutral-300 hover:text-[var(--color-accent)] transition-colors text-sm">Capabilities</a></li> <li><a href="/under-construction" className="text-neutral-300 hover:text-[var(--color-accent)] transition-colors text-sm">Portfolio</a></li>
<li><a href="#" className="text-neutral-300 hover:text-[var(--color-accent)] transition-colors text-sm">Contact</a></li> <li><a href="/under-construction" className="text-neutral-300 hover:text-[var(--color-accent)] transition-colors text-sm">Solutions</a></li>
</ul> </ul>
</div> </div>
@@ -98,8 +98,8 @@ export default function FooterSection() {
© {new Date().getFullYear()} NotJustAn.Agency. All rights reserved. © {new Date().getFullYear()} NotJustAn.Agency. All rights reserved.
</p> </p>
<div className="flex gap-6"> <div className="flex gap-6">
<a href="#" className="text-xs text-neutral-600 hover:text-[var(--color-accent)] transition-colors">Privacy Policy</a> <a href="/under-construction" className="text-xs text-neutral-600 hover:text-[var(--color-accent)] transition-colors">Legal Notice</a>
<a href="#" className="text-xs text-neutral-600 hover:text-[var(--color-accent)] transition-colors">Imprint</a> <a href="/under-construction" className="text-xs text-neutral-600 hover:text-[var(--color-accent)] transition-colors">Privacy Policy</a>
</div> </div>
</div> </div>
</div> </div>

4
src/components/sections/HeroSection.tsx
View File

@@ -121,11 +121,11 @@ export default function HeroSection() {
</p> </p>
<div className="hero-text-line pt-4 flex flex-col sm:flex-row gap-6 items-center justify-center"> <div className="hero-text-line pt-4 flex flex-col sm:flex-row gap-6 items-center justify-center">
<button className="group relative px-6 py-3 md:px-8 md:py-4 bg-[var(--color-accent)] text-black font-bold text-base md:text-lg rounded-full overflow-hidden transition-all hover:shadow-[0_0_40px_rgba(204,255,0,0.3)] hover:scale-105"> <a href="/under-construction" className="group relative flex justify-center px-6 py-3 md:px-8 md:py-4 bg-[var(--color-accent)] text-black font-bold text-base md:text-lg rounded-full overflow-hidden transition-all hover:shadow-[0_0_40px_rgba(204,255,0,0.3)] hover:scale-105">
<span className="relative z-10 flex items-center gap-2"> <span className="relative z-10 flex items-center gap-2">
Contact us <ArrowRight className="w-5 h-5 transition-transform group-hover:translate-x-1" /> Contact us <ArrowRight className="w-5 h-5 transition-transform group-hover:translate-x-1" />
</span> </span>
</button> </a>
<div className="font-mono text-xs md:text-sm text-neutral-500 flex flex-col items-center lg:items-start gap-1"> <div className="font-mono text-xs md:text-sm text-neutral-500 flex flex-col items-center lg:items-start gap-1">
<div className="flex items-center gap-2"> <div className="flex items-center gap-2">

4
src/components/sections/InsightsSection.tsx
View File

@@ -71,7 +71,7 @@ export default function InsightsSection() {
Intel & <span className="text-neutral-500">Insights</span> Intel & <span className="text-neutral-500">Insights</span>
</h2> </h2>
</div> </div>
<a href="#resources" className="group flex items-center gap-2 text-[var(--color-accent)] hover:text-white transition-colors pb-2"> <a href="/under-construction" className="group flex items-center gap-2 text-[var(--color-accent)] hover:text-white transition-colors pb-2">
<span className="font-mono text-xs sm:text-sm tracking-widest uppercase font-bold">Read the Blueprints</span> <span className="font-mono text-xs sm:text-sm tracking-widest uppercase font-bold">Read the Blueprints</span>
<ArrowRight className="w-4 h-4 transform group-hover:translate-x-1 transition-transform" /> <ArrowRight className="w-4 h-4 transform group-hover:translate-x-1 transition-transform" />
</a> </a>
@@ -80,7 +80,7 @@ export default function InsightsSection() {
{/* 3-Column Card Grid */} {/* 3-Column Card Grid */}
<div className="insights-grid grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8"> <div className="insights-grid grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
{insights.map((insight, i) => ( {insights.map((insight, i) => (
<a key={i} href="#guide" className="insight-card group flex flex-col gap-6 cursor-pointer"> <a key={i} href="/under-construction" className="insight-card group flex flex-col gap-6 cursor-pointer">
{/* Premium Pattern Data Container (Replacing flat images) */} {/* Premium Pattern Data Container (Replacing flat images) */}
<div className="relative w-full aspect-[4/3] bg-[#0c0c0c] overflow-hidden rounded-xl border border-white/5 group-hover:border-[var(--color-accent)]/30 transition-colors duration-500"> <div className="relative w-full aspect-[4/3] bg-[#0c0c0c] overflow-hidden rounded-xl border border-white/5 group-hover:border-[var(--color-accent)]/30 transition-colors duration-500">

7
src/components/sections/ServicesSection.tsx
View File

@@ -92,9 +92,10 @@ export default function ServicesSection() {
onMouseLeave={() => setIsHovering(false)} onMouseLeave={() => setIsHovering(false)}
> >
{services.map((service, index) => ( {services.map((service, index) => (
<div <a
key={index} key={index}
className="group relative flex flex-col md:flex-row md:items-center justify-start py-8 md:py-10 border-b border-white/10 md:cursor-none" href="/under-construction"
className="group relative flex flex-col md:flex-row md:items-center justify-start py-8 md:py-10 border-b border-white/10 md:cursor-none block"
> >
{/* Service Number */} {/* Service Number */}
@@ -122,7 +123,7 @@ export default function ServicesSection() {
{service.name} {service.name}
</h3> </h3>
</div> </a>
))} ))}
</div> </div>

40
src/pages/index.astro
View File

@@ -1,17 +1,17 @@
--- ---
import Layout from '../layouts/Layout.astro'; import Layout from "../layouts/Layout.astro";
import LoadingScreen from '../components/ui/LoadingScreen'; import LoadingScreen from "../components/ui/LoadingScreen";
import HeroSection from '../components/sections/HeroSection'; import HeroSection from "../components/sections/HeroSection";
import ApproachSection from '../components/sections/ApproachSection'; import ApproachSection from "../components/sections/ApproachSection";
import ServicesSection from '../components/sections/ServicesSection'; import ServicesSection from "../components/sections/ServicesSection";
import InsightsSection from '../components/sections/InsightsSection'; import InsightsSection from "../components/sections/InsightsSection";
import BusinessStagesSection from '../components/sections/BusinessStagesSection'; import BusinessStagesSection from "../components/sections/BusinessStagesSection";
import StrategySection from '../components/sections/StrategySection'; import StrategySection from "../components/sections/StrategySection";
import BrandAwarenessSection from '../components/sections/BrandAwarenessSection'; import BrandAwarenessSection from "../components/sections/BrandAwarenessSection";
import PerformanceMarketingSection from '../components/sections/PerformanceMarketingSection'; import PerformanceMarketingSection from "../components/sections/PerformanceMarketingSection";
import OfferSection from '../components/sections/OfferSection'; import OfferSection from "../components/sections/OfferSection";
import ContactForm from '../components/forms/ContactForm'; import ContactForm from "../components/forms/ContactForm";
import FooterSection from '../components/sections/FooterSection'; import FooterSection from "../components/sections/FooterSection";
--- ---
<Layout title="NotJustAn.Agency | Premium Web Design & Development"> <Layout title="NotJustAn.Agency | Premium Web Design & Development">
@@ -20,13 +20,13 @@ import FooterSection from '../components/sections/FooterSection';
<HeroSection client:load /> <HeroSection client:load />
<ApproachSection client:visible /> <ApproachSection client:visible />
<ServicesSection client:visible /> <ServicesSection client:visible />
<InsightsSection client:visible /> {false && <InsightsSection client:visible />}
<BusinessStagesSection client:visible /> {false && <BusinessStagesSection client:visible />}
<StrategySection client:visible /> {false && <StrategySection client:visible />}
<BrandAwarenessSection client:visible /> {false && <BrandAwarenessSection client:visible />}
<PerformanceMarketingSection client:visible /> {false && <PerformanceMarketingSection client:visible />}
<OfferSection client:load /> {false && <OfferSection client:load />}
<ContactForm client:visible /> {false && <ContactForm client:visible />}
<FooterSection client:visible /> <FooterSection client:visible />
</main> </main>
</Layout> </Layout>

69
src/pages/under-construction.astro Normal file
View File

@@ -0,0 +1,69 @@
---
import Layout from "../layouts/Layout.astro";
import { Clock, ArrowLeft } from "lucide-react";
---
<Layout title="NotJustAn.Agency | System Overhaul">
<main
class="flex flex-col min-h-screen relative z-10 bg-black items-center justify-center p-6 text-center overflow-hidden mt-24"
>
<!-- Structural Abstract Background -->
<div class="absolute inset-0 z-0 pointer-events-none">
<div
class="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-[80vw] h-[80vw] max-w-[800px] max-h-[800px] bg-[var(--color-accent)]/5 blur-[120px] rounded-full"
>
</div>
<div
class="absolute inset-0"
style="background-image: radial-gradient(rgba(255,255,255,0.05) 1px, transparent 1px); background-size: 30px 30px;"
>
</div>
</div>
<div class="relative z-10 max-w-3xl flex flex-col items-center gap-8">
<div class="flex flex-col items-center gap-8 px-4">
<h2
class="text-5xl md:text-7xl lg:text-[4rem] font-bold uppercase tracking-tighter text-transparent bg-clip-text bg-gradient-to-b from-white to-neutral-600 leading-[1.05] pb-2"
>
Website is currently under maintenance.
</h2>
<p
class="text-neutral-400 text-lg md:text-xl max-w-xl leading-relaxed mt-4 font-light"
>
This page and many other ones are currently under
construction. Updates will be deployed shortly.
</p>
</div>
<a
href="/"
class="mt-8 group flex items-center gap-3 px-8 py-4 bg-white/5 border border-white/10 hover:border-[var(--color-accent)] hover:shadow-[0_0_40px_rgba(204,255,0,0.2)] rounded-full text-white hover:text-[var(--color-accent)] transition-all duration-300"
>
<ArrowLeft
className="w-5 h-5 transition-transform group-hover:-translate-x-2"
/>
<span
class="font-mono text-sm tracking-widest uppercase font-bold"
>Return to Main Page</span
>
</a>
<!-- Legal Contact Footer -->
<div
class="mt-16 flex flex-col sm:flex-row items-center gap-6 pt-12 border-t border-white/10 w-full justify-center"
>
<a
href="mailto:hello@notjustan.agency"
class="text-neutral-300 hover:text-[var(--color-accent)] transition-colors font-mono text-xs md:text-sm tracking-widest uppercase"
>hello@notjustan.agency</a
>
<span class="hidden sm:block text-neutral-700">|</span>
<span
class="text-neutral-500 font-mono text-xs md:text-sm tracking-widest uppercase"
>Vienna, AT</span
>
</div>
</div>
</main>
</Layout>