Cardoza_Construction/cardozaconstruction.com
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update README.md to reflect new project structure and instructions for Svelte project setup and development.

Browse Source
This commit is contained in:
eewing
2026-03-11 14:26:24 -05:00
parent 67bc59fd2f
commit 6658e86994
22 changed files with 1161 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/routes/+layout.svelte
+72
View File
@@ -0,0 +1,72 @@
<script lang="ts">
import favicon from '$lib/assets/favicon.svg';
import '../app.css';
let { children } = $props();
let lastScrollY = 0;
let hideNav = false;
if (typeof window !== 'undefined') {
window.addEventListener('scroll', () => {
const current = window.scrollY;
hideNav = current > lastScrollY && current > 80;
lastScrollY = current;
});
}
</script>
<svelte:head>
<link rel="icon" href={favicon} />
</svelte:head>
<header
class="fixed inset-x-0 top-0 z-20 border-b border-transparent bg-neutral-800/80 backdrop-blur transition-transform duration-300"
class:translate-y-[-100%]={hideNav}
>
<div
class="mx-auto flex max-w-5xl items-center justify-between px-4 py-3 text-[13px] uppercase tracking-[0.2em]"
>
<div class="flex items-center gap-3">
<img
src="https://static1.squarespace.com/static/570030eb1bbee0d82529dfc5/t/583f069059cc6814835ad595/1480525459901/cardozaccwhiteonblack2.png"
alt="Cardoza Construction, LLC"
class="h-14 w-auto"
/>
</div>
<nav class="flex flex-wrap items-center gap-3 text-[11px] uppercase tracking-[0.22em] text-neutral-100">
<a
href="/"
class="rounded-full border border-transparent px-3 py-1 hover:border-white hover:bg-white/10 hover:text-white"
>
Home
</a>
<a
href="/about"
class="rounded-full border border-transparent px-3 py-1 hover:border-white hover:bg-white/10 hover:text-white"
>
About
</a>
<a
href="/#gallery"
class="rounded-full border border-transparent px-3 py-1 hover:border-white hover:bg-white/10 hover:text-white"
>
Gallery
</a>
<a
href="/#textures"
class="rounded-full border border-transparent px-3 py-1 hover:border-white hover:bg-white/10 hover:text-white"
>
Texture Samples
</a>
<a
href="/contact"
class="rounded-full border border-white px-4 py-1 text-[11px] font-semibold tracking-[0.22em] text-white hover:bg-white hover:text-neutral-900"
>
Contact Us
</a>
</nav>
</div>
</header>
{@render children()}
src/routes/+page.svelte
+205
View File
@@ -0,0 +1,205 @@
<svelte:head>
<title>Cardoza Construction, LLC - Drywall &amp; Metal Framing</title>
<meta
name="description"
content="Cardoza Construction, LLC specializes in drywall, steel framing, and acoustical ceilings for residential, commercial, multi-family, and industrial projects."
/>
</svelte:head>
<main class="min-h-screen bg-white text-neutral-900">
<!-- Hero / headline block with full-width background and centered copy -->
<section
id="home"
class="relative border-b border-neutral-200 bg-[url('https://images.squarespace-cdn.com/content/v1/570030eb1bbee0d82529dfc5/a28d6311-4fa4-4b90-987a-498217dde1ae/Smooth1.png')] bg-cover bg-center"
>
<div class="absolute inset-0 bg-neutral-900/40" />
<div class="relative mx-auto flex min-h-[720px] max-w-5xl flex-col items-center justify-center px-4 py-32 text-center text-white">
<p class="mb-3 text-xs italic text-neutral-200">Cardoza Construction</p>
<h1 class="text-4xl font-semibold uppercase tracking-[0.35em] sm:text-5xl">
Exceeding Expectations
</h1>
<p class="mt-6 text-[11px] uppercase tracking-[0.3em] text-neutral-100">
Drywall &nbsp;&nbsp; Steel Framing &nbsp;&nbsp; Acoustical Ceilings
</p>
<p class="mt-3 text-[11px] uppercase tracking-[0.3em] text-neutral-100">
Residential &nbsp;&nbsp; Commercial &nbsp;&nbsp; Multi-Family &nbsp;&nbsp; Industrial
</p>
<p class="mt-3 text-[11px] italic text-neutral-100">
New Construction &nbsp;&nbsp; Remodels
</p>
</div>
</section>
<!-- Centered contact bar like the screenshot -->
<section class="border-b border-neutral-200 bg-white">
<div class="mx-auto max-w-4xl px-4 py-10">
<button
type="button"
on:click={() => document.getElementById('contact')?.scrollIntoView({ behavior: 'smooth' })}
class="block w-full border border-neutral-900 bg-neutral-900 px-8 py-3 text-xs font-semibold uppercase tracking-[0.25em] text-white hover:bg-neutral-800"
>
Contact Us
</button>
</div>
</section>
<!-- Over the Years / image grid approximation -->
<section id="gallery" class="border-b border-neutral-200 bg-neutral-50">
<div class="mx-auto max-w-4xl px-4 py-16">
<h2 class="mb-6 text-sm uppercase tracking-[0.25em] text-neutral-500">
Over The Years
</h2>
<div class="grid gap-3 sm:grid-cols-4">
<div class="aspect-[4/3] bg-neutral-200" />
<div class="aspect-[4/3] bg-neutral-300" />
<div class="aspect-[4/3] bg-neutral-200" />
<div class="aspect-[4/3] bg-neutral-300" />
<div class="aspect-[4/3] bg-neutral-300" />
<div class="aspect-[4/3] bg-neutral-200" />
<div class="aspect-[4/3] bg-neutral-300" />
<div class="aspect-[4/3] bg-neutral-200" />
</div>
<p class="mt-4 text-xs text-neutral-500">
Image credits: Micah Bechard and project partners.
</p>
</div>
</section>
<!-- About + market segments -->
<section id="about" class="border-b border-neutral-200 bg-white">
<div class="mx-auto max-w-4xl px-4 py-16">
<h2 class="mb-6 text-sm uppercase tracking-[0.25em] text-neutral-500">About</h2>
<p class="text-sm leading-relaxed text-neutral-700">
Cardoza Construction, LLC provides drywall, steel framing, and acoustical ceiling services for a wide
range of projects. We are committed to quality craftsmanship, reliable scheduling, and clear
communication from bid to final walk-through.
</p>
<div class="mt-10 grid gap-8 sm:grid-cols-2">
<div>
<h3 class="mb-2 text-xs font-semibold uppercase tracking-[0.25em] text-neutral-600">
Residential
</h3>
<p class="text-sm text-neutral-700">
New homes, additions, and restorations. We repair cracks, holes, and water damage, and provide
smooth finishes and custom textures to match your vision.
</p>
</div>
<div>
<h3 class="mb-2 text-xs font-semibold uppercase tracking-[0.25em] text-neutral-600">
Commercial
</h3>
<p class="text-sm text-neutral-700">
Restaurants, professional office buildings, retail stores, banks, medical buildings, and
theaters. We excel in coordinating with owners, architects, and general contractors.
</p>
</div>
<div>
<h3 class="mb-2 text-xs font-semibold uppercase tracking-[0.25em] text-neutral-600">
Multi-Family, Condos, &amp; Hotels
</h3>
<p class="text-sm text-neutral-700">
From upscale apartments and luxury lofts to condominiums and hotels, we bring consistent
quality and efficiency to multi-unit projects.
</p>
</div>
<div>
<h3 class="mb-2 text-xs font-semibold uppercase tracking-[0.25em] text-neutral-600">
Industrial
</h3>
<p class="text-sm text-neutral-700">
Municipal, manufacturing, and warehousing facilities with durable wall and ceiling systems that
meet demanding performance requirements.
</p>
</div>
</div>
</div>
</section>
<!-- Texture samples placeholder -->
<section id="textures" class="border-b border-neutral-200 bg-neutral-50">
<div class="mx-auto max-w-4xl px-4 py-16">
<h2 class="mb-6 text-sm uppercase tracking-[0.25em] text-neutral-500">Texture Samples</h2>
<p class="mb-6 text-sm text-neutral-700">
Your original site shows multiple texture examples. We can mirror that here with a grid of labeled
samples (smooth, knockdown, orange peel, custom, etc.) and project photos.
</p>
<div class="grid gap-4 sm:grid-cols-3">
<div class="space-y-2">
<div class="aspect-[4/3] bg-neutral-200" />
<p class="text-xs uppercase tracking-[0.2em] text-neutral-600">Smooth Finish</p>
</div>
<div class="space-y-2">
<div class="aspect-[4/3] bg-neutral-200" />
<p class="text-xs uppercase tracking-[0.2em] text-neutral-600">Knockdown</p>
</div>
<div class="space-y-2">
<div class="aspect-[4/3] bg-neutral-200" />
<p class="text-xs uppercase tracking-[0.2em] text-neutral-600">Orange Peel</p>
</div>
</div>
</div>
</section>
<!-- Subscribe + contact block like Squarespace footer area -->
<section id="contact" class="border-b border-neutral-200 bg-white">
<div class="mx-auto max-w-4xl px-4 py-16">
<h2 class="mb-6 text-sm uppercase tracking-[0.25em] text-neutral-500">Subscribe</h2>
<p class="text-sm text-neutral-700">
Sign up with your email address to receive news and updates.
</p>
<form class="mt-4 flex flex-col gap-3 sm:flex-row">
<input
type="email"
required
placeholder="Email Address"
class="w-full border border-neutral-300 bg-white px-3 py-2 text-sm text-neutral-900 outline-none placeholder:text-neutral-400 focus:border-neutral-900 sm:max-w-xs"
/>
<button
type="submit"
class="inline-flex items-center justify-center border border-neutral-900 bg-neutral-900 px-6 py-2 text-xs font-semibold uppercase tracking-[0.25em] text-white hover:bg-neutral-800"
>
Sign Up
</button>
</form>
<p class="mt-10 text-sm text-neutral-700">
<strong>Cardoza Construction, LLC</strong>
<br />
1836 North Deffer Drive, Nixa, MO 65714
<br />
<a href="tel:+14177256717" class="text-neutral-700 underline underline-offset-2">
(417) 725-6717
</a>
</p>
</div>
</section>
<footer class="bg-white">
<div class="mx-auto max-w-4xl px-4 py-8 text-xs text-neutral-600">
<div class="flex flex-col gap-3 sm:flex-row sm:items-center sm:justify-between">
<p>
&copy; {new Date().getFullYear()} Cardoza Construction, LLC. All rights reserved.
</p>
<div class="flex flex-wrap items-center gap-4">
<a
href="https://www.google.com/search?q=Cardoza+Construction+LLC"
target="_blank"
rel="noreferrer"
class="underline underline-offset-2 hover:text-neutral-900"
>
Rate us on Google
</a>
<p>Nixa, Missouri &mdash; Drywall &amp; Metal Framing</p>
</div>
</div>
</div>
</footer>
</main>
src/routes/about/+page.svelte
+106
View File
@@ -0,0 +1,106 @@
<svelte:head>
<title>About – Cardoza Construction, LLC</title>
<meta
name="description"
content="Learn about Cardoza Construction, a leading drywall contracting business in the Ozarks serving residential, commercial, multi-family, and industrial projects."
/>
</svelte:head>
<main class="bg-white text-neutral-900 pt-20">
<section class="border-b border-neutral-200 bg-white pt-28">
<div class="mx-auto max-w-3xl px-4 py-16 text-center">
<h1 class="text-2xl font-normal uppercase tracking-[0.25em] text-neutral-900 sm:text-3xl">
Cardoza Construction is a leading drywall contracting business in the Ozarks.
</h1>
</div>
</section>
<section class="border-b border-neutral-200 bg-white">
<div class="mx-auto max-w-4xl px-4 py-24" />
</section>
<section class="border-b border-neutral-200 bg-white">
<div class="mx-auto max-w-4xl px-4 py-16">
<h2 class="mb-8 text-center text-xl font-normal text-neutral-900">Our Team</h2>
<div class="h-px w-full bg-neutral-200" />
<div class="mt-10 grid gap-10 text-sm text-neutral-800 sm:grid-cols-3">
<div class="space-y-1 text-center">
<p class="font-semibold">Rick Cardoza</p>
<p class="text-xs text-neutral-600">Owner</p>
</div>
<div class="space-y-1 text-center">
<p class="font-semibold">Alfonso Ewing</p>
<p class="text-xs text-neutral-600">Office Manager</p>
</div>
<div class="space-y-1 text-center">
<p class="font-semibold">David Cardoza</p>
<p class="text-xs text-neutral-600">Site Manager</p>
</div>
<div class="space-y-1 text-center">
<p class="font-semibold">Lori Cardoza</p>
<p class="text-xs text-neutral-600">Owner</p>
</div>
<div class="space-y-1 text-center">
<p class="font-semibold">Heidi Mahan</p>
<p class="text-xs text-neutral-600">Operations Manager</p>
</div>
<div class="space-y-1 text-center">
<p class="font-semibold">Eddie Miller</p>
<p class="text-xs text-neutral-600">Site Manager</p>
</div>
<div class="space-y-1 text-center">
<p class="font-semibold">Beth Cardoza</p>
<p class="text-xs text-neutral-600">Residential Estimator</p>
</div>
<div class="space-y-1 text-center">
<p class="font-semibold">Ezekiel Ewing</p>
<p class="text-xs text-neutral-600">IT Manager</p>
</div>
<div class="space-y-1 text-center">
<p class="font-semibold">Joel Snyder</p>
<p class="text-xs text-neutral-600">Site Manager</p>
</div>
<div class="space-y-1 text-center">
<p class="font-semibold">Timothy Cardoza</p>
<p class="text-xs text-neutral-600">Commercial Estimator</p>
</div>
<div class="space-y-1 text-center">
<p class="font-semibold">David Rader</p>
<p class="text-xs text-neutral-600">Warehouse</p>
</div>
<div class="space-y-1 text-center">
<p class="font-semibold">Ben Poland</p>
<p class="text-xs text-neutral-600">Project Manager</p>
</div>
</div>
</div>
</section>
<section class="border-b border-neutral-200 bg-white">
<div class="mx-auto max-w-4xl px-4 py-16">
<h2 class="mb-6 text-sm uppercase tracking-[0.25em] text-neutral-500">Subscribe</h2>
<p class="text-sm text-neutral-700">
Sign up with your email address to receive news and updates.
</p>
<form class="mt-4 flex flex-col gap-3 sm:flex-row">
<input
type="email"
required
placeholder="Email Address"
class="w-full border border-neutral-300 bg-white px-3 py-2 text-sm text-neutral-900 outline-none placeholder:text-neutral-400 focus:border-neutral-900 sm:max-w-xs"
/>
<button
type="submit"
class="inline-flex items-center justify-center border border-neutral-900 bg-neutral-900 px-6 py-2 text-xs font-semibold uppercase tracking-[0.25em] text-white hover:bg-neutral-800"
>
Sign Up
</button>
</form>
</div>
</section>
</main>
src/routes/contact/+page.svelte
+90
View File
@@ -0,0 +1,90 @@
<svelte:head>
<title>Contact Us – Cardoza Construction, LLC</title>
<meta
name="description"
content="Contact Cardoza Construction, LLC to discuss new bids, careers, or general questions about drywall, metal framing, and acoustical ceiling projects."
/>
</svelte:head>
<main class="bg-white text-neutral-900 pt-24">
<section class="border-b border-neutral-200 bg-white">
<div class="mx-auto max-w-3xl px-4 py-16 text-center">
<h1 class="text-2xl font-normal text-neutral-900 sm:text-3xl">We'd love to hear from you.</h1>
</div>
</section>
<section class="border-b border-neutral-200 bg-white">
<div class="mx-auto max-w-4xl px-4 py-16 space-y-10">
<div class="flex flex-col items-center justify-center gap-4 sm:flex-row">
<button
type="button"
class="border border-neutral-900 bg-neutral-900 px-8 py-2 text-xs font-semibold uppercase tracking-[0.25em] text-white hover:bg-neutral-800"
>
New Bid Form
</button>
<button
type="button"
class="border border-neutral-900 bg-white px-8 py-2 text-xs font-semibold uppercase tracking-[0.25em] text-neutral-900 hover:bg-neutral-900 hover:text-white"
>
Careers
</button>
</div>
<div class="space-y-6 text-center text-sm text-neutral-800">
<p class="text-xs uppercase tracking-[0.25em] text-neutral-500">
Need more information? Here's our contact info.
</p>
<div class="space-y-2">
<h2 class="text-sm font-semibold uppercase tracking-[0.25em] text-neutral-700">
Cardoza Construction, LLC
</h2>
<p>
1836 N. Deffer Dr.<br />
Nixa, Missouri 65714
</p>
<p>
<a href="tel:+14177256717" class="underline underline-offset-2">
417-725-6717
</a>
</p>
</div>
<div class="pt-6">
<div class="aspect-[16/9] w-full overflow-hidden border border-neutral-200">
<iframe
title="Cardoza Construction location"
src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3085.907069597991!2d-93.3150194!3d37.0920476!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x87cf62d9b8b2c1d1%3A0x0000000000000000!2s1836%20N%20Deffer%20Dr%2C%20Nixa%2C%20MO%2065714!5e0!3m2!1sen!2sus!4v1700000000000"
class="h-full w-full border-0"
loading="lazy"
referrerpolicy="no-referrer-when-downgrade"
/>
</div>
</div>
</div>
</div>
</section>
<section class="border-b border-neutral-200 bg-white">
<div class="mx-auto max-w-4xl px-4 py-16">
<h2 class="mb-6 text-sm uppercase tracking-[0.25em] text-neutral-500">Subscribe</h2>
<p class="text-sm text-neutral-700">
Sign up with your email address to receive news and updates.
</p>
<form class="mt-4 flex flex-col gap-3 sm:flex-row">
<input
type="email"
required
placeholder="Email Address"
class="w-full border border-neutral-300 bg-white px-3 py-2 text-sm text-neutral-900 outline-none placeholder:text-neutral-400 focus:border-neutral-900 sm:max-w-xs"
/>
<button
type="submit"
class="inline-flex items-center justify-center border border-neutral-900 bg-neutral-900 px-6 py-2 text-xs font-semibold uppercase tracking-[0.25em] text-white hover:bg-neutral-800"
>
Sign Up
</button>
</form>
</div>
</section>
</main>