refactor: remove dark mode styling from agent and home pages

- Simplified styling by removing dark mode classes (dark:bg-*, dark:text-*, dark:border-*)
- Added explicit text color classes for better consistency
- Fixed animation container layout with proper centering and sizing
This commit is contained in:
2025-11-14 22:51:19 +01:00
parent a3028ff448
commit 56ceac1319
5 changed files with 13 additions and 13 deletions

View File

@@ -119,8 +119,8 @@ export function AgentBento() {
className={`relative flex lg:h-90 flex-col overflow-hidden rounded-[calc(var(--radius-lg)+1px)] `} className={`relative flex lg:h-90 flex-col overflow-hidden rounded-[calc(var(--radius-lg)+1px)] `}
> >
{card.animation ? ( {card.animation ? (
<div className="lg:h-64 h-48 w-full overflow-hidden bg-transparent flex items-center"> <div className="lg:h-64 h-48 w-full overflow-hidden bg-transparent flex items-center justify-center">
<card.animation /> <div className="w-full h-full object-cover"><card.animation /></div>
</div> </div>
) : ( ) : (
<div className="h-48 w-full flex items-center justify-center bg-transparent" /> <div className="h-48 w-full flex items-center justify-center bg-transparent" />

View File

@@ -36,10 +36,10 @@ export function AgentDesign() {
{benefits.map((item) => ( {benefits.map((item) => (
<div <div
key={item.id} key={item.id}
className="flex flex-col items-center bg-white dark:bg-black/40 py-10 px-4 border border-gray-100 dark:border-gray-800 lg:border-t-0 lg:border-b-0" className="flex flex-col items-center bg-white py-10 px-4 border border-gray-100 lg:border-t-0 lg:border-b-0"
> >
<item.icon className="h-10 w-10 text-cyan-500 mb-4" /> <item.icon className="h-10 w-10 text-cyan-500 mb-4" />
<h3 className="text-base font-medium text-black dark:text-white max-w-xs"> <h3 className="text-base font-medium text-black max-w-xs">
{item.title} {item.title}
</h3> </h3>
</div> </div>

View File

@@ -18,7 +18,7 @@ export function CloudHeroNew({ onGetStartedClick = () => {} }: { onGetStartedCli
<H3 className="mt-4"> <H3 className="mt-4">
Sovereign Edge Cloud Infrastructure Sovereign Edge Cloud Infrastructure
</H3> </H3>
<p className="mt-6 text-lg"> <p className="mt-6 text-lg text-gray-600">
Run compute, storage, and AI resources on infrastructure you control. Run compute, storage, and AI resources on infrastructure you control.
</p> </p>
<p className="mt-4 text-lg text-gray-600"> <p className="mt-4 text-lg text-gray-600">

View File

@@ -26,19 +26,19 @@ const benefits = [
export function HomeDesign() { export function HomeDesign() {
return ( return (
<section className="w-full max-w-8xl mx-auto bg-white dark:bg-transparent"> <section className="w-full max-w-8xl mx-auto bg-white">
{/* Top spacing line */} {/* Top spacing line */}
<div className="max-w-7xl mx-auto py-6 border border-t-0 border-b-0 border-gray-200 dark:border-gray-800" /> <div className="max-w-7xl mx-auto py-6 border border-t-0 border-b-0 border-gray-200" />
<div className="w-full border border-l border-r border-gray-200 dark:border-gray-800" /> <div className="w-full border border-l border-r border-gray-200" />
{/* Content */} {/* Content */}
<div className="mx-auto max-w-7xl border-gray-200 dark:border-gray-800"> <div className="mx-auto max-w-7xl border-gray-200">
<dl className="grid grid-cols-1 lg:grid-cols-3 gap-4 lg:gap-0"> <dl className="grid grid-cols-1 lg:grid-cols-3 gap-4 lg:gap-0">
{benefits.map((item) => ( {benefits.map((item) => (
<div <div
key={item.id} key={item.id}
className="group flex items-start gap-2 bg-white/40 dark:bg-black/40 px-8 py-12 border border-gray-200 dark:border-gray-800 lg:border-t-0 lg:border-b-0" className="group flex items-start gap-2 bg-white px-8 py-12 border border-gray-200 0 lg:border-t-0 lg:border-b-0"
> >
{/* Image on the LEFT */} {/* Image on the LEFT */}
<img <img
@@ -49,10 +49,10 @@ export function HomeDesign() {
{/* Text on the RIGHT */} {/* Text on the RIGHT */}
<div className="text-left"> <div className="text-left">
<h3 className="text-base font-semibold tracking-wide text-gray-900 dark:text-white mb-2"> <h3 className="text-base font-semibold tracking-wide text-gray-900 mb-2">
{item.title} {item.title}
</h3> </h3>
<p className="text-sm text-gray-600 dark:text-gray-300 leading-relaxed max-w-xs"> <p className="text-sm text-gray-600 leading-relaxed max-w-xs">
{item.description} {item.description}
</p> </p>
</div> </div>

View File

@@ -18,7 +18,7 @@ export function NodeHero() {
<H3 as="h1" className="mt-4"> <H3 as="h1" className="mt-4">
Host a Node. Power the Network. Host a Node. Power the Network.
</H3> </H3>
<p className="mt-6 text-lg"> <p className="mt-6 text-lg text-gray-800">
The Mycelium Network runs on nodes hosted by people and organizations around the world. Each node adds capacity, resilience, and sovereignty, expanding a global network for private, distributed compute and AI. The Mycelium Network runs on nodes hosted by people and organizations around the world. Each node adds capacity, resilience, and sovereignty, expanding a global network for private, distributed compute and AI.
</p> </p>
<div className="mt-10 flex items-center gap-x-6"> <div className="mt-10 flex items-center gap-x-6">