This commit is contained in:
despiegk 2025-07-24 21:09:47 +02:00
parent aaca5f6d6c
commit 26752c8b03
7 changed files with 69 additions and 68 deletions

View File

@ -1,3 +1,4 @@
#!/bin/bash #!/bin/bash
cd "$(dirname "$0")" cd "$(dirname "$0")"
pnpm run build pnpm run build
rsync -avz --delete dist/ root@threefold.info:/root/hero/www/info/threefoldgalaxy/

View File

@ -46,8 +46,8 @@ function Blog() {
return ( return (
<div className="container mx-auto px-4 py-12 max-w-5xl"> <div className="container mx-auto px-4 py-12 max-w-5xl">
<div className="text-center mb-12"> <div className="text-center mb-12">
<h1 className="text-5xl font-extrabold text-gray-900 leading-tight">ThreeFold Galaxy Knowledgebase</h1> <h1 className="text-5xl font-extrabold text-foreground leading-tight">ThreeFold Galaxy Knowledgebase</h1>
<p className="mt-4 text-xl text-gray-600 max-w-2xl mx-auto"> <p className="mt-4 text-xl text-muted-foreground max-w-2xl mx-auto">
Whitepapers, Studies and Updates. Whitepapers, Studies and Updates.
</p> </p>
</div> </div>
@ -67,13 +67,13 @@ function Blog() {
<input <input
type="text" type="text"
placeholder="Search articles..." placeholder="Search articles..."
className="flex-grow w-full md:w-auto px-4 py-2 border border-gray-300 rounded-full focus:ring-2 focus:ring-blue-500 focus:border-blue-500 transition-shadow" className="flex-grow w-full md:w-auto px-4 py-2 border border-input bg-background text-foreground rounded-full focus:ring-2 focus:ring-blue-500 focus:border-blue-500 transition-shadow"
value={searchTerm} value={searchTerm}
onChange={e => setSearchTerm(e.target.value)} onChange={e => setSearchTerm(e.target.value)}
/> />
<div className="relative w-full md:w-auto"> <div className="relative w-full md:w-auto">
<select <select
className="w-full appearance-none bg-white border border-gray-300 rounded-full px-4 py-2 pr-8 focus:ring-2 focus:ring-blue-500 focus:border-blue-500 transition-shadow" className="w-full appearance-none bg-background text-foreground border border-input rounded-full px-4 py-2 pr-8 focus:ring-2 focus:ring-blue-500 focus:border-blue-500 transition-shadow"
value={selectedTag} value={selectedTag}
onChange={e => setSelectedTag(e.target.value)} onChange={e => setSelectedTag(e.target.value)}
> >
@ -82,7 +82,7 @@ function Blog() {
<option key={tag} value={tag}>{tag}</option> <option key={tag} value={tag}>{tag}</option>
))} ))}
</select> </select>
<div className="pointer-events-none absolute inset-y-0 right-0 flex items-center px-2 text-gray-700"> <div className="pointer-events-none absolute inset-y-0 right-0 flex items-center px-2 text-muted-foreground">
<svg className="fill-current h-4 w-4" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"><path d="M9.293 12.95l.707.707L15.657 8l-1.414-1.414L10 10.828 5.757 6.586 4.343 8z"/></svg> <svg className="fill-current h-4 w-4" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"><path d="M9.293 12.95l.707.707L15.657 8l-1.414-1.414L10 10.828 5.757 6.586 4.343 8z"/></svg>
</div> </div>
</div> </div>
@ -94,7 +94,7 @@ function Blog() {
) : filteredPosts.length > 0 ? ( ) : filteredPosts.length > 0 ? (
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-10"> <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-10">
{filteredPosts.map(post => ( {filteredPosts.map(post => (
<Link to={`/blog/${post.slug}`} key={post.slug} className="group block bg-white rounded-xl shadow-lg hover:shadow-2xl transition-all duration-300 overflow-hidden transform hover:-translate-y-1"> <Link to={`/blog/${post.slug}`} key={post.slug} className="group block bg-card text-card-foreground rounded-xl shadow-lg hover:shadow-2xl transition-all duration-300 overflow-hidden transform hover:-translate-y-1">
{post.cover_image && ( {post.cover_image && (
<img src={post.cover_image} alt={post.title} className="w-full h-48 object-cover" /> <img src={post.cover_image} alt={post.title} className="w-full h-48 object-cover" />
)} )}
@ -106,13 +106,13 @@ function Blog() {
</span> </span>
))} ))}
</div> </div>
<h2 className="text-2xl font-bold text-gray-900 mb-2 group-hover:text-blue-600 transition-colors"> <h2 className="text-2xl font-bold text-foreground mb-2 group-hover:text-blue-600 transition-colors">
{post.title} {post.title}
</h2> </h2>
<p className="text-gray-500 text-sm mb-4"> <p className="text-muted-foreground text-sm mb-4">
By {post.author} on {new Date(post.date).toLocaleDateString('en-US', { year: 'numeric', month: 'long', day: 'numeric' })} By {post.author} on {new Date(post.date).toLocaleDateString('en-US', { year: 'numeric', month: 'long', day: 'numeric' })}
</p> </p>
<p className="text-gray-700 leading-relaxed"> <p className="text-foreground leading-relaxed">
{post.summary && post.summary.length > 200 ? `${post.summary.substring(0, 200)}...` : post.summary} {post.summary && post.summary.length > 200 ? `${post.summary.substring(0, 200)}...` : post.summary}
</p> </p>
</div> </div>
@ -120,7 +120,7 @@ function Blog() {
))} ))}
</div> </div>
) : ( ) : (
<div className="text-center text-gray-500 py-16"> <div className="text-center text-muted-foreground py-16">
<h2 className="text-2xl font-semibold mb-2">No posts found</h2> <h2 className="text-2xl font-semibold mb-2">No posts found</h2>
<p>Try adjusting your search or filters.</p> <p>Try adjusting your search or filters.</p>
</div> </div>

View File

@ -34,9 +34,9 @@ function BlogPost() {
}, [slug]); }, [slug]);
return ( return (
<div className="bg-gray-50 py-12"> <div className="bg-background py-12">
<div className="container mx-auto px-4"> <div className="container mx-auto px-4">
<article className="max-w-5xl mx-auto bg-white rounded-lg shadow-xl p-8 md:p-12"> <article className="max-w-5xl mx-auto bg-card text-card-foreground rounded-lg shadow-xl p-8 md:p-12">
<header className="text-center mb-8"> <header className="text-center mb-8">
<div className="flex justify-center items-center gap-2 mb-4"> <div className="flex justify-center items-center gap-2 mb-4">
{postData.tags && postData.tags.map(tag => ( {postData.tags && postData.tags.map(tag => (
@ -45,10 +45,10 @@ function BlogPost() {
</span> </span>
))} ))}
</div> </div>
<h1 className="text-3xl md:text-4xl font-extrabold text-gray-900 leading-tight"> <h1 className="text-3xl md:text-4xl font-extrabold text-foreground leading-tight">
{postData.title} {postData.title}
</h1> </h1>
<p className="mt-4 text-lg text-gray-500"> <p className="mt-4 text-lg text-muted-foreground">
By {postData.author} on {postData.date ? new Date(postData.date).toLocaleDateString('en-US', { year: 'numeric', month: 'long', day: 'numeric' }) : 'N/A'} By {postData.author} on {postData.date ? new Date(postData.date).toLocaleDateString('en-US', { year: 'numeric', month: 'long', day: 'numeric' }) : 'N/A'}
</p> </p>
</header> </header>
@ -61,7 +61,7 @@ function BlogPost() {
/> />
)} )}
<div className="prose prose-lg max-w-none mx-auto text-gray-800 prose-headings:text-gray-900 prose-h1:text-3xl prose-h2:text-2xl prose-h3:text-xl prose-h4:text-lg prose-p:text-gray-700 prose-strong:text-gray-900 prose-img:rounded-lg prose-img:shadow-md"> <div className="prose prose-lg max-w-none mx-auto text-foreground prose-headings:text-foreground prose-h1:text-3xl prose-h2:text-2xl prose-h3:text-xl prose-h4:text-lg prose-p:text-muted-foreground prose-strong:text-foreground prose-img:rounded-lg prose-img:shadow-md dark:prose-invert">
<ReactMarkdown <ReactMarkdown
remarkPlugins={[remarkGfm]} remarkPlugins={[remarkGfm]}
rehypePlugins={[rehypeRaw]} rehypePlugins={[rehypeRaw]}
@ -75,46 +75,46 @@ function BlogPost() {
/> />
), ),
h1: ({node, ...props}) => ( h1: ({node, ...props}) => (
<h1 className="text-3xl font-bold text-gray-900 mt-8 mb-4" {...props} /> <h1 className="text-3xl font-bold text-foreground mt-8 mb-4" {...props} />
), ),
h2: ({node, ...props}) => ( h2: ({node, ...props}) => (
<h2 className="text-2xl font-bold text-gray-900 mt-6 mb-3" {...props} /> <h2 className="text-2xl font-bold text-foreground mt-6 mb-3" {...props} />
), ),
h3: ({node, ...props}) => ( h3: ({node, ...props}) => (
<h3 className="text-xl font-semibold text-gray-900 mt-5 mb-2" {...props} /> <h3 className="text-xl font-semibold text-foreground mt-5 mb-2" {...props} />
), ),
h4: ({node, ...props}) => ( h4: ({node, ...props}) => (
<h4 className="text-lg font-semibold text-gray-900 mt-4 mb-2" {...props} /> <h4 className="text-lg font-semibold text-foreground mt-4 mb-2" {...props} />
), ),
p: ({node, ...props}) => ( p: ({node, ...props}) => (
<p className="text-gray-700 leading-relaxed mb-4" {...props} /> <p className="text-muted-foreground leading-relaxed mb-4" {...props} />
), ),
strong: ({node, ...props}) => ( strong: ({node, ...props}) => (
<strong className="font-semibold text-gray-900" {...props} /> <strong className="font-semibold text-foreground" {...props} />
), ),
em: ({node, ...props}) => ( em: ({node, ...props}) => (
<em className="italic text-gray-700" {...props} /> <em className="italic text-muted-foreground" {...props} />
), ),
ul: ({node, ...props}) => ( ul: ({node, ...props}) => (
<ul className="list-disc list-inside mb-4 text-gray-700" {...props} /> <ul className="list-disc list-inside mb-4 text-muted-foreground" {...props} />
), ),
ol: ({node, ...props}) => ( ol: ({node, ...props}) => (
<ol className="list-decimal list-inside mb-4 text-gray-700" {...props} /> <ol className="list-decimal list-inside mb-4 text-muted-foreground" {...props} />
), ),
li: ({node, ...props}) => ( li: ({node, ...props}) => (
<li className="mb-1" {...props} /> <li className="mb-1" {...props} />
), ),
blockquote: ({node, ...props}) => ( blockquote: ({node, ...props}) => (
<blockquote className="border-l-4 border-blue-500 pl-4 italic text-gray-600 my-4" {...props} /> <blockquote className="border-l-4 border-blue-500 pl-4 italic text-muted-foreground my-4" {...props} />
), ),
code: ({node, inline, ...props}) => code: ({node, inline, ...props}) =>
inline ? ( inline ? (
<code className="bg-gray-100 text-gray-800 px-1 py-0.5 rounded text-sm" {...props} /> <code className="bg-muted text-muted-foreground px-1 py-0.5 rounded text-sm" {...props} />
) : ( ) : (
<code className="block bg-gray-100 text-gray-800 p-4 rounded-lg text-sm overflow-x-auto" {...props} /> <code className="block bg-muted text-muted-foreground p-4 rounded-lg text-sm overflow-x-auto" {...props} />
), ),
pre: ({node, ...props}) => ( pre: ({node, ...props}) => (
<pre className="bg-gray-100 p-4 rounded-lg overflow-x-auto my-4" {...props} /> <pre className="bg-muted p-4 rounded-lg overflow-x-auto my-4" {...props} />
) )
}} }}
> >

View File

@ -10,9 +10,9 @@ import { CheckCircle, AlertCircle, ArrowRight, BookOpen } from 'lucide-react'
function FinalStepForm({ formData, handleInputChange, handleSubmit, isSubmitting, submitStatus, formError }) { function FinalStepForm({ formData, handleInputChange, handleSubmit, isSubmitting, submitStatus, formError }) {
return ( return (
<section className="py-16 px-4 sm:px-6 lg:px-8 bg-gradient-to-br from-blue-50 to-green-50"> <section className="py-16 px-4 sm:px-6 lg:px-8 bg-background">
<div className="max-w-4xl mx-auto"> <div className="max-w-4xl mx-auto">
<Card className="bg-white shadow-xl"> <Card className="bg-card text-card-foreground shadow-xl">
<CardHeader> <CardHeader>
<CardTitle className="text-2xl text-center">Additional Information & Terms</CardTitle> <CardTitle className="text-2xl text-center">Additional Information & Terms</CardTitle>
<CardDescription className="text-center text-lg"> <CardDescription className="text-center text-lg">
@ -22,21 +22,21 @@ function FinalStepForm({ formData, handleInputChange, handleSubmit, isSubmitting
<CardContent> <CardContent>
<form onSubmit={handleSubmit} className="space-y-8"> <form onSubmit={handleSubmit} className="space-y-8">
{submitStatus === 'success' && ( {submitStatus === 'success' && (
<div className="flex items-center gap-2 p-4 bg-green-50 border border-green-200 rounded-lg text-green-800"> <div className="flex items-center gap-2 p-4 bg-green-50 border border-green-200 rounded-lg text-green-800 dark:bg-green-950 dark:border-green-700 dark:text-green-200">
<CheckCircle className="h-5 w-5" /> <CheckCircle className="h-5 w-5" />
<span>Thank you! Your interest has been registered successfully. We'll be in touch soon.</span> <span>Thank you! Your interest has been registered successfully. We'll be in touch soon.</span>
</div> </div>
)} )}
{submitStatus === 'error' && ( {submitStatus === 'error' && (
<div className="flex items-center gap-2 p-4 bg-red-50 border border-red-200 rounded-lg text-red-800"> <div className="flex items-center gap-2 p-4 bg-red-50 border border-red-200 rounded-lg text-red-800 dark:bg-red-950 dark:border-red-700 dark:text-red-200">
<AlertCircle className="h-5 w-5" /> <AlertCircle className="h-5 w-5" />
<span>{formError || 'There was an error registering your interest. Please ensure all required fields are filled and terms are agreed.'}</span> <span>{formError || 'There was an error registering your interest. Please ensure all required fields are filled and terms are agreed.'}</span>
</div> </div>
)} )}
<div className="space-y-6"> <div className="space-y-6">
<h3 className="text-xl font-semibold text-slate-900 flex items-center gap-2"> <h3 className="text-xl font-semibold text-foreground flex items-center gap-2">
<BookOpen className="h-5 w-5 text-purple-600" /> <BookOpen className="h-5 w-5 text-purple-600" />
Additional Information (Optional) Additional Information (Optional)
</h3> </h3>

View File

@ -12,8 +12,8 @@ function InterestSpecificStep({ formData, handleInputChange }) {
if (formData.interestCategory.includes('realEstateDeveloper')) { if (formData.interestCategory.includes('realEstateDeveloper')) {
fields.push( fields.push(
<div key="realEstateDeveloperFields" className="space-y-6 border-t pt-6 mt-6"> <div key="realEstateDeveloperFields" className="space-y-6 border-t border-border pt-6 mt-6">
<h4 className="text-lg font-semibold text-slate-800">Real Estate Developer Specifics</h4> <h4 className="text-lg font-semibold text-foreground">Real Estate Developer Specifics</h4>
<div className="space-y-2"> <div className="space-y-2">
<Label htmlFor="propertyType">Property Type and Size</Label> <Label htmlFor="propertyType">Property Type and Size</Label>
<Input id="propertyType" placeholder="e.g., Residential, Commercial, Industrial; 1000 sq ft" value={formData.propertyType} onChange={(e) => handleInputChange('propertyType', e.target.value)} /> <Input id="propertyType" placeholder="e.g., Residential, Commercial, Industrial; 1000 sq ft" value={formData.propertyType} onChange={(e) => handleInputChange('propertyType', e.target.value)} />
@ -36,8 +36,8 @@ function InterestSpecificStep({ formData, handleInputChange }) {
if (formData.interestCategory.includes('government')) { if (formData.interestCategory.includes('government')) {
fields.push( fields.push(
<div key="governmentFields" className="space-y-6 border-t pt-6 mt-6"> <div key="governmentFields" className="space-y-6 border-t border-border pt-6 mt-6">
<h4 className="text-lg font-semibold text-slate-800">Government/Public Sector Specifics</h4> <h4 className="text-lg font-semibold text-foreground">Government/Public Sector Specifics</h4>
<div className="space-y-2"> <div className="space-y-2">
<Label htmlFor="jurisdiction">Jurisdiction and Regulatory Requirements</Label> <Label htmlFor="jurisdiction">Jurisdiction and Regulatory Requirements</Label>
<Input id="jurisdiction" placeholder="e.g., National, State, Local; Data sovereignty laws" value={formData.jurisdiction} onChange={(e) => handleInputChange('jurisdiction', e.target.value)} /> <Input id="jurisdiction" placeholder="e.g., National, State, Local; Data sovereignty laws" value={formData.jurisdiction} onChange={(e) => handleInputChange('jurisdiction', e.target.value)} />
@ -60,8 +60,8 @@ function InterestSpecificStep({ formData, handleInputChange }) {
if (formData.interestCategory.includes('enterprise')) { if (formData.interestCategory.includes('enterprise')) {
fields.push( fields.push(
<div key="enterpriseFields" className="space-y-6 border-t pt-6 mt-6"> <div key="enterpriseFields" className="space-y-6 border-t border-border pt-6 mt-6">
<h4 className="text-lg font-semibold text-slate-800">Enterprise Customer Specifics</h4> <h4 className="text-lg font-semibold text-foreground">Enterprise Customer Specifics</h4>
<div className="space-y-2"> <div className="space-y-2">
<Label htmlFor="currentInfrastructure">Current Infrastructure and Pain Points</Label> <Label htmlFor="currentInfrastructure">Current Infrastructure and Pain Points</Label>
<Textarea id="currentInfrastructure" placeholder="Describe your current cloud setup and challenges" value={formData.currentInfrastructure} onChange={(e) => handleInputChange('currentInfrastructure', e.target.value)} rows={3} /> <Textarea id="currentInfrastructure" placeholder="Describe your current cloud setup and challenges" value={formData.currentInfrastructure} onChange={(e) => handleInputChange('currentInfrastructure', e.target.value)} rows={3} />
@ -84,8 +84,8 @@ function InterestSpecificStep({ formData, handleInputChange }) {
if (formData.interestCategory.includes('telecom')) { if (formData.interestCategory.includes('telecom')) {
fields.push( fields.push(
<div key="telecomFields" className="space-y-6 border-t pt-6 mt-6"> <div key="telecomFields" className="space-y-6 border-t border-border pt-6 mt-6">
<h4 className="text-lg font-semibold text-slate-800">Telecom/ISP Specifics</h4> <h4 className="text-lg font-semibold text-foreground">Telecom/ISP Specifics</h4>
<div className="space-y-2"> <div className="space-y-2">
<Label htmlFor="networkCoverage">Network Coverage and Infrastructure</Label> <Label htmlFor="networkCoverage">Network Coverage and Infrastructure</Label>
<Textarea id="networkCoverage" placeholder="Describe your existing network assets" value={formData.networkCoverage} onChange={(e) => handleInputChange('networkCoverage', e.target.value)} rows={3} /> <Textarea id="networkCoverage" placeholder="Describe your existing network assets" value={formData.networkCoverage} onChange={(e) => handleInputChange('networkCoverage', e.target.value)} rows={3} />
@ -108,13 +108,13 @@ function InterestSpecificStep({ formData, handleInputChange }) {
if (formData.interestCategory.includes('investor')) { if (formData.interestCategory.includes('investor')) {
fields.push( fields.push(
<div key="investorFields" className="space-y-6 border-t pt-6 mt-6"> <div key="investorFields" className="space-y-6 border-t border-border pt-6 mt-6">
<h4 className="text-lg font-semibold text-slate-800">Investor/Partner Specifics</h4> <h4 className="text-lg font-semibold text-foreground">Investor/Partner Specifics</h4>
<div className="space-y-2"> <div className="space-y-2">
<Label htmlFor="investmentRange">Investment Range of Interest</Label> <Label htmlFor="investmentRange">Investment Range of Interest</Label>
<select <select
id="investmentRange" id="investmentRange"
className="w-full p-3 border border-slate-300 rounded-md focus:ring-2 focus:ring-blue-500 focus:border-blue-500" className="w-full p-3 border border-input bg-background text-foreground rounded-md focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
value={formData.investmentRange} value={formData.investmentRange}
onChange={(e) => handleInputChange('investmentRange', e.target.value)} onChange={(e) => handleInputChange('investmentRange', e.target.value)}
> >
@ -155,8 +155,8 @@ function InterestSpecificStep({ formData, handleInputChange }) {
if (formData.interestCategory.includes('individual')) { if (formData.interestCategory.includes('individual')) {
fields.push( fields.push(
<div key="individualFields" className="space-y-6 border-t pt-6 mt-6"> <div key="individualFields" className="space-y-6 border-t border-border pt-6 mt-6">
<h4 className="text-lg font-semibold text-slate-800">Individual/Community Specifics</h4> <h4 className="text-lg font-semibold text-foreground">Individual/Community Specifics</h4>
<div className="space-y-2"> <div className="space-y-2">
<Label htmlFor="location">Location and Connectivity</Label> <Label htmlFor="location">Location and Connectivity</Label>
<Input id="location" placeholder="City, Country; Internet speed" value={formData.location} onChange={(e) => handleInputChange('location', e.target.value)} /> <Input id="location" placeholder="City, Country; Internet speed" value={formData.location} onChange={(e) => handleInputChange('location', e.target.value)} />
@ -165,7 +165,7 @@ function InterestSpecificStep({ formData, handleInputChange }) {
<Label htmlFor="technicalComfortLevel">Technical Comfort Level</Label> <Label htmlFor="technicalComfortLevel">Technical Comfort Level</Label>
<select <select
id="technicalComfortLevel" id="technicalComfortLevel"
className="w-full p-3 border border-slate-300 rounded-md focus:ring-2 focus:ring-blue-500 focus:border-blue-500" className="w-full p-3 border border-input bg-background text-foreground rounded-md focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
value={formData.technicalComfortLevel} value={formData.technicalComfortLevel}
onChange={(e) => handleInputChange('technicalComfortLevel', e.target.value)} onChange={(e) => handleInputChange('technicalComfortLevel', e.target.value)}
> >
@ -191,9 +191,9 @@ function InterestSpecificStep({ formData, handleInputChange }) {
} }
return ( return (
<section className="py-16 px-4 sm:px-6 lg:px-8 bg-gradient-to-br from-blue-50 to-green-50"> <section className="py-16 px-4 sm:px-6 lg:px-8 bg-background">
<div className="max-w-4xl mx-auto"> <div className="max-w-4xl mx-auto">
<Card className="bg-white shadow-xl"> <Card className="bg-card text-card-foreground shadow-xl">
<CardHeader> <CardHeader>
<CardTitle className="text-2xl text-center">Specific Requirements for {formData.interestCategory.map(cat => cat.replace(/([A-Z])/g, ' $1').replace(/^./, str => str.toUpperCase())).join(', ')}</CardTitle> <CardTitle className="text-2xl text-center">Specific Requirements for {formData.interestCategory.map(cat => cat.replace(/([A-Z])/g, ' $1').replace(/^./, str => str.toUpperCase())).join(', ')}</CardTitle>
<CardDescription className="text-center text-lg"> <CardDescription className="text-center text-lg">

View File

@ -197,7 +197,7 @@ function RegisterPage() {
} }
return ( return (
<div className="min-h-screen bg-gradient-to-br from-slate-50 to-blue-50 dark:from-gray-950 dark:to-blue-950"> <div className="min-h-screen bg-background">
{/* Navigation */} {/* Navigation */}
<Navigation /> <Navigation />
@ -205,10 +205,10 @@ function RegisterPage() {
<section className="pt-24 pb-16 px-4 sm:px-6 lg:px-8"> <section className="pt-24 pb-16 px-4 sm:px-6 lg:px-8">
<div className="max-w-3xl mx-auto text-center space-y-8"> <div className="max-w-3xl mx-auto text-center space-y-8">
<Badge className="bg-blue-100 text-blue-800 hover:bg-blue-200">Join the Revolution</Badge> <Badge className="bg-blue-100 text-blue-800 hover:bg-blue-200">Join the Revolution</Badge>
<h1 className="text-4xl md:text-6xl font-bold text-slate-900 dark:text-white leading-tight"> <h1 className="text-4xl md:text-6xl font-bold text-foreground leading-tight">
Ready to Transform Your <span className="text-blue-600">Infrastructure?</span> Ready to Transform Your <span className="text-blue-600">Infrastructure?</span>
</h1> </h1>
<p className="text-xl text-slate-600 dark:text-gray-300 leading-relaxed max-w-3xl mx-auto"> <p className="text-xl text-muted-foreground leading-relaxed max-w-3xl mx-auto">
Join the growing network of forward-thinking organizations building the future of decentralized digital infrastructure. From single nodes to regional grids, we'll help you deploy sovereign, profitable, and resilient datacenter solutions. Join the growing network of forward-thinking organizations building the future of decentralized digital infrastructure. From single nodes to regional grids, we'll help you deploy sovereign, profitable, and resilient datacenter solutions.
</p> </p>
</div> </div>
@ -247,10 +247,10 @@ function RegisterPage() {
</div> </div>
{/* What Happens Next */} {/* What Happens Next */}
<section className="py-16 px-4 sm:px-6 lg:px-8 bg-white dark:bg-gray-900"> <section className="py-16 px-4 sm:px-6 lg:px-8 bg-background">
<div className="max-w-6xl mx-auto"> <div className="max-w-6xl mx-auto">
<div className="text-center space-y-8 mb-16"> <div className="text-center space-y-8 mb-16">
<h2 className="text-3xl md:text-4xl font-bold text-slate-900 dark:text-white">What Happens After You Submit?</h2> <h2 className="text-3xl md:text-4xl font-bold text-foreground">What Happens After You Submit?</h2>
</div> </div>
<div className="grid md:grid-cols-3 gap-8"> <div className="grid md:grid-cols-3 gap-8">
@ -297,7 +297,7 @@ function RegisterPage() {
<section className="py-16 px-4 sm:px-6 lg:px-8 bg-gradient-to-br from-blue-50 to-purple-50 dark:from-blue-950 dark:to-purple-950"> <section className="py-16 px-4 sm:px-6 lg:px-8 bg-gradient-to-br from-blue-50 to-purple-50 dark:from-blue-950 dark:to-purple-950">
<div className="max-w-4xl mx-auto"> <div className="max-w-4xl mx-auto">
<div className="text-center space-y-8 mb-12"> <div className="text-center space-y-8 mb-12">
<h2 className="text-3xl md:text-4xl font-bold text-slate-900 dark:text-white">Common Questions</h2> <h2 className="text-3xl md:text-4xl font-bold text-foreground">Common Questions</h2>
</div> </div>
<div className="space-y-6"> <div className="space-y-6">
<Card className="hover:shadow-lg transition-shadow"> <Card className="hover:shadow-lg transition-shadow">
@ -325,9 +325,9 @@ function RegisterPage() {
</section> </section>
{/* Social Proof & Urgency */} {/* Social Proof & Urgency */}
<section className="py-16 px-4 sm:px-6 lg:px-8 bg-white dark:bg-gray-900"> <section className="py-16 px-4 sm:px-6 lg:px-8 bg-background">
<div className="max-w-4xl mx-auto text-center space-y-8"> <div className="max-w-4xl mx-auto text-center space-y-8">
<h2 className="text-3xl md:text-4xl font-bold text-slate-900 dark:text-white">Join Leading Organizations Already Building the Future</h2> <h2 className="text-3xl md:text-4xl font-bold text-foreground">Join Leading Organizations Already Building the Future</h2>
<div className="grid md:grid-cols-2 gap-8"> <div className="grid md:grid-cols-2 gap-8">
<Card className="text-center hover:shadow-lg transition-shadow"> <Card className="text-center hover:shadow-lg transition-shadow">
<CardHeader><CardTitle className="text-blue-600">70+ countries with active infrastructure</CardTitle></CardHeader> <CardHeader><CardTitle className="text-blue-600">70+ countries with active infrastructure</CardTitle></CardHeader>
@ -346,7 +346,7 @@ function RegisterPage() {
<CardContent>Empowering local digital infrastructure.</CardContent> <CardContent>Empowering local digital infrastructure.</CardContent>
</Card> </Card>
</div> </div>
<p className="text-lg text-slate-600 dark:text-gray-300 mt-8"> <p className="text-lg text-muted-foreground mt-8">
Limited Availability: Priority access for early partners, exclusive pricing for first deployments, limited technical support capacity, growing demand for deployment slots. Limited Availability: Priority access for early partners, exclusive pricing for first deployments, limited technical support capacity, growing demand for deployment slots.
</p> </p>
<p className="text-xl font-bold text-blue-600 mt-4">Don't Wait - The Future is Being Built Now</p> <p className="text-xl font-bold text-blue-600 mt-4">Don't Wait - The Future is Being Built Now</p>
@ -354,14 +354,14 @@ function RegisterPage() {
</section> </section>
{/* Footer */} {/* Footer */}
<footer className="py-8 px-4 sm:px-6 lg:px-8 bg-slate-900 text-white dark:bg-gray-950 dark:text-gray-200"> <footer className="py-8 px-4 sm:px-6 lg:px-8 bg-background text-foreground">
<div className="max-w-6xl mx-auto text-center"> <div className="max-w-6xl mx-auto text-center">
<div className="flex items-center justify-center space-x-2 mb-4"> <div className="flex items-center justify-center space-x-2 mb-4">
<Globe className="h-6 w-6 text-blue-400" /> <Globe className="h-6 w-6 text-blue-400" />
<span className="text-xl font-bold">ThreeFold Galaxy</span> <span className="text-xl font-bold">ThreeFold Galaxy</span>
</div> </div>
<p className="text-slate-400 dark:text-gray-400">Building the new internet, together in our sovereign digital freezone.</p> <p className="text-muted-foreground">Building the new internet, together in our sovereign digital freezone.</p>
<p className="text-sm text-slate-500 dark:text-gray-500 mt-4">© 2025 ThreeFold Galaxy. A new era of decentralized infrastructure.</p> <p className="text-sm text-muted-foreground mt-4">© 2025 ThreeFold Galaxy. A new era of decentralized infrastructure.</p>
</div> </div>
</footer> </footer>
</div> </div>

View File

@ -8,18 +8,18 @@ function Step1Form({ formData, handleInputChange, formError }) {
return ( return (
<> <>
{/* How Do You Want to Get Involved? */} {/* How Do You Want to Get Involved? */}
<section className="py-16 px-4 sm:px-6 lg:px-8 bg-white"> <section className="py-16 px-4 sm:px-6 lg:px-8 bg-background">
<div className="max-w-6xl mx-auto"> <div className="max-w-6xl mx-auto">
<div className="text-center space-y-8 mb-12"> <div className="text-center space-y-8 mb-12">
<h2 className="text-3xl md:text-4xl font-bold text-slate-900">How Do You Want to Get Involved?</h2> <h2 className="text-3xl md:text-4xl font-bold text-foreground">How Do You Want to Get Involved?</h2>
</div> </div>
{formError && ( {formError && (
<div className="flex items-center gap-2 p-4 bg-red-50 border border-red-200 rounded-lg text-red-800 mb-8"> <div className="flex items-center gap-2 p-4 bg-red-50 border border-red-200 rounded-lg text-red-800 dark:bg-red-950 dark:border-red-700 dark:text-red-200 mb-8">
<AlertCircle className="h-5 w-5" /> <AlertCircle className="h-5 w-5" />
<span>{formError}</span> <span>{formError}</span>
</div> </div>
)} )}
<p className="text-lg text-slate-700 mb-8 text-center flex items-center justify-center gap-2"> <p className="text-lg text-muted-foreground mb-8 text-center flex items-center justify-center gap-2">
<ArrowRight className="h-6 w-6 text-blue-600" /> <span className="font-bold">Please select one or more categories below that best describe your interest to reveal specific questions.</span> <ArrowRight className="h-6 w-6 text-blue-600" /> <span className="font-bold">Please select one or more categories below that best describe your interest to reveal specific questions.</span>
</p> </p>
<div className="grid md:grid-cols-2 lg:grid-cols-3 gap-8"> <div className="grid md:grid-cols-2 lg:grid-cols-3 gap-8">
@ -100,9 +100,9 @@ function Step1Form({ formData, handleInputChange, formError }) {
</section> </section>
{/* Contact Form - General Information */} {/* Contact Form - General Information */}
<section className="py-16 px-4 sm:px-6 lg:px-8 bg-gradient-to-br from-blue-50 to-green-50"> <section className="py-16 px-4 sm:px-6 lg:px-8 bg-background">
<div className="max-w-4xl mx-auto"> <div className="max-w-4xl mx-auto">
<Card className="bg-white shadow-xl"> <Card className="bg-card text-card-foreground shadow-xl">
<CardHeader> <CardHeader>
<CardTitle className="text-2xl text-center">Your Contact Details</CardTitle> <CardTitle className="text-2xl text-center">Your Contact Details</CardTitle>
<CardDescription className="text-center text-lg"> <CardDescription className="text-center text-lg">