diff --git a/public/LOGO-Light-Web.png b/public/LOGO-Light-Web.png new file mode 100644 index 0000000..e51f8b9 Binary files /dev/null and b/public/LOGO-Light-Web.png differ diff --git a/public/favicon.ico b/public/favicon.ico index dd5a126..9bc7cff 100644 Binary files a/public/favicon.ico and b/public/favicon.ico differ diff --git a/public/hero-subpage.png b/public/hero-subpage.png new file mode 100644 index 0000000..cd64d2e Binary files /dev/null and b/public/hero-subpage.png differ diff --git a/public/hero_subpage.png b/public/hero_subpage.png new file mode 100644 index 0000000..97c890f Binary files /dev/null and b/public/hero_subpage.png differ diff --git a/src/App.tsx b/src/App.tsx index e866a67..c86cfc3 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -10,6 +10,9 @@ import ClientsProjects from "./pages/ClientsProjects"; import Locations from "./pages/Locations"; import Careers from "./pages/Careers"; import Contact from "./pages/Contact"; +import Legal from "./pages/Legal"; +import Privacy from "./pages/Privacy"; +import Terms from "./pages/Terms"; import NotFound from "./pages/NotFound"; const queryClient = new QueryClient(); @@ -28,6 +31,9 @@ const App = () => ( } /> } /> } /> + } /> + } /> + } /> {/* ADD ALL CUSTOM ROUTES ABOVE THE CATCH-ALL "*" ROUTE */} } /> diff --git a/src/components/CompanyBlurb.tsx b/src/components/CompanyBlurb.tsx index 0b4931a..d8970f5 100644 --- a/src/components/CompanyBlurb.tsx +++ b/src/components/CompanyBlurb.tsx @@ -2,8 +2,21 @@ import React from 'react'; import { Button } from '@/components/ui/button'; import { ArrowRight, Shield, Award, Wrench } from 'lucide-react'; import content from '@/content/content.json'; +import { useNavigate } from 'react-router-dom'; const CompanyBlurb = () => { + const navigate = useNavigate(); + + const handleGetStarted = () => { + navigate('/contact-us'); + window.scrollTo({ top: 0, behavior: 'smooth' }); + }; + + const handleViewWork = () => { + navigate('/clients-and-projects'); + window.scrollTo({ top: 0, behavior: 'smooth' }); + }; + return (
{/* Background geometric elements */} @@ -29,8 +42,8 @@ const CompanyBlurb = () => { {/* Three column benefits with boxes */}
{/* Operational Efficiency */} -
-
+
+
{/* Icon container */}
@@ -50,8 +63,8 @@ const CompanyBlurb = () => {
{/* Strengthen Quality */} -
-
+
+
{/* Icon container */}
@@ -71,8 +84,8 @@ const CompanyBlurb = () => {
{/* Boost Performance */} -
-
+
+
{/* Icon container */}
@@ -95,7 +108,11 @@ const CompanyBlurb = () => { {/* CTA Section */}
- @@ -103,6 +120,7 @@ const CompanyBlurb = () => { variant="outline" size="xl" className="border-slate-500/50 bg-slate-800/50 text-white hover:bg-slate-700/50 hover:border-slate-400 font-semibold text-lg px-8 py-4 h-auto rounded-lg backdrop-blur-sm" + onClick={handleViewWork} > View Our Work diff --git a/src/components/Footer.tsx b/src/components/Footer.tsx index 4d75fc1..1c09bd5 100644 --- a/src/components/Footer.tsx +++ b/src/components/Footer.tsx @@ -1,7 +1,20 @@ import React from 'react'; import content from '@/content/content.json'; +import { useNavigate } from 'react-router-dom'; const Footer = () => { + const navigate = useNavigate(); + + const handleGetStarted = () => { + navigate('/contact-us'); + window.scrollTo({ top: 0, behavior: 'smooth' }); + }; + + const handleNavigation = (path) => { + navigate(path); + window.scrollTo({ top: 0, behavior: 'smooth' }); + }; + return (
{/* Corner frame elements */} -
-
+
+
@@ -36,28 +36,28 @@ const Hero = () => { {/* Content - Left Side - Exact Dispel Style */}
-

+

Redefine How You
Connect to Welding

-

+

Professional welding and fabrication services for industrial and commercial projects—connecting to quality craftsmanship in under 30 seconds to cut downtime, lower costs, and accelerate modernization.

{/* CTAs - Exact Dispel Style */} -
+
@@ -65,7 +65,7 @@ const Hero = () => {
{/* 3D Perspective Container - Right Side - Exact Dispel Style */} -
+
{/* 3D Tilted Screen Container - Exact Dispel Style */}
{/* 3D Container with perspective */} @@ -106,8 +106,8 @@ const Hero = () => {
{/* Floating decorative elements */} -
-
+
+
diff --git a/src/components/LogoSection.tsx b/src/components/LogoSection.tsx index 70a0117..418d4ba 100644 --- a/src/components/LogoSection.tsx +++ b/src/components/LogoSection.tsx @@ -1,6 +1,13 @@ import React from 'react'; +import { useCountUp } from '@/hooks/useCountUp'; const LogoSection = () => { + // Count-up animations for stats + const secondsCount = useCountUp({ end: 30, suffix: '', duration: 2000 }); + const savingsCount = useCountUp({ end: 23, suffix: 'K', duration: 2500, delay: 200 }); + const projectsCount = useCountUp({ end: 1, suffix: '', duration: 1500, delay: 400 }); + const millionsCount = useCountUp({ end: 2, suffix: 'M', duration: 2200, delay: 600 }); + const clients = [ { name: 'ExxonMobil', logo: 'EM' }, { name: 'Chevron', logo: 'CV' }, @@ -22,36 +29,48 @@ const LogoSection = () => { {/* Statistics Row */}
-
-
- <30 +
+
+ <{secondsCount.count}

seconds is how fast we connect to welding projects, beating the industry average.

-
-
- $23K +
+
+ ${savingsCount.count}

in downtime costs per incident is avoided through expert welding.

-
-
- 1 +
+
+ {projectsCount.count}

project deployed per day for a month with our team by a Fortune 500 manufacturer.

-
-
- $2M +
+
+ ${millionsCount.count}

saved per year by a leading energy company by improving operating efficiency. diff --git a/src/hooks/useCountUp.ts b/src/hooks/useCountUp.ts new file mode 100644 index 0000000..5b0b080 --- /dev/null +++ b/src/hooks/useCountUp.ts @@ -0,0 +1,69 @@ +import { useState, useEffect, useRef } from 'react'; + +interface UseCountUpOptions { + end: number; + duration?: number; + delay?: number; + suffix?: string; +} + +export const useCountUp = ({ end, duration = 2000, delay = 0, suffix = '' }: UseCountUpOptions) => { + const [count, setCount] = useState(0); + const [isVisible, setIsVisible] = useState(false); + const elementRef = useRef(null); + const hasAnimated = useRef(false); + + useEffect(() => { + const observer = new IntersectionObserver( + ([entry]) => { + if (entry.isIntersecting && !hasAnimated.current) { + setIsVisible(true); + hasAnimated.current = true; + } + }, + { threshold: 0.5 } + ); + + if (elementRef.current) { + observer.observe(elementRef.current); + } + + return () => { + if (elementRef.current) { + observer.unobserve(elementRef.current); + } + }; + }, []); + + useEffect(() => { + if (!isVisible) return; + + const startTime = Date.now() + delay; + const startValue = 0; + + const animate = () => { + const now = Date.now(); + if (now < startTime) { + requestAnimationFrame(animate); + return; + } + + const elapsed = now - startTime; + const progress = Math.min(elapsed / duration, 1); + + // Easing function for smooth animation + const easeOutCubic = 1 - Math.pow(1 - progress, 3); + const currentValue = Math.floor(startValue + (end - startValue) * easeOutCubic); + + setCount(currentValue); + + if (progress < 1) { + requestAnimationFrame(animate); + } + }; + + requestAnimationFrame(animate); + }, [isVisible, end, duration, delay]); + + return { count: count + suffix, ref: elementRef }; +}; diff --git a/src/hooks/useScrollAnimation.ts b/src/hooks/useScrollAnimation.ts new file mode 100644 index 0000000..cbd74f1 --- /dev/null +++ b/src/hooks/useScrollAnimation.ts @@ -0,0 +1,33 @@ +import { useEffect } from 'react'; + +export const useScrollAnimation = () => { + useEffect(() => { + const observerCallback = (entries: IntersectionObserverEntry[]) => { + entries.forEach((entry) => { + if (entry.isIntersecting) { + entry.target.classList.add('animate-visible'); + } + }); + }; + + const observer = new IntersectionObserver(observerCallback, { + threshold: 0.1, + rootMargin: '0px 0px -50px 0px', + }); + + // Observe all elements with animation classes + const animatedElements = document.querySelectorAll( + '.animate-fadeInUp, .animate-fadeInLeft, .animate-fadeInRight, .animate-scaleIn, .animate-slideInDown' + ); + + animatedElements.forEach((el) => { + observer.observe(el); + }); + + return () => { + animatedElements.forEach((el) => { + observer.unobserve(el); + }); + }; + }, []); +}; diff --git a/src/index.css b/src/index.css index 653c002..094c176 100644 --- a/src/index.css +++ b/src/index.css @@ -192,13 +192,211 @@ .carousel-autoplay-paused { @apply bg-muted/50; } + + /* Animation classes */ + .animate-fadeInUp { + opacity: 0; + transform: translateY(30px); + transition: opacity 0.8s ease-out, transform 0.8s ease-out; + } + + .animate-fadeInUp.animate-visible { + opacity: 1; + transform: translateY(0); + } + + .animate-fadeInLeft { + opacity: 0; + transform: translateX(-30px); + transition: opacity 0.8s ease-out, transform 0.8s ease-out; + } + + .animate-fadeInLeft.animate-visible { + opacity: 1; + transform: translateX(0); + } + + .animate-fadeInRight { + opacity: 0; + transform: translateX(30px); + transition: opacity 0.8s ease-out, transform 0.8s ease-out; + } + + .animate-fadeInRight.animate-visible { + opacity: 1; + transform: translateX(0); + } + + .animate-scaleIn { + opacity: 0; + transform: scale(0.9); + transition: opacity 0.6s ease-out, transform 0.6s ease-out; + } + + .animate-scaleIn.animate-visible { + opacity: 1; + transform: scale(1); + } + + .animate-slideInDown { + opacity: 0; + transform: translateY(-30px); + transition: opacity 0.7s ease-out, transform 0.7s ease-out; + } + + .animate-slideInDown.animate-visible { + opacity: 1; + transform: translateY(0); + } + + .animate-pulse-blue { + animation: pulseBlue 2s infinite; + } + + .animate-float { + animation: float 6s ease-in-out infinite; + } + + .animate-rotate-slow { + animation: rotateSlow 20s linear infinite; + } + + /* Immediate visible animations */ + .animate-bounce-subtle { + animation: bounceSubtle 2s ease-in-out infinite; + } + + /* Simple hover animations that should be immediately visible */ + .hover-lift { + transition: transform 0.3s ease, box-shadow 0.3s ease; + } + + .hover-lift:hover { + transform: translateY(-2px); + box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2); + } + + .hover-glow { + transition: box-shadow 0.3s ease; + } + + .hover-glow:hover { + box-shadow: 0 0 20px rgba(59, 130, 246, 0.3); + } +} + +/* Keyframe animations */ +@keyframes fadeInUp { + to { + opacity: 1; + transform: translateY(0); + } +} + +@keyframes fadeInLeft { + to { + opacity: 1; + transform: translateX(0); + } +} + +@keyframes fadeInRight { + to { + opacity: 1; + transform: translateX(0); + } +} + +@keyframes scaleIn { + to { + opacity: 1; + transform: scale(1); + } +} + +@keyframes slideInDown { + to { + opacity: 1; + transform: translateY(0); + } +} + +@keyframes pulseBlue { + 0%, 100% { + box-shadow: 0 0 0 0 rgba(59, 130, 246, 0.7); + } + 70% { + box-shadow: 0 0 0 10px rgba(59, 130, 246, 0); + } +} + +@keyframes float { + 0%, 100% { + transform: translateY(0px); + } + 50% { + transform: translateY(-20px); + } +} + +@keyframes rotateSlow { + from { + transform: rotate(0deg); + } + to { + transform: rotate(360deg); + } +} + +@keyframes bounceSubtle { + 0%, 100% { + transform: translateY(0); + } + 50% { + transform: translateY(-5px); + } } @layer utilities { + /* Text truncation utilities */ + .line-clamp-1 { + overflow: hidden; + display: -webkit-box; + -webkit-box-orient: vertical; + -webkit-line-clamp: 1; + } + + .line-clamp-2 { + overflow: hidden; + display: -webkit-box; + -webkit-box-orient: vertical; + -webkit-line-clamp: 2; + } + + .line-clamp-3 { + overflow: hidden; + display: -webkit-box; + -webkit-box-orient: vertical; + -webkit-line-clamp: 3; + } + /* Reduced motion support */ @media (prefers-reduced-motion: reduce) { .transition-smooth { transition: none; } + + .animate-fadeInUp, + .animate-fadeInLeft, + .animate-fadeInRight, + .animate-scaleIn, + .animate-slideInDown, + .animate-pulse-blue, + .animate-float, + .animate-rotate-slow { + animation: none; + opacity: 1; + transform: none; + } } } diff --git a/src/pages/About.tsx b/src/pages/About.tsx index 0682a12..d210309 100644 --- a/src/pages/About.tsx +++ b/src/pages/About.tsx @@ -1,22 +1,38 @@ import React from 'react'; import Header from '@/components/Header'; import Footer from '@/components/Footer'; -import { Building, Users, Award } from 'lucide-react'; +import { Building, Users, Award, ChevronRight } from 'lucide-react'; import content from '@/content/content.json'; const About = () => { return (

+ + {/* Breadcrumbs */} + +
{/* Hero Section with Image */}
{/* Background Image */}
-
{/* Geometric Elements */} diff --git a/src/pages/Careers.tsx b/src/pages/Careers.tsx index 2e9ad70..d3ffa23 100644 --- a/src/pages/Careers.tsx +++ b/src/pages/Careers.tsx @@ -1,7 +1,7 @@ import React from 'react'; import Header from '@/components/Header'; import Footer from '@/components/Footer'; -import { Users, Clock, Download, Upload, Phone, CheckCircle } from 'lucide-react'; +import { Users, Clock, Download, Upload, Phone, CheckCircle, ChevronRight } from 'lucide-react'; import { Button } from '@/components/ui/button'; const Careers = () => { @@ -25,15 +25,31 @@ const Careers = () => { return (
+ + {/* Breadcrumbs */} + +
{/* Hero Section with Image */}
{/* Background Image */}
-
{/* Geometric Elements */} diff --git a/src/pages/ClientsProjects.tsx b/src/pages/ClientsProjects.tsx index ed71911..c3c4915 100644 --- a/src/pages/ClientsProjects.tsx +++ b/src/pages/ClientsProjects.tsx @@ -1,15 +1,45 @@ -import React from 'react'; +import React, { useState, useMemo } from 'react'; import Header from '@/components/Header'; import Footer from '@/components/Footer'; -import { MapPin, Clock, Users, Building, Award } from 'lucide-react'; +import { MapPin, Clock, Users, Building, Award, Search, Filter, ArrowUp, ChevronRight } from 'lucide-react'; +import { useCountUp } from '@/hooks/useCountUp'; +import { useScrollAnimation } from '@/hooks/useScrollAnimation'; const ClientsProjects = () => { + useScrollAnimation(); + + // Search and filter states + const [searchTerm, setSearchTerm] = useState(''); + const [selectedIndustry, setSelectedIndustry] = useState('All'); + const [selectedLocation, setSelectedLocation] = useState('All'); + const [showBackToTop, setShowBackToTop] = useState(false); + const [isLoading, setIsLoading] = useState(false); + + // Stats with count-up animations + const clientsCount = useCountUp({ end: 56, duration: 2500 }); + const projectsCount = useCountUp({ end: 56, duration: 3000, delay: 200 }); + const longestProjectCount = useCountUp({ end: 81, duration: 2000, delay: 400 }); + const maxPersonnelCount = useCountUp({ end: 120, duration: 2800, delay: 600 }); + + // Back to top functionality + React.useEffect(() => { + const handleScroll = () => { + setShowBackToTop(window.scrollY > 400); + }; + window.addEventListener('scroll', handleScroll); + return () => window.removeEventListener('scroll', handleScroll); + }, []); + + const scrollToTop = () => { + window.scrollTo({ top: 0, behavior: 'smooth' }); + }; + const projects = [ { client: 'Dixie Iron Works', location: 'Alice, Texas', - project: 'Structural Steel Framework', - craftOnSite: 'Welding & Assembly', + project: 'Hydraulic pumps structure frames fabrication', + craftOnSite: '12 Fitters, Welders and Supervisor', duration: '2 months', personnel: 12 }, @@ -17,56 +47,529 @@ const ClientsProjects = () => { client: 'Signal International', location: 'Orange, Sabine Pass, Port Arthur Texas and offshore work at the Gulf of Mexico', project: 'Diamond Offshore Oil Rigs and Government Ships Fabrication', - craftOnSite: 'Pipe & Structure Fitters, Lay out Fitters, Pipe & Structure Welders, Tig Welders, Supervisors', + craftOnSite: '110 Pipe & Structure Fitters, Lay out Fitters, Pipe & Structure Welders, Tig Welders, Supervisors', duration: '31 months', personnel: 110 }, + { + client: 'Esco Marine Inc.', + location: 'Brownsville, Texas', + project: 'Offshore Oil Rig Repair', + craftOnSite: '28 Pipe & Structure Welders, Pipe & Structure Fitters, Supervisor, Fitter Helpers', + duration: '6 months', + personnel: 28 + }, + { + client: 'STI Group', + location: 'Tulsa, Oklahoma', + project: 'H&P Flex Gas Land Rigs new Fabrication', + craftOnSite: '8 Flux Cored Welders', + duration: '4 weeks', + personnel: 8 + }, { client: 'Keppel Amfels', location: 'Brownsville, Texas', project: 'Transocean & Diamond Offshore Semi-Submergible and Jack up Oil Rigs repairs and new builds', - craftOnSite: 'Welders and Fitters', + craftOnSite: '46 Welders and Fitters', duration: '18 months', personnel: 46 }, + { + client: 'Load Craft Industries', + location: 'Brad & Early Texas', + project: 'Nabors Drilling Rigs Fabrication, Mud Tanks and other drilling components', + craftOnSite: '84 Welders, Fitters, Operators', + duration: '15 months', + personnel: 84 + }, + { + client: 'R.M Walsdorf Inc.', + location: 'Port of Brownsville TX', + project: 'Boat ladders', + craftOnSite: '4 Welders and Fitters', + duration: '2 months', + personnel: 4 + }, + { + client: 'Shoreline Foundation, Inc.', + location: 'Kings Bay Naval Base, GA.', + project: 'Water front, North Land Water Interface P636', + craftOnSite: '12 Welders, Fitters & Supervisor', + duration: '3 months', + personnel: 12 + }, + { + client: 'STI Group', + location: 'Bridge City, Texas', + project: 'H&P Gas Land Rigs', + craftOnSite: '28 Welders & Fitters', + duration: '2 years', + personnel: 28 + }, + { + client: 'INTERLUBE CORPORATION, INC', + location: 'Port of Brownsville TX', + project: 'Above Ground Storage Tanks Maintenance', + craftOnSite: '4 Maintenance Group', + duration: '1 year', + personnel: 4 + }, + { + client: 'STI Group', + location: 'Vidor, Texas', + project: 'H&P Gas Land Rigs', + craftOnSite: '44 Welders and Fitters', + duration: '28 months', + personnel: 44 + }, + { + client: 'Triton Marine', + location: 'Port of Brownsville, TX', + project: 'Construction of new dock #6', + craftOnSite: '6 Fitter/Welder', + duration: '18 months', + personnel: 6 + }, + { + client: 'Nehemiah\'s Vision', + location: 'Port Arthur, Texas', + project: 'Residential Homes Repair', + craftOnSite: '14 Residential Carpenters', + duration: '6 months', + personnel: 14 + }, + { + client: 'Keppel Amfels', + location: 'Brownsville, Texas', + project: 'Offshore Drilling Rig', + craftOnSite: '30 Welders, Fitters, Supervisors', + duration: '16 months to date', + personnel: 30 + }, + { + client: 'Weeks Marine', + location: 'Cameron, LA', + project: 'Sea Wall LNG Terminal', + craftOnSite: 'Welders and Fitters', + duration: '8 months', + personnel: 8 + }, + { + client: 'STI Group', + location: 'Tulsa, Oklahoma', + project: 'Flex Drilling Rigs Fabrication', + craftOnSite: 'Welders and Fitters', + duration: '2 months', + personnel: 12 + }, + { + client: 'Ready Flo', + location: 'Corpus Christi, TX', + project: 'Skids Gas Separators', + craftOnSite: 'Welders and Fitters', + duration: '16 months to date', + personnel: 12 + }, { client: 'Space X Brownsville', location: 'Brownsville, TX', project: 'New erection construction', - craftOnSite: 'Welders and Supervisors', + craftOnSite: '24 welders and 2 supervisors', duration: '6 months', personnel: 26 }, + { + client: 'South East Texas Industries', + location: 'Beaumont, Bridge City, Vidor, Orange Texas', + project: 'H&P Flex Gas Land Rigs new fabrication', + craftOnSite: '120 Pipe & Structure Fitters, Pipe & Structure Welders, Tig Welders, 6/GR Welders, S.S Welders, Supervisors, Fitter Helpers', + duration: '42 months', + personnel: 120 + }, { client: 'Gulf Marine Fabrication', location: 'Aransas Pass and Ingleside Texas', project: 'Oil Rig Tower and Decks Fabrication', - craftOnSite: 'Tig Welders, 6/GR Welders, Pipe & Structure Fitters, Supervisors, Tack Welders', + craftOnSite: '36 Tig Welders, 6/GR Welders, Pipe & Structure Fitters, Supervisors, Tack Welders', duration: '32 months', personnel: 36 }, + { + client: 'Veolia Environmental Services', + location: 'Port Arthur, Texas', + project: 'Veolia Environmental Processing Plant Turnaround', + craftOnSite: '38 Pipe & Structure Fitters, Pipe & Structure Welders, Boiler Makers', + duration: '36 Days', + personnel: 38 + }, + { + client: 'Environmental Evolution Services', + location: 'Robstown, Texas', + project: 'Acid Frac Tank Containers', + craftOnSite: '4 Welders and Fitters', + duration: '24 months', + personnel: 4 + }, { client: 'Eastern Shipbuilding', location: 'Panama City, Florida', project: 'Fabrication of new Coast Guard Ships, Cargo Boats, Crew Boats', - craftOnSite: 'Welders, Fitters, Electricians', + craftOnSite: '35 Welders, Fitters, Electricians', duration: '5 years', personnel: 35 + }, + { + client: 'STIS', + location: 'Livingston, Texas', + project: 'H&P Gas Land Rigs', + craftOnSite: '60 Welders, Fitters, Supervisors', + duration: '19 months', + personnel: 60 + }, + { + client: 'Shoreline Foundation Inc.', + location: 'Port of Brownsville TX', + project: 'Boat Landing Tie Downs', + craftOnSite: '12 Welders and Fitters', + duration: '1 month', + personnel: 12 + }, + { + client: 'STI GROUP', + location: 'Orange, Texas', + project: 'Ammonia and Gas Stainless Steel Skid Plants', + craftOnSite: '6 Welders, Fitters, Assemblers', + duration: '2 months', + personnel: 6 + }, + { + client: 'MOORE IRON AND STEEL INC.', + location: 'Hondo, Texas', + project: 'Martin Asphalt Terminal, Above Ground Storage Tank Fabrication', + craftOnSite: '17 Pipe Welders, Pipe Fitters and Supervisors', + duration: '7 months', + personnel: 17 + }, + { + client: 'SOLARIS OIL FIELD INFRASTRUCTURE INC.', + location: 'Early, Texas', + project: 'Sand Silos Fabrication for the Oil Field Industries', + craftOnSite: '16 Welders, Fitters Combination', + duration: '26 months', + personnel: 16 + }, + { + client: 'Derrick Construction', + location: 'Port of Brownsville, TX', + project: 'Construction of new dock #3', + craftOnSite: '10 Fitter/Welder', + duration: '4 months', + personnel: 10 + }, + { + client: 'Russell Marine', + location: 'Port Aransas, Texas', + project: '48" Pile Fitting and Welding', + craftOnSite: '8 Pipe Welders and 4 Pipe Fitters', + duration: '4 months', + personnel: 12 + }, + { + client: 'City of Brownsville, TX', + location: 'Brownsville, Texas', + project: 'Structural Components Fire Dept.', + craftOnSite: 'Welders and Fitters', + duration: '1 month', + personnel: 6 + }, + { + client: 'Weeks Marine', + location: 'Aransas Pass, TX', + project: 'Exxon Terminal Dock Piling Fabrication', + craftOnSite: 'Welders and Fitters', + duration: '3 months', + personnel: 8 + }, + { + client: 'Orion Construction', + location: 'Ingleside, TX', + project: 'Dock Piling LNG Terminal', + craftOnSite: 'Welders and Fitters', + duration: '6 months', + personnel: 10 + }, + { + client: 'Orion Construction', + location: 'Ingleside, TX', + project: 'Dock Piling LNG Terminal', + craftOnSite: 'Welders and Fitters', + duration: '4 months', + personnel: 10 + }, + { + client: 'Stewart Construction', + location: 'Harvey, LA', + project: 'Dock Piling and components', + craftOnSite: '6 Welders and 2 Fitters', + duration: '6 months to date', + personnel: 8 + }, + { + client: 'Beacon Maritime', + location: 'Orange, Sabine Pass, and Port Arthur Texas', + project: 'Songa, Aban Chiles, Neptune and Diamond Offshore Oil Rig Fabrication', + craftOnSite: '80 Pipe & Structure Fitters, Pipe & Structure Welders, Supervisors, Fitter Helpers', + duration: '12 months', + personnel: 80 + }, + { + client: 'Jet Specialty, Inc', + location: 'Corpus Christi, Texas', + project: 'Gas Pressure Vessels Fabrication', + craftOnSite: '8 Mig Pipe Welders, Pipe Fitters and Supervisor', + duration: '81 months', + personnel: 8 + }, + { + client: 'Long Fence Company', + location: 'Brownsville, Texas', + project: 'Rio Grande Valley US/Mexico Border Wall. Sectors 017-018-and 019', + craftOnSite: '86 St Welders & Fitters, Fitter Helpers, Supervisors, Tack Welders, Operators, Riggers, Safety Officers', + duration: '12 months', + personnel: 86 + }, + { + client: 'STI Oil Field Services', + location: 'Vidor, Gonzalez, Kennedy, York Town, McAllen Texas. North Dakota, Denver Colorado.', + project: 'H&P Flex Gas Land Rigs new fabrication', + craftOnSite: '26 Flux Cored Welders and Fitters', + duration: '26 months', + personnel: 26 + }, + { + client: 'Brownsville Navigation District', + location: 'Port of Brownsville TX', + project: 'Crane Boom repair and new construction', + craftOnSite: '4 Welders and Fitters', + duration: '6 years to Date', + personnel: 4 + }, + { + client: 'Solaris Oil Field Industries', + location: 'Early, Texas', + project: 'Mud Tanks and other drilling components', + craftOnSite: '16 Welders, Fitters, Operators', + duration: '11 months', + personnel: 16 + }, + { + client: 'R.P. Construction', + location: 'Brownsville TX P.U.B Location', + project: 'Welding Stainless Steel Pipe Welding System', + craftOnSite: '4 Tig Welders and Fitters', + duration: '5 months', + personnel: 4 + }, + { + client: 'READY FLO SYSTEMS', + location: 'Corpus Christi, Texas', + project: 'Oil Field Gas Separators Fabrication', + craftOnSite: '3 Pipe Welder Combos', + duration: '4 months', + personnel: 3 + }, + { + client: 'RIO GRANDE TOOLS, INC', + location: 'Brownsville, Texas', + project: 'Valley Baptist Hospital pipe line modifications', + craftOnSite: '4 Welder/Fitters', + duration: '6 months', + personnel: 4 + }, + { + client: 'STI Group', + location: 'Beaumont, Texas', + project: 'H&P Gas Land Rigs', + craftOnSite: '8 welders and fitters', + duration: '6 months', + personnel: 8 + }, + { + client: 'STI Group', + location: 'Nederland, Texas', + project: 'H&P Gas Land Rigs', + craftOnSite: '10 Fitters', + duration: '27 months', + personnel: 10 + }, + { + client: 'STI Group Florida', + location: 'Cape Canaveral, Florida', + project: 'Space X fabrication of new towers, piping & structural', + craftOnSite: '10 Fitters & Welders', + duration: '3 months', + personnel: 10 + }, + { + client: 'ATS Construction', + location: 'Corpus Christi, TX', + project: 'Pipe Rack Fabrication', + craftOnSite: '7 Welders and 2 St/Fitters', + duration: '3 months', + personnel: 9 + }, + { + client: 'STI Group', + location: 'Vidor and Bridge City, TX', + project: 'Flex Drilling Rigs Fabrication', + craftOnSite: 'Welders and Fitters', + duration: '14 months', + personnel: 15 + }, + { + client: 'Orion Construction', + location: 'Donaldsonville, LA', + project: 'Dock Piling LNG Terminal', + craftOnSite: 'Welders and Fitters', + duration: '4 months', + personnel: 10 + }, + { + client: 'ATS Construction', + location: 'Corpus Christi, TX', + project: 'Tank Vessels and Pipe Fabrication', + craftOnSite: 'Welders and Fitters', + duration: '8 months', + personnel: 12 + }, + { + client: 'Orion Marine', + location: 'New Orleans, LA', + project: 'Refurbishment of existing dock', + craftOnSite: '8 welders', + duration: '6 months to date', + personnel: 8 } ]; + // Industry categories for filtering + const industries = [ + 'All', + 'Offshore Oil Rigs', + 'Marine Construction', + 'Industrial Fabrication', + 'Aerospace Projects', + 'Infrastructure', + 'Energy & Utilities', + 'Government Projects' + ]; + + // Enhanced projects with industry categorization + const enhancedProjects = projects.map(project => { + let industry = 'Industrial Fabrication'; // default + + if (project.project.toLowerCase().includes('oil rig') || + project.project.toLowerCase().includes('offshore') || + project.client.toLowerCase().includes('signal') || + project.client.toLowerCase().includes('keppel') || + project.client.toLowerCase().includes('beacon')) { + industry = 'Offshore Oil Rigs'; + } else if (project.project.toLowerCase().includes('ship') || + project.project.toLowerCase().includes('marine') || + project.project.toLowerCase().includes('dock') || + project.project.toLowerCase().includes('boat') || + project.client.toLowerCase().includes('eastern shipbuilding') || + project.client.toLowerCase().includes('triton marine')) { + industry = 'Marine Construction'; + } else if (project.client.toLowerCase().includes('space') || + project.project.toLowerCase().includes('space')) { + industry = 'Aerospace Projects'; + } else if (project.project.toLowerCase().includes('border wall') || + project.client.toLowerCase().includes('government') || + project.location.toLowerCase().includes('naval base')) { + industry = 'Government Projects'; + } else if (project.project.toLowerCase().includes('terminal') || + project.project.toLowerCase().includes('lng') || + project.project.toLowerCase().includes('storage tank')) { + industry = 'Energy & Utilities'; + } else if (project.project.toLowerCase().includes('bridge') || + project.client.toLowerCase().includes('navigation') || + project.project.toLowerCase().includes('crane')) { + industry = 'Infrastructure'; + } + + return { ...project, industry }; + }); + + // Get unique locations for filter + const locations = ['All', ...new Set(enhancedProjects.map(p => { + const state = p.location.split(',').pop()?.trim() || p.location; + return state.replace(/\b(Texas|TX|Florida|LA|Louisiana|Oklahoma|Colorado|GA|Georgia)\b/g, (match) => { + const stateMap = { + 'TX': 'Texas', + 'LA': 'Louisiana', + 'GA': 'Georgia' + }; + return stateMap[match] || match; + }); + }))]; + + // Filtered projects based on search and filters + const filteredProjects = useMemo(() => { + return enhancedProjects.filter(project => { + const matchesSearch = project.client.toLowerCase().includes(searchTerm.toLowerCase()) || + project.project.toLowerCase().includes(searchTerm.toLowerCase()) || + project.location.toLowerCase().includes(searchTerm.toLowerCase()); + + const matchesIndustry = selectedIndustry === 'All' || project.industry === selectedIndustry; + + const projectLocation = project.location.split(',').pop()?.trim() || project.location; + const normalizedLocation = projectLocation.replace(/\b(TX|LA|GA)\b/g, (match) => { + const stateMap = { 'TX': 'Texas', 'LA': 'Louisiana', 'GA': 'Georgia' }; + return stateMap[match] || match; + }); + const matchesLocation = selectedLocation === 'All' || normalizedLocation.includes(selectedLocation); + + return matchesSearch && matchesIndustry && matchesLocation; + }); + }, [searchTerm, selectedIndustry, selectedLocation]); + + // Handle loading state separately + React.useEffect(() => { + setIsLoading(true); + const timer = setTimeout(() => setIsLoading(false), 300); + return () => clearTimeout(timer); + }, [searchTerm, selectedIndustry, selectedLocation]); + return (
+ + {/* Breadcrumbs */} + +
{/* Hero Section with Image */}
{/* Background Image */}
-
{/* Geometric Elements */} @@ -94,20 +597,43 @@ const ClientsProjects = () => {
-
-
50+
+
+
+ {clientsCount.count} +

Major Clients Served

-
-
100+
+
+
+ {projectsCount.count} +

Projects Completed

-
-
42
+
+
+ {longestProjectCount.count} +

Months Longest Project

-
-
120
+
+
+ {maxPersonnelCount.count} +

Max Personnel on Site

@@ -115,60 +641,150 @@ const ClientsProjects = () => {
+ {/* Search and Filter Section */} +
+
+
+
+ {/* Search */} +
+
+ + setSearchTerm(e.target.value)} + className="w-full pl-10 pr-4 py-3 bg-slate-700 border border-slate-600 rounded-lg text-white placeholder-slate-400 focus:outline-none focus:border-blue-500 focus:ring-1 focus:ring-blue-500 transition-colors" + /> +
+
+ + {/* Industry Filter */} +
+ +
+ + {/* Location Filter */} +
+ +
+
+ + {/* Results Count */} +
+ + Showing {filteredProjects.length} of {enhancedProjects.length} projects + +
+
+
+
+ {/* Projects Grid */}
-

Featured Projects

-

A selection of our most significant and successful projects

+

Project Portfolio

+

Complete portfolio of our successful projects and client partnerships

-
- {projects.map((project, index) => ( -
-
- {/* Header */} + {/* Loading State */} + {isLoading ? ( +
+ {[...Array(6)].map((_, index) => ( +
+
-
-

{project.client}

-
- - {project.location} +
+
+
+
-
- {project.personnel} Personnel +
+
+
+
+
+
+
+ ))} +
+ ) : ( +
+ {filteredProjects.length === 0 ? ( +
+
No projects found
+

Try adjusting your search terms or filters

+
+ ) : ( + filteredProjects.map((project, index) => ( +
+
+ {/* Industry Badge */} +
+
+
+ {project.industry} +
+

{project.client}

+
+ + {project.location} +
+
+
+ {project.personnel}
{/* Project Details */} -
+
-

Project:

-

{project.project}

+

Project:

+

{project.project}

-

Craft on Site:

-

{project.craftOnSite}

+

Craft on Site:

+

{project.craftOnSite}

-
+
- Duration: {project.duration} + {project.duration}
- {project.personnel} people + {project.personnel} +
+
+ )) + )}
-
- ))} -
+ )}
@@ -203,6 +819,17 @@ const ClientsProjects = () => {
+ + {/* Back to Top Button */} + {showBackToTop && ( + + )}
); }; diff --git a/src/pages/Contact.tsx b/src/pages/Contact.tsx index ea11a6f..46cb891 100644 --- a/src/pages/Contact.tsx +++ b/src/pages/Contact.tsx @@ -1,22 +1,41 @@ import React from 'react'; import Header from '@/components/Header'; import Footer from '@/components/Footer'; -import { Phone, Mail, Printer, MapPin, Clock, User } from 'lucide-react'; +import { Phone, Mail, Printer, MapPin, Clock, User, ArrowRight, FileText, ChevronRight } from 'lucide-react'; import { Button } from '@/components/ui/button'; +import { useScrollAnimation } from '@/hooks/useScrollAnimation'; const Contact = () => { + useScrollAnimation(); + return (
+ + {/* Breadcrumbs */} + +
{/* Hero Section with Image */}
{/* Background Image */}
-
{/* Geometric Elements */} @@ -218,49 +237,349 @@ const Contact = () => {
- {/* Contact Form Section */} -
+ {/* Interactive Map Section */} +
-
+
-

Get Professional Support

-

- You may contact us by filling in this form any time you need professional support or have any questions. -

-

We will respond within 48 hours for most inquiries.

+

Find Us on the Map

+

Our primary location in Brownsville, Texas

-
-
-
- +
+ {/* Map */} +
+ +
+ + {/* Location Details */} +
+
+
+
+ +
+
+

Primary Location

+

South Texas Office & Fabrication Shop

+
+
+ +
+
+

7748 Padre Island Hwy.

+

Brownsville, TX 78521

+

(Next to Mariscos de la Rosa Restaurant)

+
+ +
+
+ + Office: + 956-831-5164 +
+
+ + Fax: + 956-831-5265 +
+ +
+ + +
-

Contact Form

-

Our contact form will be available soon. In the meantime, please contact us directly using the information above.

- -
- - + +
+

Business Hours

+
+
+ Monday - Friday: + 8:00 AM - 5:00 PM +
+
+ Saturday: + By Appointment +
+
+ Sunday: + Closed +
+
+
+
+
- {/* Response Time */} -
+ {/* Contact Forms Section */} +
+
+
+
+

Get in Touch

+

+ Contact us for professional support or request a project quote +

+
+ +
+ {/* Contact Form */} +
+
+ +

General Contact

+
+ +
+
+
+ + +
+
+ + +
+
+ +
+ + +
+ +
+ + +
+ +
+ + +
+ +
+ + +
+ + +
+
+ + {/* Quote Request Form */} +
+
+ +

Get a Quote

+
+ +
+
+
+ + +
+
+ + +
+
+ +
+ + +
+ +
+ + +
+ +
+ + +
+ +
+ + +
+ + +
+
+
+ + {/* Response Time Info */} +
- Quick Response + Quick Response Guarantee

- We typically respond to all inquiries within 48 hours during business hours. - For urgent matters, please call us directly. + We respond to all inquiries within 48 hours during business hours. + Quote requests typically receive responses within 24 hours.

diff --git a/src/pages/Index.tsx b/src/pages/Index.tsx index 49c8993..95f5c1e 100644 --- a/src/pages/Index.tsx +++ b/src/pages/Index.tsx @@ -4,8 +4,11 @@ import Footer from '@/components/Footer'; import Hero from '@/components/Hero'; import CompanyBlurb from '@/components/CompanyBlurb'; import LogoSection from '@/components/LogoSection'; +import { useScrollAnimation } from '@/hooks/useScrollAnimation'; const Index = () => { + useScrollAnimation(); + return (
diff --git a/src/pages/Legal.tsx b/src/pages/Legal.tsx new file mode 100644 index 0000000..cf7927b --- /dev/null +++ b/src/pages/Legal.tsx @@ -0,0 +1,90 @@ +import React from 'react'; +import Header from '@/components/Header'; +import Footer from '@/components/Footer'; +import { Scale, FileText, Shield } from 'lucide-react'; + +const Legal = () => { + return ( +
+
+
+ {/* Hero Section */} +
+
+
+
+
+ +
+
+

+ Legal + Center +

+

+ Legal information and compliance resources for IIT Welding services. +

+
+
+
+ + {/* Legal Content */} +
+
+
+
+
+ +

Terms of Service

+

Our terms and conditions for service agreements

+ + View Terms → + +
+ +
+ +

Privacy Policy

+

How we protect and handle your personal information

+ + View Policy → + +
+ +
+ +

Compliance

+

Industry certifications and regulatory compliance

+ + Learn More → + +
+
+ +
+

Legal Notice

+
+

+ IIT Welding operates in compliance with all applicable federal, state, and local regulations + governing welding and fabrication services. +

+

+ Our services are provided under the terms and conditions outlined in our service agreements. + All work is performed by certified professionals in accordance with industry standards. +

+

+ For specific legal inquiries or contract negotiations, please contact our legal department + through our main office. +

+
+
+
+
+
+
+
+
+ ); +}; + +export default Legal; diff --git a/src/pages/Locations.tsx b/src/pages/Locations.tsx index 45c6394..01684c7 100644 --- a/src/pages/Locations.tsx +++ b/src/pages/Locations.tsx @@ -1,7 +1,7 @@ import React from 'react'; import Header from '@/components/Header'; import Footer from '@/components/Footer'; -import { MapPin, Phone, Mail, Printer, Building, User } from 'lucide-react'; +import { MapPin, Phone, Mail, Printer, Building, User, ChevronRight } from 'lucide-react'; const Locations = () => { const locations = [ @@ -36,15 +36,31 @@ const Locations = () => { return (
+ + {/* Breadcrumbs */} + +
{/* Hero Section with Image */}
{/* Background Image */}
-
{/* Geometric Elements */} @@ -70,61 +86,138 @@ const Locations = () => { {/* Locations Grid */}
-
-
- {locations.map((location, index) => ( -
-
- {/* Header */} -
-
- +
+ {/* South Texas Office */} +
+
+
+ {/* Header */} +
+
+ +
+
+

South Texas Office & Fabrication Shop

+
+ Primary Location
+
+
+ + {/* Address */} +
+
+
-

{location.name}

-
- {location.type} Location -
+

7748 Padre Island Hwy

+

Brownsville, Texas 78521

+

(Next to Mariscos de la Rosa Restaurant)

+
+
+
+ + {/* Contact Info */} +
+
+ +
- {/* Address */} -
-
- -
-

{location.address}

-

{location.city}

- {location.note && ( -

({location.note})

- )} -
-
-
- - {/* Contact Info */} -
-
- - -
- -
- -
- Fax: - {location.fax} -
+
+ +
+ Fax: + 956-831-5265
- ))} +
+ + {/* South Texas Map */} +
+ +
+
+ + {/* Corporate Office */} +
+
+
+ {/* Header */} +
+
+ +
+
+

Corporate Office

+
+ Corporate Location +
+
+
+ + {/* Address */} +
+
+ +
+

P.O. Box 23036

+

Corpus Christi, Texas 78403

+
+
+
+ + {/* Contact Info */} +
+
+ +
+ Phone: + + 361-883-8999 + +
+
+ +
+ +
+ Fax: + 361-884-1984 +
+
+
+
+
+ + {/* Corporate Office Map */} +
+ +
diff --git a/src/pages/Privacy.tsx b/src/pages/Privacy.tsx new file mode 100644 index 0000000..5187914 --- /dev/null +++ b/src/pages/Privacy.tsx @@ -0,0 +1,104 @@ +import React from 'react'; +import Header from '@/components/Header'; +import Footer from '@/components/Footer'; +import { Shield, Lock, Eye, Database } from 'lucide-react'; + +const Privacy = () => { + return ( +
+
+
+ {/* Hero Section */} +
+
+
+
+
+ +
+
+

+ Privacy + Policy +

+

+ How we collect, use, and protect your personal information. +

+
+
+
+ + {/* Privacy Content */} +
+
+
+
+
+ +

Data Protection

+

+ We use industry-standard encryption and security measures to protect your personal information. +

+
+ +
+ +

Transparency

+

+ We are transparent about what data we collect and how we use it for our services. +

+
+
+ +
+
+

Information We Collect

+
+

+ Contact Information: When you contact us for services, we collect your name, + email address, phone number, and company information. +

+

+ Project Details: Information about your welding and fabrication requirements + to provide accurate quotes and services. +

+

+ Website Usage: We may collect anonymous usage data to improve our website + and services. +

+
+
+ +
+

How We Use Your Information

+
+

+ • Provide welding and fabrication services
+ • Communicate about projects and quotes
+ • Improve our services and customer experience
+ • Comply with legal and regulatory requirements +

+
+
+ +
+

Contact Us

+

+ If you have questions about this Privacy Policy, please contact us at: +

+
+

Email: iit.avasquez@sbcglobal.net

+

Phone: 956-831-5164

+
+
+
+
+
+
+
+
+
+ ); +}; + +export default Privacy; diff --git a/src/pages/Services.tsx b/src/pages/Services.tsx index c778396..621cdf1 100644 --- a/src/pages/Services.tsx +++ b/src/pages/Services.tsx @@ -1,7 +1,7 @@ import React from 'react'; import Header from '@/components/Header'; import Footer from '@/components/Footer'; -import { Wrench, Settings, Shield, Award, Users, CheckCircle } from 'lucide-react'; +import { Wrench, Settings, Shield, Award, Users, CheckCircle, ChevronRight } from 'lucide-react'; const Services = () => { const services = [ @@ -28,15 +28,31 @@ const Services = () => { return (
+ + {/* Breadcrumbs */} + +
{/* Hero Section with Image */}
{/* Background Image */}
-
{/* Geometric Elements */} diff --git a/src/pages/Terms.tsx b/src/pages/Terms.tsx new file mode 100644 index 0000000..5756991 --- /dev/null +++ b/src/pages/Terms.tsx @@ -0,0 +1,119 @@ +import React from 'react'; +import Header from '@/components/Header'; +import Footer from '@/components/Footer'; +import { FileText, CheckCircle, AlertTriangle, Clock } from 'lucide-react'; + +const Terms = () => { + return ( +
+
+
+ {/* Hero Section */} +
+
+
+
+
+ +
+
+

+ Terms of + Service +

+

+ Terms and conditions for IIT Welding services and agreements. +

+
+
+
+ + {/* Terms Content */} +
+
+
+
+
+ +

Service Agreement

+

+ All welding services are provided under formal service agreements with clear terms. +

+
+ +
+ +

Project Timeline

+

+ Timelines are established based on project scope and agreed upon before work begins. +

+
+
+ +
+
+

Service Terms

+
+

+ 1. Service Provision: IIT Welding provides professional welding and + fabrication services in accordance with industry standards and applicable regulations. +

+

+ 2. Quality Assurance: All work is performed by certified welders and + subject to quality control inspections. +

+

+ 3. Safety Compliance: All operations comply with OSHA and industry + safety standards. +

+

+ 4. Project Specifications: Work is performed according to agreed-upon + specifications and industry standards. +

+
+
+ +
+

Payment Terms

+
+

+ • Payment terms are established in individual service agreements
+ • Invoices are due within agreed-upon timeframes
+ • Progress payments may be required for large projects
+ • Final payment is due upon project completion and acceptance +

+
+
+ +
+

Liability and Insurance

+
+

+ IIT Welding maintains comprehensive general liability and professional liability insurance. + Specific liability terms are outlined in individual service agreements. +

+
+
+ +
+

Contact for Agreements

+

+ For specific terms and service agreements, please contact us: +

+
+

Arturo Vasquez, Operations Manager

+

Email: iit.avasquez@sbcglobal.net

+

Phone: 956-831-5164

+
+
+
+
+
+
+
+
+ ); +}; + +export default Terms;