ourworld_web/www_projectmycelium_com
23
0
Fork 0
forked from emre/www_projectmycelium_com
Code Issues 3 Pull Requests Projects Releases Activity

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

Browse Source
This commit is contained in:
sasha-astiadi
2025-11-07 17:28:33 +01:00
parent e8c424539e
commit aca13e275b
30 changed files with 83 additions and 83 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
src/pages/compute/ComputeDesign.tsx
View File

@@ -31,14 +31,14 @@ export function ComputeDesign() {
<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" />
{/* ✅ Top horizontal line with spacing */}
<div className="mx-auto max-w-7xl border-gray-200">
<div className="mx-auto max-w-7xl border-gray-100">
<dl className="grid grid-cols-1 gap-4 lg:gap-14 overflow-hidden text-center lg:grid-cols-3">
{stats.map((stat) => (
<div key={stat.id} className="flex flex-col items-center bg-gray-400/5 py-8 px-12 border border-gray-200 lg:border-t-0 lg:border-b-0">
<div key={stat.id} className="flex flex-col items-center bg-gray-400/5 py-8 px-12 border border-gray-100 lg:border-t-0 lg:border-b-0">
<stat.icon className="h-8 w-8 fill-cyan-500 mb-4" aria-hidden="true" />
<CT className="">{stat.value}</CT>
<CP className="mt-1">{stat.name}</CP>
@@ -47,8 +47,8 @@ export function ComputeDesign() {
</dl>
</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>
</div>
)
}

10
src/pages/compute/ComputeFeatures.tsx
View File

@@ -12,10 +12,10 @@ export function ComputeFeatures() {
<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" />
<div className="mx-auto max-w-7xl px-6 bg-white lg:px-8 grid grid-cols-1 lg:grid-cols-2 gap-20 py-12 border border-t-0 border-b-0 border-gray-200">
<div className="mx-auto max-w-7xl px-6 bg-white lg:px-8 grid grid-cols-1 lg:grid-cols-2 gap-20 py-12 border border-t-0 border-b-0 border-gray-100">
{/* ✅ LEFT SIDE — Title + Intro */}
<div className="max-w-xl">
@@ -94,8 +94,8 @@ export function ComputeFeatures() {
</div>
</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>
</section>
)
}

6
src/pages/compute/ComputeHero.tsx
View File

@@ -6,7 +6,7 @@ export function ComputeHero({ onGetStartedClick = () => {} }: { onGetStartedClic
<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/computehero.webp')", backgroundSize: "contain" }}
>
{/* Inner padding */}
@@ -44,8 +44,8 @@ export function ComputeHero({ onGetStartedClick = () => {} }: { onGetStartedClic
</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>
)
}

12
src/pages/compute/ComputeOverview.tsx
View File

@@ -20,8 +20,8 @@ export function ComputeOverview() {
<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" />
{/* ✅ subtle light-mode background accents */}
<div className="pointer-events-none absolute inset-0">
@@ -36,7 +36,7 @@ export function ComputeOverview() {
<div className="absolute inset-0 bg-[radial-gradient(circle_at_top,_rgba(0,0,0,0.03),_transparent_55%)]" />
</div>
<Container className="relative py-12 bg-white mx-auto s border border-t-0 border-b-0 border-gray-200">
<Container className="relative py-12 bg-white mx-auto s border border-t-0 border-b-0 border-gray-100">
<div className="mx-auto max-w-3xl text-center">
<Eyebrow color="accent" className="tracking-[0.35em] uppercase">
Mycelium Compute
@@ -67,7 +67,7 @@ export function ComputeOverview() {
{overviewCards.map((card) => (
<div
key={card.title}
className="group relative overflow-hidden rounded-3xl border border-gray-200 bg-white p-10 shadow-sm transition hover:-translate-y-1 hover:border-cyan-300 hover:shadow-lg"
className="group relative overflow-hidden rounded-3xl border border-gray-100 bg-white p-10 shadow-sm transition hover:-translate-y-1 hover:border-cyan-300 hover:shadow-lg"
>
<div className="absolute inset-0 bg-gradient-to-br from-cyan-50 via-white to-cyan-100 opacity-0 transition group-hover:opacity-70" />
@@ -87,8 +87,8 @@ export function ComputeOverview() {
</div>
</Container>
{/* ✅ 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>
</section>
)
}