...
This commit is contained in:
parent
aaca5f6d6c
commit
26752c8b03
3
build.sh
3
build.sh
@ -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/
|
@ -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>
|
||||||
|
@ -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} />
|
||||||
)
|
)
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
|
@ -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>
|
||||||
|
@ -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">
|
||||||
|
@ -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>
|
||||||
|
@ -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">
|
||||||
|
Loading…
Reference in New Issue
Block a user