style: lighten border colors from gray-200 to gray-100

This commit is contained in:
2025-11-07 17:28:33 +01:00
parent e8c424539e
commit aca13e275b
30 changed files with 83 additions and 83 deletions

View File

@@ -17,7 +17,7 @@ export function CloudBluePrint() {
<section className="w-full max-w-8xl mx-auto bg-transparent">
{/* ✅ Boxed container */}
<div className="max-w-7xl bg-white mx-auto pb-12 border border-t-0 border-b-0 border-gray-200">
<div className="max-w-7xl bg-white mx-auto pb-12 border border-t-0 border-b-0 border-gray-100">
<Container>
<div className="mx-auto max-w-4xl sm:text-center">
<Eyebrow className="text-cyan-500">Featured Blueprint</Eyebrow>
@@ -54,8 +54,8 @@ export function CloudBluePrint() {
</div>
{/* ✅ Bottom line + bottom spacer */}
<div className="w-full border-b border-gray-200" />
<div className="max-w-7xl mx-auto py-6 border border-t-0 border-b-0 border-gray-200 bg-transparent" />
<div className="w-full border-b border-gray-100" />
<div className="max-w-7xl mx-auto py-6 border border-t-0 border-b-0 border-gray-100 bg-transparent" />
</section>
);
}

View File

@@ -243,11 +243,11 @@ export function CloudFeaturesLight() {
return (
<div className="">
{/* ✅ Top horizontal line with spacing */}
<div className="max-w-7xl bg-transparent mx-auto py-6 border border-t-0 border-b-0 border-gray-200"></div>
<div className="w-full border-t border-l border-r border-gray-200" />
<div className="max-w-7xl bg-transparent mx-auto py-6 border border-t-0 border-b-0 border-gray-100"></div>
<div className="w-full border-t border-l border-r border-gray-100" />
{/* ✅ Boxed container (border-x only) */}
<div className="relative mx-auto max-w-7xl border border-t-0 border-b-0 border-gray-200 bg-white">
<div className="relative mx-auto max-w-7xl border border-t-0 border-b-0 border-gray-100 bg-white">
<section className="px-6 py-16 lg:py-16">
<Container>
<div className="max-w-4xl mx-auto items-center text-center">
@@ -274,10 +274,10 @@ export function CloudFeaturesLight() {
</div>
{/* ✅ Bottom horizontal line */}
<div className="w-full border-b border-gray-200" />
<div className="w-full border-b border-gray-100" />
{/* ✅ Bottom spacer matching hero */}
<div className="max-w-7xl bg-transparent mx-auto py-6 border border-t-0 border-b-0 border-gray-200"></div>
<div className="max-w-7xl bg-transparent mx-auto py-6 border border-t-0 border-b-0 border-gray-100"></div>
</div>
)
}

View File

@@ -6,7 +6,7 @@ export function CloudHeroNew({ onGetStartedClick = () => {} }: { onGetStartedCli
<div className="">
{/* Boxed container */}
<div
className="relative mx-auto max-w-7xl border border-t-0 border-b-0 border-gray-200 bg-white overflow-hidden bg-contain bg-right bg-no-repeat"
className="relative mx-auto max-w-7xl border border-t-0 border-b-0 border-gray-100 bg-white overflow-hidden bg-contain bg-right bg-no-repeat"
style={{ backgroundImage: "url('/images/cloudhero4.webp')", backgroundSize: "contain" }}
>
{/* Inner padding */}
@@ -44,8 +44,8 @@ export function CloudHeroNew({ onGetStartedClick = () => {} }: { onGetStartedCli
</div>
{/* ✅ Bottom horizontal line with spacing */}
<div className="w-full border-b border-gray-200" />
<div className="max-w-7xl bg-transparent mx-auto py-6 border border-t-0 border-b-0 border-gray-200"></div>
<div className="w-full border-b border-gray-100" />
<div className="max-w-7xl bg-transparent mx-auto py-6 border border-t-0 border-b-0 border-gray-100"></div>
</div>
)
}

View File

@@ -41,11 +41,11 @@ export function CloudUseCases() {
<section className="w-full max-w-8xl mx-auto bg-transparent">
{/* ✅ Top horizontal line with spacing */}
<div className="max-w-7xl bg-transparent mx-auto py-6 border border-t-0 border-b-0 border-gray-200"></div>
<div className="w-full border-t border-l border-r border-gray-200" />
<div className="max-w-7xl bg-transparent mx-auto py-6 border border-t-0 border-b-0 border-gray-100"></div>
<div className="w-full border-t border-l border-r border-gray-100" />
{/* ✅ Inner boxed container */}
<div className="max-w-7xl bg-white mx-auto py-12 border border-t-0 border-b-0 border-gray-200">
<div className="max-w-7xl bg-white mx-auto py-12 border border-t-0 border-b-0 border-gray-100">
<Container>
<div className="mx-auto max-w-4xl sm:text-center">
<Eyebrow className="text-cyan-500">USE CASES</Eyebrow>
@@ -70,7 +70,7 @@ export function CloudUseCases() {
{useCases.map((useCase) => (
<li
key={useCase.title}
className="rounded-md border border-gray-200 bg-white p-6 transition-all duration-300
className="rounded-md border border-gray-100 bg-white p-6 transition-all duration-300
hover:scale-105 hover:border-cyan-500 hover:shadow-lg hover:shadow-cyan-500/20 flex flex-col"
>
<div className="flex items-center justify-between">
@@ -104,8 +104,8 @@ export function CloudUseCases() {
</div>
{/* ✅ Bottom horizontal line + spacing */}
<div className="w-full border-b border-gray-200" />
<div className="max-w-7xl bg-transparent mx-auto py-6 border border-t-0 border-b-0 border-gray-200"></div>
<div className="w-full border-b border-gray-100" />
<div className="max-w-7xl bg-transparent mx-auto py-6 border border-t-0 border-b-0 border-gray-100"></div>
</section>
)
}