refactor: adjust network page styling and typography

- Changed heading levels from H3 to H4 in NetworkCapabilities for better hierarchy
- Updated PrimaryFeatures section with darker background and consistent border styling
- Removed text-lg class from paragraph for standard sizing
This commit is contained in:
2025-11-07 23:21:55 +01:00
parent 716915b19e
commit 100cae988c
3 changed files with 15 additions and 8 deletions

View File

@@ -8,6 +8,7 @@ import { H2, P, H3, CT, CP, Eyebrow } from '@/components/Texts'
export function Features() {
return (
<section className="w-full max-w-8xl mx-auto bg-transparent">
{/* ✅ Top spacer + full-width line */}
<div className="max-w-7xl mx-auto py-6 border-x border-gray-100 bg-white border-t-0 border-b-0" />

View File

@@ -5,7 +5,7 @@ import {
NoSymbolIcon,
} from '@heroicons/react/24/solid'
import { Eyebrow, H3, P } from '@/components/Texts'
import { Eyebrow, H4, P } from '@/components/Texts'
export function NetworkCapabilities() {
return (
@@ -22,11 +22,11 @@ export function NetworkCapabilities() {
<div className="max-w-xl ">
<Eyebrow>WHAT IT ENABLES</Eyebrow>
<H3 className="mt-6 text-white">
<H4 className="mt-6 text-white">
A Private Networking Layer for Everything You Run
</H3>
</H4>
<P className="mt-6 text-lg text-gray-200">
<P className="mt-6 text-gray-200">
Mycelium Network is the backbone for secure, autonomous connectivity
across devices, data centers, clusters, and self-hosted environments anywhere in the world.
</P>

View File

@@ -407,10 +407,13 @@ export function PrimaryFeatures() {
<section
id="howitworks"
aria-label="Features for investing all your money"
className="bg-gray-900 py-20 sm:py-32"
className="bg-[#121212]"
>
<Container>
<div className="mx-auto max-w-2xl lg:mx-0 lg:max-w-3xl">
{/* ✅ Top horizontal line with spacing */}
<div className="max-w-7xl bg-[#121212] mx-auto py-6 border border-t-0 border-b-0 border-gray-800"></div>
<div className="w-full border-t border-l border-r border-gray-800" />
<Container className="pt-12 border border-t-0 border-b-0 border-gray-800">
<div className="mx-auto max-w-2xl lg:mx-0 lg:max-w-3xl ">
<Eyebrow color="accent">How It Works</Eyebrow>
<SectionHeader color="white" className="mt-2">
How Mycelium Operates
@@ -425,9 +428,12 @@ export function PrimaryFeatures() {
<div className="mt-16 md:hidden">
<FeaturesMobile />
</div>
<Container className="hidden md:mt-20 md:block">
<Container className="hidden pt-12 pb-12 md:block border border-t-0 border-b-0 border-gray-800">
<FeaturesDesktop />
</Container>
{/* ✅ bottom border + bottom spacer to match */}
<div className="w-full border-b border-gray-800" />
<div className="max-w-7xl mx-auto py-6 border border-t-0 border-b-0 border-gray-800 bg-transparent" />
</section>
)
}