James-admin/SculptedArcWebSite
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

improved site header, added contact form, content card carousel, footer, and more photos

Browse Source
This commit is contained in:
jamesratcliffe101
2026-05-28 21:20:47 +01:00
parent 6a579699e7
commit 74a908f07f
32 changed files with 1394 additions and 386 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
components/hero-section.tsx
View File

@@ -1,21 +1,25 @@
import ContentCard from "./ui/content-cards";
import './hero-section.css'
import heroPictureOne from "../assets/hero-picture-1.png"
import heroPictureTwo from "../assets/hero-picture-2.png"
import heroPictureThree from "../assets/hero-picture-3.png"
import heroPictureOne from "../assets/mxj-files-planet-27066.gif"
export default function HeroSection() {
return(
<>
<div className="hero-main flex flex-wrap">
<div className="hero-picture-stack p-4">
<img className="hero-picture" src={heroPictureOne.src} alt="" />
<img className="hero-picture hero-picture--tilt-20" src={heroPictureTwo.src} alt="" />
<img className="hero-picture hero-picture--tilt-40" src={heroPictureThree.src} alt="" />
<div className="flex flex-wrap-reverse justify-items-center ">
<div className="p-4 w-full md:w-1/2 shrink-0">
<img className="w-full h-auto rounded-2xl object-cover" src={heroPictureOne.src} alt="" />
</div>
<div className="hero-right">
<h1 className="mb-4 text-5xl font-bold text-heading md:text-6xl lg:text-7xl"><span className="text-transparent bg-clip-text bg-gradient-to-r bg-violet-800 from-sky-400">Sculpted Arc</span><br/> Web Solutions</h1>
<div className="w-full md:w-1/2">
<h1 className="mb-4 font-bold text-heading text-6xl sm:text-7xl"><span className="text-transparent bg-clip-text bg-gradient-to-r bg-violet-800 from-sky-400">Sculpted Arc</span><br/> Web Solutions</h1>
<hr className="w-1/4 mb-7 mt-8 border-gray-700 border-2 rounded-2xl"/>
<p className="text-lg font-normal text-body lg:text-xl">Here at Sculpted Arc we are invested in creating great website and solving complex web problems Here at Sculpted Arc we are invested in creating great website and solving complex web problems</p>
<br/>
<a href="#" className="transition duration-150 flex w-55 justify-start rounded-3xl text-body bg-neutral-secondary-medium box-border border border-default-medium hover:bg-blue-200 hover:text-black hover:text-heading focus:ring-4 focus:ring-neutral-tertiary shadow-xs font-medium leading-5 rounded-base text-sm px-4 py-2.5 focus:outline-none mt-auto">
Tell us about your project
<svg className="w-3 h-3 ms-1.5 rtl:rotate-180 -me-0.5" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="none" viewBox="0 0 20 20"><path stroke="currentColor" strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M19 12H5m14 0-4 4m4-4-4-4"/></svg>
</a>
</div>
</div>
</>