emre/www_geomind
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

black theme complete

Browse Source
This commit is contained in:
Emre
2025-10-11 06:18:46 +03:00
parent 16c1a09bc4
commit 31fe89eabb
16 changed files with 276 additions and 293 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/pages/usecases/UseCasesPage.tsx
View File

@@ -3,7 +3,7 @@ import { UseCasesGrid } from './components/UseCasesGrid';
export const UseCasesPage = () => {
return (
<div className="space-y-12 lg:space-y-16">
<div className="space-y-12 text-slate-100 lg:space-y-16">
<UseCasesHero />
<UseCasesGrid />
</div>

81
src/pages/usecases/components/UseCasesGrid.tsx
View File

@@ -41,49 +41,44 @@ const useCases = [
export const UseCasesGrid = () => {
return (
<section className="py-16 lg:py-24">
<div className="relative p-8 sm:rounded-3xl lg:p-16">
<div className="pointer-events-none absolute -bottom-20 -left-32 h-72 w-72 rounded-full bg-brand-100 opacity-50 blur-3xl" />
<div className="pointer-events-none absolute -top-24 right-12 h-48 w-48 rounded-full bg-brand-200 opacity-40 blur-3xl" />
<motion.div
initial={{ opacity: 0, y: 24 }}
whileInView={{ opacity: 1, y: 0 }}
viewport={{ once: true, amount: 0.3 }}
transition={{ duration: 0.6, ease: 'easeOut' }}
className="relative z-10"
>
<h2 className="text-3xl font-semibold text-ink sm:text-4xl">Use Cases</h2>
<p className="mt-5 max-w-4xl text-base text-slate-600 sm:text-lg">
GeoMind's next-generation datacenter architecture extends from core to edge, seamlessly
connecting Tier S hyperscale facilities with Tier H local nodes to create a unified,
sovereign infrastructure. Up to 60% more energy-efficient and built for resilience, privacy,
and quantum-safe security, it can be deployed in weeks rather than years. These capabilities
power the transformative use cases below, driving a more secure, efficient, and autonomous
digital future.
</p>
<div className="mt-12 grid gap-8 sm:grid-cols-2 lg:grid-cols-3">
{useCases.map((useCase, index) => (
<motion.article
key={useCase.title}
initial={{ opacity: 0, y: 24 }}
whileInView={{ opacity: 1, y: 0 }}
viewport={{ once: true, amount: 0.25 }}
transition={{ duration: 0.5, delay: index * 0.05 }}
className="overflow-hidden rounded-3xl border border-slate-100 bg-white/90 shadow-subtle"
>
<div className="relative h-48 overflow-hidden">
<img src={useCase.image} alt={useCase.title} className="h-full w-full object-cover" />
<div className="absolute inset-0 bg-gradient-to-t from-ink/70 via-transparent to-transparent" />
<h3 className="absolute bottom-4 left-4 text-lg font-semibold text-white">
{useCase.title}
</h3>
</div>
<p className="p-6 text-sm leading-6 text-slate-600">{useCase.description}</p>
</motion.article>
))}
</div>
</motion.div>
</div>
<section className="py-16 text-slate-100 lg:py-24">
<motion.div
initial={{ opacity: 0, y: 24 }}
whileInView={{ opacity: 1, y: 0 }}
viewport={{ once: true, amount: 0.3 }}
transition={{ duration: 0.6, ease: 'easeOut' }}
>
<h2 className="text-3xl font-semibold text-white sm:text-4xl">Use Cases</h2>
<p className="mt-5 max-w-4xl text-base text-slate-300 sm:text-lg">
GeoMind's next-generation datacenter architecture extends from core to edge, seamlessly
connecting Tier S hyperscale facilities with Tier H local nodes to create a unified, sovereign
infrastructure. Up to 60% more energy-efficient and built for resilience, privacy, and
quantum-safe security, it can be deployed in weeks rather than years. These capabilities power
the transformative use cases below, driving a more secure, efficient, and autonomous digital
future.
</p>
<div className="mt-12 grid gap-8 sm:grid-cols-2 lg:grid-cols-3">
{useCases.map((useCase, index) => (
<motion.article
key={useCase.title}
initial={{ opacity: 0, y: 24 }}
whileInView={{ opacity: 1, y: 0 }}
viewport={{ once: true, amount: 0.25 }}
transition={{ duration: 0.5, delay: index * 0.05 }}
className="overflow-hidden rounded-3xl border border-white/10 bg-black shadow-none backdrop-blur"
>
<div className="relative h-48 overflow-hidden">
<img src={useCase.image} alt={useCase.title} className="h-full w-full object-cover" />
<div className="absolute inset-0 bg-gradient-to-t from-ink/70 via-transparent to-transparent" />
<h3 className="absolute bottom-4 left-4 text-lg font-semibold text-white">
{useCase.title}
</h3>
</div>
<p className="p-6 text-sm leading-6 text-slate-300">{useCase.description}</p>
</motion.article>
))}
</div>
</motion.div>
</section>
);
};