Merge version_2 into main

Merge version_2 into main
This commit was merged in pull request #4.
This commit is contained in:
2026-03-03 07:02:07 +00:00
3 changed files with 164 additions and 34 deletions

View File

@@ -1,22 +1,17 @@
import type { Metadata } from "next";
import { Archivo } from "next/font/google";
import { Halant } from "next/font/google";
import { Inter } from "next/font/google";
import { Poppins } from "next/font/google";
import { DM_Sans } from "next/font/google";
import "./globals.css";
import { ServiceWrapper } from "@/components/ServiceWrapper";
import Tag from "@/tag/Tag";
const archivo = Archivo({
variable: "--font-archivo", subsets: ["latin"],
const poppins = Poppins({
variable: "--font-poppins", subsets: ["latin"],
weight: ["100", "200", "300", "400", "500", "600", "700", "800", "900"],
});
const halant = Halant({
variable: "--font-halant", subsets: ["latin"],
weight: ["300", "400", "500", "600", "700"],
});
const inter = Inter({
variable: "--font-inter", subsets: ["latin"],
const dmSans = DM_Sans({
variable: "--font-dm-sans", subsets: ["latin"],
});
export const metadata: Metadata = {
@@ -45,7 +40,7 @@ export default function RootLayout({
<html lang="en" suppressHydrationWarning>
<ServiceWrapper>
<body
className={`${archivo.variable} ${halant.variable} ${inter.variable} antialiased`}
className={`${poppins.variable} ${dmSans.variable} antialiased`}
>
<Tag />
{children}

View File

@@ -11,21 +11,23 @@ import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCa
import FaqDouble from '@/components/sections/faq/FaqDouble';
import ContactText from '@/components/sections/contact/ContactText';
import FooterCard from '@/components/sections/footer/FooterCard';
import { Zap, CheckCircle, Lightbulb, Leaf, Linkedin, Twitter, Mail } from 'lucide-react';
import TimelineProcessFlow from '@/components/cardStack/layouts/timelines/TimelineProcessFlow';
import { Zap, CheckCircle, Lightbulb, Leaf, Linkedin, Twitter, Mail, TrendingUp, Zap as ZapIcon, Gauge } from 'lucide-react';
import Image from 'next/image';
export default function ShatexLanding() {
return (
<ThemeProvider
defaultButtonVariant="elastic-effect"
defaultTextAnimation="background-highlight"
defaultButtonVariant="hover-magnetic"
defaultTextAnimation="entrance-slide"
borderRadius="rounded"
contentWidth="small"
sizing="large"
background="circleGradient"
cardStyle="layered-gradient"
primaryButtonStyle="double-inset"
secondaryButtonStyle="radial-glow"
headingFontWeight="light"
contentWidth="mediumLarge"
sizing="mediumLargeSizeLargeTitles"
background="aurora"
cardStyle="glass-elevated"
primaryButtonStyle="primary-glow"
secondaryButtonStyle="glass"
headingFontWeight="semibold"
>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingInline
@@ -33,7 +35,8 @@ export default function ShatexLanding() {
navItems={[
{ name: "Services", id: "services" },
{ name: "Portfolio", id: "portfolio" },
{ name: "About", id: "about" },
{ name: "Timeline", id: "timeline" },
{ name: "Testimonials", id: "testimonials" },
{ name: "Contact", id: "contact" }
]}
button={{ text: "Get Started", href: "#contact" }}
@@ -48,7 +51,7 @@ export default function ShatexLanding() {
tag="Professional Engineering & Services"
tagIcon={Zap}
tagAnimation="slide-up"
background={{ variant: "plain" }}
background={{ variant: "aurora" }}
leftCarouselItems={[
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQMwNu50RAgmBhcHJELHP39VNP/a-professional-engineering-project-showc-1772520655872-7508b664.png?_wi=1", imageAlt: "Innovative Engineering Project"
@@ -167,6 +170,138 @@ export default function ShatexLanding() {
/>
</div>
<div id="timeline" data-section="timeline">
<TimelineProcessFlow
title="Company Milestones & Evolution"
description="Discover the key moments and achievements that shaped Shatex Services into the industry leader it is today."
tag="Our Journey"
textboxLayout="default"
animationType="slide-up"
items={[
{
id: "1", reverse: false,
media: (
<div className="relative w-full h-full bg-gradient-to-br from-teal-400 to-blue-600 rounded-lg overflow-hidden">
<Image
src="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQMwNu50RAgmBhcHJELHP39VNP/a-professional-engineering-project-showc-1772520655872-7508b664.png"
alt="Founding Year"
fill
className="object-cover"
/>
</div>
),
content: (
<div className="space-y-3">
<h3 className="text-2xl font-semibold text-foreground">2010 - Foundation Year</h3>
<p className="text-foreground/80">Shatex Services was founded with a vision to deliver innovative engineering solutions. Started with a small team of industry experts.</p>
<ul className="space-y-2 text-foreground/70">
<li className="flex items-center gap-2"><span className="text-primary-cta"></span> Established core team</li>
<li className="flex items-center gap-2"><span className="text-primary-cta"></span> First major client engagement</li>
<li className="flex items-center gap-2"><span className="text-primary-cta"></span> Infrastructure focus</li>
</ul>
</div>
)
},
{
id: "2", reverse: true,
media: (
<div className="relative w-full h-full bg-gradient-to-br from-purple-400 to-indigo-600 rounded-lg overflow-hidden">
<Image
src="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQMwNu50RAgmBhcHJELHP39VNP/a-professional-consultancy-image-showing-1772520655520-4c82983c.png"
alt="Expansion Phase"
fill
className="object-cover"
/>
</div>
),
content: (
<div className="space-y-3">
<h3 className="text-2xl font-semibold text-foreground">2015 - Expansion Phase</h3>
<p className="text-foreground/80">Expanded service offerings to include consultancy, project management, and sustainability solutions.</p>
<ul className="space-y-2 text-foreground/70">
<li className="flex items-center gap-2"><span className="text-primary-cta"></span> Opened new regional offices</li>
<li className="flex items-center gap-2"><span className="text-primary-cta"></span> 50+ team members</li>
<li className="flex items-center gap-2"><span className="text-primary-cta"></span> 100+ projects completed</li>
</ul>
</div>
)
},
{
id: "3", reverse: false,
media: (
<div className="relative w-full h-full bg-gradient-to-br from-green-400 to-teal-600 rounded-lg overflow-hidden">
<Image
src="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQMwNu50RAgmBhcHJELHP39VNP/a-sustainability-focused-engineering-ima-1772520655742-a60f5d75.png"
alt="Sustainability Leadership"
fill
className="object-cover"
/>
</div>
),
content: (
<div className="space-y-3">
<h3 className="text-2xl font-semibold text-foreground">2018 - Sustainability Leadership</h3>
<p className="text-foreground/80">Became recognized as a thought leader in sustainable engineering solutions and green technology initiatives.</p>
<ul className="space-y-2 text-foreground/70">
<li className="flex items-center gap-2"><span className="text-primary-cta"></span> Launched sustainability division</li>
<li className="flex items-center gap-2"><span className="text-primary-cta"></span> Industry certifications earned</li>
<li className="flex items-center gap-2"><span className="text-primary-cta"></span> 250M tons CO2 reduction</li>
</ul>
</div>
)
},
{
id: "4", reverse: true,
media: (
<div className="relative w-full h-full bg-gradient-to-br from-blue-400 to-cyan-600 rounded-lg overflow-hidden">
<Image
src="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQMwNu50RAgmBhcHJELHP39VNP/a-digital-transformation-or-software-eng-1772520655309-3e8a6b70.png"
alt="Digital Innovation"
fill
className="object-cover"
/>
</div>
),
content: (
<div className="space-y-3">
<h3 className="text-2xl font-semibold text-foreground">2021 - Digital Transformation</h3>
<p className="text-foreground/80">Embraced digital transformation, launching innovative platforms connecting facilities and enabling predictive maintenance.</p>
<ul className="space-y-2 text-foreground/70">
<li className="flex items-center gap-2"><span className="text-primary-cta"></span> Digital platform launched</li>
<li className="flex items-center gap-2"><span className="text-primary-cta"></span> 200+ team members</li>
<li className="flex items-center gap-2"><span className="text-primary-cta"></span> Global operations</li>
</ul>
</div>
)
},
{
id: "5", reverse: false,
media: (
<div className="relative w-full h-full bg-gradient-to-br from-teal-300 to-purple-600 rounded-lg overflow-hidden">
<Image
src="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQMwNu50RAgmBhcHJELHP39VNP/a-professional-team-photo-showing-multip-1772520657446-6d95f7dd.png"
alt="Global Recognition"
fill
className="object-cover"
/>
</div>
),
content: (
<div className="space-y-3">
<h3 className="text-2xl font-semibold text-foreground">2024 - Global Recognition</h3>
<p className="text-foreground/80">Achieved 500+ successful projects, $2.3B in project value, and 95% client satisfaction rate. Recognized as industry leaders worldwide.</p>
<ul className="space-y-2 text-foreground/70">
<li className="flex items-center gap-2"><span className="text-primary-cta"></span> 500+ projects completed</li>
<li className="flex items-center gap-2"><span className="text-primary-cta"></span> 95% client satisfaction</li>
<li className="flex items-center gap-2"><span className="text-primary-cta"></span> Global industry leader</li>
</ul>
</div>
)
}
]}
/>
</div>
<div id="metrics" data-section="metrics">
<MetricCardFourteen
title="Our Impact: Driving Results That Matter"
@@ -259,7 +394,7 @@ export default function ShatexLanding() {
<ContactText
text="Ready to transform your organization through strategic engineering and professional services? Let's discuss how Shatex Services can help you achieve your business goals with innovative, sustainable solutions."
animationType="background-highlight"
background={{ variant: "plain" }}
background={{ variant: "radial-gradient" }}
buttons={[
{ text: "Schedule a Consultation", href: "https://calendly.com/shatex-services" },
{ text: "Contact Our Team", href: "mailto:hello@shatex.com" }

View File

@@ -5,20 +5,20 @@
/* --background: #f5f5f5;;
--card: #ffffff;;
--foreground: #1c1c1c;;
--primary-cta: #6139e6;;
--secondary-cta: #ffffff;;
--accent: #6139e6;;
--background-accent: #b3a8e8;; */
--primary-cta: #14b8a6;;
--secondary-cta: #9333ea;;
--accent: #06b6d4;;
--background-accent: #a78bfa;; */
--background: #f5f5f5;;
--card: #ffffff;;
--foreground: #1c1c1c;;
--primary-cta: #6139e6;;
--primary-cta: #14b8a6;;
--primary-cta-text: #f5f5f5;;
--secondary-cta: #ffffff;;
--secondary-cta: #9333ea;;
--secondary-cta-text: #1c1c1c;;
--accent: #6139e6;;
--background-accent: #b3a8e8;;
--accent: #06b6d4;;
--background-accent: #a78bfa;;
/* text sizing - set by ThemeProvider */
/* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);