- Implemented astro-i18next for multi-language support, including English, Dutch, and Italian. - Configured default locale and language fallback settings. - Defined routes for localized content in the configuration. - Updated package.json and package-lock.json to include new dependencies for i18next and related plugins.
51 lines
7.4 KiB
JavaScript
51 lines
7.4 KiB
JavaScript
import '../chunks/page-ssr_ChKiSmuh.mjs';
|
||
import { c as createComponent, r as renderComponent, a as renderTemplate, m as maybeRenderHead } from '../chunks/astro/server_DJC9Xx9K.mjs';
|
||
import 'kleur/colors';
|
||
import { changeLanguage } from 'i18next';
|
||
import { t, $ as $$BaseLayout, a as $$Header, b as $$Footer } from '../chunks/Footer_BFBz0LQo.mjs';
|
||
import { $ as $$CTA } from '../chunks/CTA_CIVpts3M.mjs';
|
||
export { renderers } from '../renderers.mjs';
|
||
|
||
const $$About = createComponent(($$result, $$props, $$slots) => {
|
||
changeLanguage("en");
|
||
return renderTemplate`${renderComponent($$result, "BaseLayout", $$BaseLayout, { "title": `${t("nav.about")} | ${t("meta.title")}`, "description": "Learn about Tiber365 - your trusted IT partner specializing in Microsoft 365, networking, and comprehensive IT solutions for small businesses." }, { "default": ($$result2) => renderTemplate` ${renderComponent($$result2, "Header", $$Header, {})} ${maybeRenderHead()}<main> <!-- About Hero --> <section class="py-20 bg-gradient-to-br from-background via-background to-muted"> <div class="container-custom"> <div class="text-center max-w-4xl mx-auto animate-on-scroll"> <h1 class="text-4xl sm:text-5xl lg:text-6xl font-display font-bold text-foreground mb-6"> ${t("about.title")} </h1> <p class="text-lg sm:text-xl text-muted-foreground leading-relaxed"> ${t("about.subtitle")} </p> </div> </div> </section> <!-- Company Story --> <section class="py-20 bg-background"> <div class="container-custom"> <div class="grid grid-cols-1 lg:grid-cols-2 gap-12 items-center"> <!-- Content --> <div class="animate-on-scroll"> <h2 class="text-3xl sm:text-4xl font-display font-bold text-foreground mb-6">
|
||
Our Story
|
||
</h2> <p class="text-lg text-muted-foreground mb-6 leading-relaxed"> ${t("about.description")} </p> <p class="text-lg text-muted-foreground leading-relaxed"> ${t("about.mission")} </p> </div> <!-- Visual --> <div class="animate-on-scroll" style="animation-delay: 0.2s"> <div class="card p-8 bg-gradient-to-br from-primary/5 via-primary/10 to-secondary/5"> <div class="text-center"> <div class="text-6xl mb-6">🚀</div> <h3 class="text-xl font-semibold text-foreground mb-4">Modern IT Solutions</h3> <p class="text-muted-foreground">
|
||
Empowering businesses with cutting-edge technology and reliable support.
|
||
</p> </div> </div> </div> </div> </div> </section> <!-- Stats --> <section class="py-20 bg-muted/30"> <div class="container-custom"> <div class="grid grid-cols-1 sm:grid-cols-3 gap-8 text-center"> <div class="animate-on-scroll"> <div class="text-4xl sm:text-5xl font-bold text-primary mb-2">5+</div> <div class="text-muted-foreground">${t("about.experience")}</div> </div> <div class="animate-on-scroll" style="animation-delay: 0.1s"> <div class="text-4xl sm:text-5xl font-bold text-primary mb-2">100+</div> <div class="text-muted-foreground">${t("about.clients")}</div> </div> <div class="animate-on-scroll" style="animation-delay: 0.2s"> <div class="text-4xl sm:text-5xl font-bold text-primary mb-2">200+</div> <div class="text-muted-foreground">${t("about.projects")}</div> </div> </div> </div> </section> <!-- Values --> <section class="py-20 bg-background"> <div class="container-custom"> <div class="text-center mb-16 animate-on-scroll"> <h2 class="text-3xl sm:text-4xl lg:text-5xl font-display font-bold text-foreground mb-4">
|
||
Our Values
|
||
</h2> <p class="text-lg sm:text-xl text-muted-foreground max-w-3xl mx-auto">
|
||
The principles that guide everything we do
|
||
</p> </div> <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8"> <div class="card p-6 text-center animate-on-scroll"> <div class="text-4xl mb-4">🔒</div> <h3 class="text-xl font-semibold text-foreground mb-3">Security First</h3> <p class="text-muted-foreground">
|
||
We prioritize the security and privacy of your business data above all else.
|
||
</p> </div> <div class="card p-6 text-center animate-on-scroll" style="animation-delay: 0.1s"> <div class="text-4xl mb-4">🤝</div> <h3 class="text-xl font-semibold text-foreground mb-3">Reliability</h3> <p class="text-muted-foreground">
|
||
Count on us for consistent, dependable service that keeps your business running.
|
||
</p> </div> <div class="card p-6 text-center animate-on-scroll" style="animation-delay: 0.2s"> <div class="text-4xl mb-4">💡</div> <h3 class="text-xl font-semibold text-foreground mb-3">Innovation</h3> <p class="text-muted-foreground">
|
||
We stay ahead of technology trends to bring you the best solutions.
|
||
</p> </div> <div class="card p-6 text-center animate-on-scroll" style="animation-delay: 0.3s"> <div class="text-4xl mb-4">📞</div> <h3 class="text-xl font-semibold text-foreground mb-3">Support</h3> <p class="text-muted-foreground">
|
||
Dedicated support when you need it, with real people who understand your business.
|
||
</p> </div> <div class="card p-6 text-center animate-on-scroll" style="animation-delay: 0.4s"> <div class="text-4xl mb-4">⚡</div> <h3 class="text-xl font-semibold text-foreground mb-3">Efficiency</h3> <p class="text-muted-foreground">
|
||
Streamlined processes and quick resolutions to minimize downtime.
|
||
</p> </div> <div class="card p-6 text-center animate-on-scroll" style="animation-delay: 0.5s"> <div class="text-4xl mb-4">🎯</div> <h3 class="text-xl font-semibold text-foreground mb-3">Focus</h3> <p class="text-muted-foreground">
|
||
Laser-focused on small business needs and cost-effective solutions.
|
||
</p> </div> </div> </div> </section> <!-- Team Section --> <section class="py-20 bg-muted/30"> <div class="container-custom"> <div class="text-center mb-16 animate-on-scroll"> <h2 class="text-3xl sm:text-4xl lg:text-5xl font-display font-bold text-foreground mb-4">
|
||
Our Expertise
|
||
</h2> <p class="text-lg sm:text-xl text-muted-foreground max-w-3xl mx-auto">
|
||
Specialized knowledge in the technologies that matter to your business
|
||
</p> </div> <div class="grid grid-cols-2 md:grid-cols-4 lg:grid-cols-6 gap-6"> <div class="card p-4 text-center animate-on-scroll"> <div class="text-3xl mb-2">🏢</div> <div class="text-sm font-medium text-foreground">Microsoft 365</div> </div> <div class="card p-4 text-center animate-on-scroll" style="animation-delay: 0.1s"> <div class="text-3xl mb-2">☁️</div> <div class="text-sm font-medium text-foreground">Cloud Services</div> </div> <div class="card p-4 text-center animate-on-scroll" style="animation-delay: 0.2s"> <div class="text-3xl mb-2">🌐</div> <div class="text-sm font-medium text-foreground">Networking</div> </div> <div class="card p-4 text-center animate-on-scroll" style="animation-delay: 0.3s"> <div class="text-3xl mb-2">🔒</div> <div class="text-sm font-medium text-foreground">Security</div> </div> <div class="card p-4 text-center animate-on-scroll" style="animation-delay: 0.4s"> <div class="text-3xl mb-2">🚀</div> <div class="text-sm font-medium text-foreground">Web Hosting</div> </div> <div class="card p-4 text-center animate-on-scroll" style="animation-delay: 0.5s"> <div class="text-3xl mb-2">⚙️</div> <div class="text-sm font-medium text-foreground">Automation</div> </div> </div> </div> </section> ${renderComponent($$result2, "CTA", $$CTA, {})} </main> ${renderComponent($$result2, "Footer", $$Footer, {})} ` })}`;
|
||
}, "/Users/richard/Website Development/tiber365/src/pages/about.astro", void 0);
|
||
|
||
const $$file = "/Users/richard/Website Development/tiber365/src/pages/about.astro";
|
||
const $$url = "/about";
|
||
|
||
const _page = /*#__PURE__*/Object.freeze(/*#__PURE__*/Object.defineProperty({
|
||
__proto__: null,
|
||
default: $$About,
|
||
file: $$file,
|
||
url: $$url
|
||
}, Symbol.toStringTag, { value: 'Module' }));
|
||
|
||
const page = () => _page;
|
||
|
||
export { page };
|