refactor: adjust spacing and styling in compute pages

- Reduced vertical spacing between header and content sections for tighter layout
- Changed border radius from rounded-3xl to rounded-md for consistent styling
- Added hover effect with gradient background to architecture cards
This commit is contained in:
2025-11-07 23:13:18 +01:00
parent 451c1f5c56
commit 1851c2d6fb
3 changed files with 5 additions and 5 deletions

View File

@@ -65,12 +65,12 @@ export function ComputeArchitecture() {
{deterministicCards.map((card) => ( {deterministicCards.map((card) => (
<div <div
key={card.id} key={card.id}
className={`relative ${card.colSpan} ${card.rowSpan} transition-transform duration-300 hover:scale-102`} className={`relative ${card.colSpan} ${card.rowSpan} transition-transform duration-300 hover:scale-102 group`}
> >
{/* ✅ Disable wrapper on first card */} {/* ✅ Disable wrapper on first card */}
{!card.noBorder && ( {!card.noBorder && (
<div <div
className={`absolute inset-0 rounded-md border border-gray-800 bg-[#111212] ${card.rounded}`} className={`absolute inset-0 rounded-md border border-gray-800 bg-[#111212] ${card.rounded} group-hover:bg-linear-to-br from-gray-900 to-gray-800`}
/> />
)} )}

View File

@@ -64,7 +64,7 @@ export function ComputeCodeTabs() {
return ( return (
<div className="sm:px-6 lg:px-0"> <div className="sm:px-6 lg:px-0">
<div className="relative isolate overflow-hidden bg-cyan-600 px-6 pt-8 sm:mx-auto sm:max-w-2xl sm:rounded-3xl sm:pt-16 sm:pr-0 sm:pl-16 lg:mx-0 lg:max-w-none"> <div className="relative isolate overflow-hidden bg-cyan-600 px-6 pt-8 sm:mx-auto sm:max-w-2xl sm:rounded-md sm:pt-16 sm:pr-0 sm:pl-16 lg:mx-0 lg:max-w-none">
<div <div
aria-hidden="true" aria-hidden="true"

View File

@@ -50,7 +50,7 @@ export function ComputeOverview() {
Deterministic compute fabric for autonomous workloads. Deterministic compute fabric for autonomous workloads.
</SectionHeader> </SectionHeader>
<P color="secondary" className="mt-6 text-gray-600"> <P color="secondary" className="mt-4 text-gray-600">
Mycelium Compute delivers predictable, sovereign performancefree Mycelium Compute delivers predictable, sovereign performancefree
from lock-in and drift. Deploy any workload with cryptographic from lock-in and drift. Deploy any workload with cryptographic
precision, knowing the platform verifies, scales, and heals itself precision, knowing the platform verifies, scales, and heals itself
@@ -63,7 +63,7 @@ export function ComputeOverview() {
</div> </div>
{/* ✅ Light Mode Cards */} {/* ✅ Light Mode Cards */}
<div className="mt-16 grid gap-6 lg:grid-cols-2"> <div className="mt-12 grid gap-6 lg:grid-cols-2">
{overviewCards.map((card) => ( {overviewCards.map((card) => (
<div <div
key={card.title} key={card.title}