diff --git a/app/contact/page.tsx b/app/contact/page.tsx new file mode 100644 index 0000000..3b5e97d --- /dev/null +++ b/app/contact/page.tsx @@ -0,0 +1,641 @@ +"use client"; + +import { motion } from "framer-motion"; +import { useState } from "react"; +import Navigation from "../components/Navigation"; +import Footer from "../components/Footer"; +import AnimatedButton from "../components/AnimatedButton"; +import FadeIn, { StaggerContainer, StaggerItem } from "../components/FadeIn"; +import { + PhoneIcon, + MailIcon, + MapPinIcon, + ArrowRightIcon, + CheckIcon, +} from "../components/Icons"; + +const contactInfo = [ + { + icon: PhoneIcon, + label: "Phone", + value: "303-371-2810", + href: "tel:303-371-2810", + description: "Mon-Fri, 8am-5pm MST", + }, + { + icon: PhoneIcon, + label: "Fax", + value: "303-371-2807", + href: null, + description: "24/7 available", + }, + { + icon: MailIcon, + label: "Email", + value: "info@tcm-sales.com", + href: "mailto:info@tcm-sales.com", + description: "We'll respond within 24 hours", + }, +]; + +const territories = [ + "Colorado", + "Washington", + "Oregon", + "Idaho", + "Utah", + "Wyoming", + "Montana", + "New Mexico", + "Nebraska", + "Arizona", +]; + +export default function ContactPage() { + const [formState, setFormState] = useState({ + name: "", + email: "", + company: "", + phone: "", + message: "", + }); + const [isSubmitting, setIsSubmitting] = useState(false); + const [isSubmitted, setIsSubmitted] = useState(false); + + const handleSubmit = async (e: React.FormEvent) => { + e.preventDefault(); + setIsSubmitting(true); + + // Simulate form submission + await new Promise((resolve) => setTimeout(resolve, 1500)); + + setIsSubmitting(false); + setIsSubmitted(true); + }; + + const handleChange = ( + e: React.ChangeEvent + ) => { + setFormState((prev) => ({ + ...prev, + [e.target.name]: e.target.value, + })); + }; + + return ( +
+ + + {/* Hero Section */} +
+ {/* Animated background */} +
+ + +
+ +
+ + + + Get In Touch + + + + + Let's{" "} + + Talk + + + + + We would love to help you with all of your Foodservice and + Janitorial needs. Reach out and let's start a conversation. + +
+
+ + {/* Contact Info Cards */} +
+
+ + {contactInfo.map((info) => ( + + + {info.href ? ( + +
+ + + +
+

+ {info.label} +

+

+ {info.value} +

+

+ {info.description} +

+
+
+ + ) : ( +
+ + + +
+

+ {info.label} +

+

+ {info.value} +

+

+ {info.description} +

+
+
+ )} + + + ))} + +
+
+ + {/* Contact Form & Location */} +
+
+
+ {/* Contact Form */} + +
+

+ Send Us a Message +

+

+ Fill out the form below and we'll get back to you shortly. +

+ + {isSubmitted ? ( + + + + +

+ Message Sent! +

+

+ Thank you for reaching out. We'll be in touch soon. +

+ { + setIsSubmitted(false); + setFormState({ + name: "", + email: "", + company: "", + phone: "", + message: "", + }); + }} + variant="outline" + > + Send Another Message + + + ) : ( +
+
+
+ + +
+
+ + +
+
+ +
+
+ + +
+
+ + +
+
+ +
+ + +
+ + + {isSubmitting ? ( + <> + + Sending... + + ) : ( + <> + Send Message + + + )} + + +

+ By submitting this form, you agree to our privacy policy. +

+
+ )} +
+ + + {/* Location Info */} + +
+ {/* Address Card */} + +
+ + + +
+

+ Head Office +

+

+ TCM Sales & Marketing +

+
+
+
+ 12424 East Weaver Place +
+ Centennial, Colorado 80111 +
+ United States +
+ + Get Directions + + + + + {/* Map Placeholder */} + +
+
+ +
+ +
+ +

+ Denver, Colorado +

+

+ Rocky Mountain Region HQ +

+
+
+ {/* Decorative grid */} +
+ + + {/* Territory Coverage */} + +

Service Territory

+

+ We proudly serve the Rocky Mountain and Northwest regions: +

+
+ {territories.map((territory, index) => ( + + {territory} + + ))} +
+ +
+ +
+
+
+ + {/* FAQ Section */} +
+
+
+ + + Common Questions + + + +

+ Frequently Asked{" "} + Questions +

+ +
+ +
+ {[ + { + q: "What areas do you service?", + a: "We serve the Rocky Mountain and Northwest regions including Colorado, Washington, Oregon, Idaho, Utah, Wyoming, Montana, New Mexico, Nebraska, and Arizona.", + }, + { + q: "How quickly can I expect a response?", + a: "We typically respond to all inquiries within 24 business hours. For urgent matters, please call us directly.", + }, + { + q: "Do you offer product samples?", + a: "Yes! We provide comprehensive product samples to help you evaluate our offerings. Contact us to request samples.", + }, + { + q: "Can you help with sustainable product alternatives?", + a: "Absolutely. We offer a full range of eco-friendly, compostable, and recyclable products to meet your sustainability goals.", + }, + ].map((faq, index) => ( + + +

+ {faq.q} +

+

+ {faq.a} +

+ + + ))} +
+
+
+ + {/* CTA Section */} +
+ {/* Background pattern */} +
+ + + + + + +
+ +
+ +

+ Prefer to Talk? +

+ + +

+ Give us a call and speak directly with our team. +

+ + + + + 303-371-2810 + + +
+
+ +
+
+ ); +} diff --git a/app/culture/page.tsx b/app/culture/page.tsx new file mode 100644 index 0000000..b9c6f41 --- /dev/null +++ b/app/culture/page.tsx @@ -0,0 +1,582 @@ +"use client"; + +import { motion } from "framer-motion"; +import Navigation from "../components/Navigation"; +import Footer from "../components/Footer"; +import AnimatedButton from "../components/AnimatedButton"; +import FadeIn, { StaggerContainer, StaggerItem } from "../components/FadeIn"; +import { + ArrowRightIcon, + HeartIcon, + UsersIcon, + StarIcon, + TargetIcon, +} from "../components/Icons"; + +const coreValues = [ + { + icon: HeartIcon, + title: "Family", + description: + "To serve our employees and their families by establishing a work environment and company policies that build character, strengthen individuals, and nurture families.", + color: "from-rose-500 to-pink-500", + bgColor: "bg-rose-50 dark:bg-rose-950/20", + }, + { + icon: StarIcon, + title: "Character", + description: + "Every employee at TCM Sales & Marketing is to conduct themselves with an attitude of selflessness, servanthood, and confident humility.", + color: "from-amber-500 to-orange-500", + bgColor: "bg-amber-50 dark:bg-amber-950/20", + }, + { + icon: UsersIcon, + title: "Giving Back", + description: + "We encourage a spirit of giving back to those in need. We believe that we have an obligation to serve others because we have been given so much.", + color: "from-emerald-500 to-teal-500", + bgColor: "bg-emerald-50 dark:bg-emerald-950/20", + }, + { + icon: TargetIcon, + title: "Encouragement", + description: + "We want all employees to encourage one another at all times and help each other reach their full potential.", + color: "from-blue-500 to-indigo-500", + bgColor: "bg-blue-50 dark:bg-blue-950/20", + }, +]; + +const principles = [ + "Faithful stewardship", + "Professional integrity", + "Ethical representation", + "Symbiotic growth", + "Positive impact", + "Service excellence", +]; + +export default function CulturePage() { + return ( +
+ + + {/* Hero Section */} +
+ {/* Animated background */} +
+ + +
+ + {/* Decorative elements */} +
+ {[...Array(4)].map((_, i) => ( + + ))} +
+ +
+ + + + Who We Are + + + + + Our{" "} + + Culture + + + + + Built on faith, driven by purpose, and committed to making a + positive impact on everyone we serve. + + + + } + > + Join Our Team + + +
+ + {/* Scroll indicator */} + + + + + +
+ + {/* Mission & Purpose Section */} +
+
+
+ {/* Mission */} + + + + + +

+ Our Mission +

+

+ To glorify God by being faithful stewards of all that is + entrusted to us. To serve our employees and families well, + using our resources to positively impact and help others. +

+ + + + + {/* Purpose */} + + + + + +

+ Our Purpose +

+

+ To provide professional and ethical representation for both + our manufacturers and distributor partners with a vision of + symbiotically beneficial growth. +

+ + + +
+
+
+ + {/* Guiding Principles */} +
+
+ +
+ + Guiding Principles + +
+ +
+ {principles.map((principle, index) => ( + + + + {principle} + + + + ))} +
+
+
+ + {/* Core Values Section */} +
+
+
+ + + What Drives Us + + + +

+ Our Core{" "} + Values +

+ + +

+ These values guide everything we do and shape how we interact + with our team, partners, and community. +

+ +
+ + + {coreValues.map((value) => ( + + + {/* Gradient overlay on hover */} + + + + + + +

+ {value.title} +

+

+ {value.description} +

+ + + + + ))} + +
+
+ + {/* Visual Culture Section */} +
+
+
+ {/* Visual */} + +
+
+ {/* Animated rings */} + + {[...Array(3)].map((_, i) => ( +
+ ))} + + + {/* Center content */} +
+ + + 🤝 + +

+ Stronger Together +

+

Since 2005

+ +
+ + {/* Floating value icons */} + {coreValues.map((value, i) => { + const positions = [ + { top: "10%", left: "10%" }, + { top: "10%", right: "10%" }, + { bottom: "10%", left: "10%" }, + { bottom: "10%", right: "10%" }, + ]; + return ( + +
+ +
+ + ); + })} +
+
+ + + {/* Content */} + +
+ + Our Community + +

+ More Than a{" "} + Workplace +

+

+ At TCM Sales & Marketing, we're not just colleagues—we're + a family. We believe in creating an environment where everyone + can thrive, grow, and make a meaningful impact. +

+ +
+ {[ + "Supportive work environment", + "Opportunities for growth", + "Work-life balance", + "Community involvement", + ].map((item, index) => ( + + + + + + {item} + + + ))} +
+
+ +
+
+
+ + {/* Quote Section */} +
+
+ + + 💬 + + + +
+ “We believe that we have an obligation to serve others + because we have been given so much.” +
+ + +
+
+ + TCM Sales & Marketing + +
+
+ +
+
+ + {/* CTA Section */} +
+ {/* Background pattern */} +
+ + + + + + +
+ +
+ +

+ Want to Be Part of Our Story? +

+ + +

+ We're always looking for passionate individuals who share our + values and want to make a difference. +

+ + +
+ } + > + Get in Touch + + + Learn What We Do + +
+ +
+
+ +
+ ); +}