This commit is contained in:
Lucas
2026-05-30 09:51:13 +10:00
parent 6ee42de45b
commit b8d80ab85d
73 changed files with 2706 additions and 1251 deletions

View File

@@ -1,134 +1,105 @@
<script setup> <script setup>
import { RouterLink } from "vue-router" import { RouterLink } from 'vue-router'
import { Github, Heart } from "lucide-vue-next" import { Github, Heart, Shield, Boxes } from 'lucide-vue-next'
const currentYear = new Date().getFullYear() const currentYear = new Date().getFullYear()
</script> </script>
<template> <template>
<footer class="border-t border-border bg-card justify-center text-center"> <footer class="border-t border-border bg-card">
<div class="container mx-auto py-12 px-2">
<div class="grid grid-cols-1 md:grid-cols-5 gap-8"> <div class="container mx-auto py-16">
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-12">
<!-- Brand --> <!-- Brand -->
<div> <div class="lg:col-span-1">
<div class="flex items-center gap-2 mb-4">
<div class="h-8 w-8 rounded-lg bg-primary flex items-center justify-center"> <RouterLink to="/" class="flex items-center gap-3 mb-5">
<div class="h-4 w-4 rounded-full border-2 border-primary-foreground" /> <div class="h-9 w-9 rounded-xl bg-primary flex items-center justify-center">
<div class="h-4 w-4 rounded-full border-2 border-primary-foreground"></div>
</div> </div>
<h1 class="leading-none font-bold text-lg">
<h1 class="font-bold text-lg">
<span class="text-yellow-400">No</span> <span class="text-yellow-400">No</span>
<span class="text-foreground">Sys</span> <span class="text-foreground">Sys</span>
</h1> </h1>
</div> </RouterLink>
<p class="text-sm text-muted-foreground">
Infrastructure for a Decentralized Future. <p class="text-sm text-muted-foreground leading-relaxed">
Open peer-to-peer infrastructure for modular decentralized systems.
</p> </p>
<div class="flex items-center gap-4 mt-6">
<a href="https://github.com" target="_blank" class="text-muted-foreground hover:text-foreground">
<Github class="h-5 w-5" />
</a>
<RouterLink to="/contribute" class="text-muted-foreground hover:text-foreground">
<Heart class="h-5 w-5" />
</RouterLink>
</div>
</div> </div>
<!-- Product --> <!-- Product -->
<div> <div>
<h3 class="font-semibold mb-4">Product</h3> <h3 class="font-semibold mb-5">Product</h3>
<ul class="space-y-3"> <ul class="space-y-3">
<li> <li><RouterLink to="/modules" class="footer-link">Modules</RouterLink></li>
<RouterLink to="/about" class="text-sm text-muted-foreground hover:text-foreground transition-colors"> <li><RouterLink to="/downloads" class="footer-link">Downloads</RouterLink></li>
About <li><RouterLink to="/about" class="footer-link">About</RouterLink></li>
</RouterLink>
</li>
<li>
<RouterLink to="/how-it-works" class="text-sm text-muted-foreground hover:text-foreground transition-colors">
How It Works
</RouterLink>
</li>
<li>
<RouterLink to="/downloads" class="text-sm text-muted-foreground hover:text-foreground transition-colors">
Downloads
</RouterLink>
</li>
</ul> </ul>
</div> </div>
<!-- Resources --> <!-- Builders -->
<div> <div>
<h3 class="font-semibold mb-4">Resources</h3> <h3 class="font-semibold mb-5">Developers</h3>
<ul class="space-y-3"> <ul class="space-y-3">
<li> <li><RouterLink to="/docs" class="footer-link">Documentation</RouterLink></li>
<RouterLink to="/documentation" class="text-sm text-muted-foreground hover:text-foreground transition-colors"> <li><RouterLink to="/architecture" class="footer-link">Architecture</RouterLink></li>
Documentation <li><RouterLink to="/blog" class="footer-link">Blog</RouterLink></li>
</RouterLink>
</li>
<li>
<RouterLink to="/blog" class="text-sm text-muted-foreground hover:text-foreground transition-colors">
Blog
</RouterLink>
</li>
<li>
<RouterLink to="/support" class="text-sm text-muted-foreground hover:text-foreground transition-colors">
Support
</RouterLink>
</li>
</ul>
</div>
<!-- Legal -->
<div>
<h3 class="font-semibold mb-4">Legal</h3>
<ul class="space-y-3">
<li>
<RouterLink to="/privacy" class="text-sm text-muted-foreground hover:text-foreground transition-colors">
Privacy Policy
</RouterLink>
</li>
<li>
<RouterLink to="/license" class="text-sm text-muted-foreground hover:text-foreground transition-colors">
Open Source License
</RouterLink>
</li>
</ul> </ul>
</div> </div>
<!-- Community --> <!-- Community -->
<div> <div>
<h3 class="font-semibold mb-4">Community</h3> <h3 class="font-semibold mb-5">Community</h3>
<ul class="space-y-3"> <ul class="space-y-3">
<li><RouterLink to="/community" class="footer-link">Community Hub</RouterLink></li>
<li><RouterLink to="/help" class="footer-link">Help</RouterLink></li>
<li><RouterLink to="/contribute" class="footer-link">Contribute</RouterLink></li>
<li> <li>
<RouterLink to="/community" class="text-sm text-muted-foreground hover:text-foreground transition-colors"> <RouterLink to="/security" class="footer-link flex items-center gap-2">
Other plataforms <Shield class="h-4 w-4" />
Security
</RouterLink> </RouterLink>
</li> </li>
<li>
<RouterLink
to="/community#donate"
class="text-sm text-muted-foreground hover:text-foreground transition-colors items-center gap-2"
>
<div class="flex items-center gap-2 mb-4 justify-center">
<Heart class="h-4 w-4 flex" />
Donate
</div>
</RouterLink>
</li>
<li>
<div >
<a
href="https://github.com"
target="_blank"
rel="noopener noreferrer"
class="text-sm text-muted-foreground hover:text-foreground transition-colors gap-2 flex flex-row justify-center items-center"
>
<Github class="h-4 w-4" />
GitHub
</a>
</div>
</li>
</ul> </ul>
</div> </div>
</div> </div>
<div class="mt-8 pt-8 flex flex-col md:flex-row justify-between items-center text-sm text-muted-foreground gap-2 justify-center text-center"> <!-- Bottom -->
<p>© {{ currentYear }} NoSys.</p> <div class="mt-16 pt-8 border-t border-border flex flex-col md:flex-row justify-between gap-4">
<p>Open source and decentralized.</p>
<p class="text-sm text-muted-foreground">
© {{ currentYear }} NoSys. Open source infrastructure for decentralized systems.
</p>
<div class="flex items-center gap-6 text-sm text-muted-foreground">
<RouterLink to="/faq" class="hover:text-foreground">FAQ</RouterLink>
<div class="flex items-center gap-2">
<Boxes class="h-4 w-4" />
Modular Runtime
</div>
</div>
</div> </div>
</div> </div>
</footer> </footer>
</template> </template>

View File

@@ -2,89 +2,146 @@
import { ref } from 'vue' import { ref } from 'vue'
import { RouterLink } from 'vue-router' import { RouterLink } from 'vue-router'
import { Menu, X } from 'lucide-vue-next' import { Menu, X } from 'lucide-vue-next'
import Button from '@/components/ui/Button.vue' import Button from '@/components/ui/Button.vue'
import ThemeToggleButton from './ui/ThemeToggleButton.vue' import ThemeToggleButton from './ui/ThemeToggleButton.vue'
const mobileMenuOpen = ref(false) const mobileMenuOpen = ref(false)
const navLinks = [ /**
{ href: "/", label: "Home" }, * USER-FACING (simple, adoption-focused)
{ href: "/about", label: "About" }, */
{ href: "/how-it-works", label: "How It Works" }, const primaryLinks = [
{ href: "/downloads", label: "Downloads" }, { href: '/', label: 'Home' },
{ href: "/documentation", label: "Docs" }, { href: '/modules', label: 'Modules' },
{ href: "/community", label: "Community" }, { href: '/downloads', label: 'Downloads' },
{ href: "/blog", label: "Blog" },
{ href: "/support", label: "Support" },
] ]
/**
* BUILDER / TECH (optional depth)
*/
const secondaryLinks = [
{ href: '/docs', label: 'Docs' },
{ href: '/architecture', label: 'Architecture' },
{ href: '/blog', label: 'Blog' },
]
/**
* COMMUNITY / ACTION
*/
const actionLinks = [
{ href: '/community', label: 'Community' },
{ href: '/help', label: 'Help' },
{ href: '/contribute', label: 'Contribute' },
]
</script> </script>
<template> <template>
<header <header class="sticky top-0 z-50 w-full border-b border-border/40 bg-background/90 backdrop-blur-xl">
class="sticky top-0 z-50 w-screen border-b border-border/40 bg-background/95 backdrop-blur supports-backdrop-filter:bg-background/60"
> <div class="container mx-auto h-16 flex items-center justify-between gap-6">
<div class="container mx-auto flex h-16 items-center justify-between gap-4">
<RouterLink to="/" class="flex items-center gap-2"> <!-- Brand -->
<div class="h-8 w-8 rounded-lg bg-primary flex items-center justify-center"> <RouterLink to="/" class="flex items-center gap-3 shrink-0">
<div class="h-4 w-4 rounded-full border-2 border-primary-foreground" /> <div class="h-9 w-9 rounded-xl bg-primary flex items-center justify-center">
<div class="h-4 w-4 rounded-full border-2 border-primary-foreground"></div>
</div> </div>
<h1 class="leading-none font-bold text-lg">
<h1 class="font-bold text-lg">
<span class="text-yellow-400">No</span> <span class="text-yellow-400">No</span>
<span class="text-foreground">Sys</span> <span class="text-foreground">Sys</span>
</h1> </h1>
</RouterLink> </RouterLink>
<!-- Desktop Navigation --> <!-- Desktop Nav -->
<nav class="hidden md:flex items-center gap-4"> <div class="hidden lg:flex items-center gap-10 flex-1">
<RouterLink
v-for="link in navLinks" <!-- Primary -->
:key="link.href" <nav class="flex items-center gap-6">
:to="link.href" <RouterLink
class="text-sm font-medium text-muted-foreground hover:text-foreground transition-colors" v-for="link in primaryLinks"
> :key="link.href"
{{ link.label }} :to="link.href"
</RouterLink> class="text-sm font-medium text-muted-foreground hover:text-foreground transition-colors"
</nav> >
{{ link.label }}
</RouterLink>
</nav>
<!-- Secondary -->
<nav class="flex items-center gap-5 ml-auto">
<RouterLink
v-for="link in secondaryLinks"
:key="link.href"
:to="link.href"
class="text-sm text-muted-foreground hover:text-foreground transition-colors"
>
{{ link.label }}
</RouterLink>
<span class="text-muted-foreground">|</span>
<RouterLink
v-for="link in actionLinks"
:key="link.href"
:to="link.href"
class="text-sm text-muted-foreground hover:text-foreground transition-colors"
>
{{ link.label }}
</RouterLink>
</nav>
<div class="hidden md:flex items-center gap-4">
<Button>
<RouterLink to="/downloads">Download</RouterLink>
</Button>
</div> </div>
<ThemeToggleButton class="hidden md:flex mr-5"></ThemeToggleButton> <!-- Actions -->
<div class="hidden lg:flex items-center gap-3">
<!-- Mobile Menu Button --> <ThemeToggleButton />
<button
class="md:hidden pr-4"
@click="mobileMenuOpen = !mobileMenuOpen"
aria-label="Toggle menu"
>
<X v-if="mobileMenuOpen" class="h-6 w-6" />
<Menu v-else class="h-6 w-6"></Menu>
</button>
</div>
<!-- Mobile Navigation --> <RouterLink to="/downloads">
<div v-if="mobileMenuOpen" class="md:hidden border-t border-border"> <Button class="bg-amber-400 hover:bg-amber-500 text-black">
<nav class="container mx-auto py-4 flex flex-col gap-4 text-center justify-center items-center"> Download noSys
<RouterLink </Button>
v-for="link in navLinks"
:key="link.href"
:to="link.href"
class="text-sm font-medium text-muted-foreground hover:text-foreground transition-colors"
@click="mobileMenuOpen = false"
>
{{ link.label }}
</RouterLink> </RouterLink>
<Button class="w-full"> </div>
<RouterLink to="/downloads">Download</RouterLink>
</Button> <!-- Mobile -->
<button class="lg:hidden" @click="mobileMenuOpen = !mobileMenuOpen">
<X v-if="mobileMenuOpen" class="h-6 w-6" />
<Menu v-else class="h-6 w-6" />
</button>
</div>
<!-- Mobile Menu -->
<div v-if="mobileMenuOpen" class="lg:hidden border-t border-border">
<nav class="container mx-auto py-6 flex flex-col gap-6">
<div class="space-y-4">
<RouterLink
v-for="link in [...primaryLinks, ...secondaryLinks, ...actionLinks]"
:key="link.href"
:to="link.href"
class="block text-sm font-medium text-muted-foreground hover:text-foreground"
@click="mobileMenuOpen = false"
>
{{ link.label }}
</RouterLink>
</div>
<RouterLink to="/downloads" @click="mobileMenuOpen = false">
<Button class="w-full bg-amber-400 hover:bg-amber-500 text-black">
Download noSys
</Button>
</RouterLink>
<ThemeToggleButton />
<ThemeToggleButton></ThemeToggleButton>
</nav> </nav>
</div> </div>
</header> </header>
</template> </template>

View File

@@ -1,52 +1,39 @@
<script setup> <script setup>
import Button from '@/components/ui/Button.vue'
import { RouterLink } from 'vue-router' import { RouterLink } from 'vue-router'
import Button from '@/components/ui/Button.vue'
</script> </script>
<template> <template>
<section class="container py-24">
<section> <div class="max-w-4xl mx-auto text-center space-y-8">
<div class="container py-24"> <h2 class="text-4xl md:text-5xl font-bold text-balance">
Explore the NoSys Ecosystem
</h2>
<div class="max-w-3xl mx-auto text-center space-y-6"> <p class="text-xl text-muted-foreground leading-relaxed">
Download NoSys, explore decentralized applications,
or learn how the platform works.
</p>
<h2 class="text-3xl md:text-4xl font-bold"> <div class="flex flex-col sm:flex-row gap-4 justify-center">
Explore the Platform
</h2>
<p class="text-xl text-muted-foreground"> <RouterLink to="/downloads">
Build decentralized systems, experiment with peer-to-peer infrastructure, <Button size="lg" class="bg-amber-400 hover:bg-amber-500 text-black px-8">
and participate in the future of open networks. Download NoSys
</p> </Button>
</RouterLink>
<div class="flex flex-col sm:flex-row gap-4 justify-center"> <RouterLink to="/how-it-works">
<Button size="lg" variant="outline" class="px-8">
<RouterLink to="/downloads"> Learn How It Works
<Button </Button>
size="lg" </RouterLink>
class="bg-amber-400 hover:bg-amber-500 text-black"
>
Download
</Button>
</RouterLink>
<RouterLink to="/docs">
<Button
size="lg"
variant="outline"
class="hover:text-amber-500"
>
Documentation
</Button>
</RouterLink>
</div>
</div> </div>
</div> </div>
</section> </section>
</template> </template>

View File

@@ -0,0 +1,31 @@
<template>
<section class="container py-24">
<div class="max-w-4xl mx-auto text-center space-y-8">
<h2 class="text-3xl md:text-5xl font-bold text-balance">
Exploring the Future of Decentralized Systems
</h2>
<div class="space-y-6 text-lg text-muted-foreground leading-relaxed">
<p>
NoSys is an ongoing experiment in open digital infrastructure.
</p>
<p>
The project explores how peer-to-peer systems,
modular ecosystems, distributed communication,
and community-driven development can support a more resilient internet.
</p>
<p>
Social networks are only one possible application.
The long-term vision is broader:
decentralized ecosystems capable of supporting many forms of digital interaction.
</p>
</div>
</div>
</section>
</template>

View File

@@ -3,28 +3,30 @@ import DotsMouse from '@/components/ui/canvas/DotsMouse.vue'
</script> </script>
<template> <template>
<section class="container py-24 md:py-32 lg:py-40">
<section class="container py-24 md:py-32 text-center"> <div class="max-w-5xl mx-auto text-center space-y-8">
<div class="max-w-4xl mx-auto text-center"> <div
class="inline-flex items-center gap-2 px-4 py-2 rounded-full border border-primary/20 bg-primary/10 text-primary text-sm"
<div class="inline-flex items-center px-3 py-1 text-sm rounded-full border border-border mb-6"> >
Open Infrastructure for Decentralized Systems About NoSys
</div> </div>
<h1 class="text-4xl md:text-5xl lg:text-6xl font-bold mb-6 text-balance"> <div class="space-y-6">
Technology Should Belong to Its Users <h1 class="text-4xl md:text-5xl lg:text-7xl font-bold tracking-tight text-balance leading-tight">
</h1> Infrastructure for a Decentralized Future
</h1>
<p class="text-xl text-muted-foreground leading-relaxed max-w-3xl mx-auto"> <p class="text-xl md:text-2xl text-muted-foreground leading-relaxed max-w-4xl mx-auto">
Modern digital infrastructure is increasingly controlled by centralized corporations and platforms. NoSys is an open-source peer-to-peer platform designed to reduce dependence
NoSys exists to provide an alternative: open, peer-to-peer infrastructure designed for decentralized systems and communities. on centralized digital infrastructure and give communities direct control
</p> over communication, applications, and networks.
</p>
</div>
</div> </div>
<DotsMouse /> <DotsMouse />
</section> </section>
</template> </template>

View File

@@ -0,0 +1,68 @@
<script setup>
import Card from '@/components/ui/Card.vue'
import CardContent from '@/components/ui/CardContent.vue'
const principles = [
{
title: 'Decentralization',
description: 'Reduce dependency on central infrastructure and concentrated control.'
},
{
title: 'Open Source',
description: 'Technology should be transparent, auditable, and collaborative.'
},
{
title: 'User Ownership',
description: 'People should control their identity, data, and applications.'
},
{
title: 'Modularity',
description: 'Applications and systems should remain replaceable and extensible.'
},
{
title: 'Community-Driven Innovation',
description: 'Infrastructure evolves through open ecosystems and collective development.'
},
{
title: 'Resilience',
description: 'Distributed systems reduce single points of failure and dependency.'
}
]
</script>
<template>
<section class="container py-24">
<div class="max-w-3xl mx-auto text-center mb-16">
<h2 class="text-3xl md:text-5xl font-bold mb-6">
Core Principles
</h2>
<p class="text-xl text-muted-foreground leading-relaxed">
NoSys is guided by architectural and social principles
focused on openness, resilience, and decentralization.
</p>
</div>
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
<Card
v-for="principle in principles"
:key="principle.title"
class="border-2"
>
<CardContent class="p-8 space-y-4">
<h3 class="text-2xl font-bold">
{{ principle.title }}
</h3>
<p class="text-muted-foreground leading-relaxed">
{{ principle.description }}
</p>
</CardContent>
</Card>
</div>
</section>
</template>

View File

@@ -0,0 +1,79 @@
<script setup>
import Card from '@/components/ui/Card.vue'
import CardContent from '@/components/ui/CardContent.vue'
import { AlertTriangle } from 'lucide-vue-next'
</script>
<template>
<section class="container py-24">
<div class="grid grid-cols-1 lg:grid-cols-2 gap-16 items-center">
<div>
<div
class="inline-flex items-center gap-2 px-4 py-2 rounded-full border border-destructive/20 bg-destructive/10 text-destructive text-sm mb-6"
>
<AlertTriangle class="h-4 w-4" />
The Centralization Problem
</div>
<h2 class="text-3xl md:text-5xl font-bold mb-8 text-balance">
The Internet Became Increasingly Centralized
</h2>
<div class="space-y-5 text-lg text-muted-foreground leading-relaxed">
<p>
Large platforms increasingly control communication,
identity, visibility, moderation, and user data.
</p>
<p>
Modern digital ecosystems often depend on centralized servers,
closed infrastructures, and corporate-controlled platforms.
</p>
<p>
As more of society becomes digital,
dependence on centralized infrastructure becomes a structural risk.
</p>
</div>
</div>
<Card class="border-2">
<CardContent class="p-8 space-y-8">
<div>
<h3 class="font-semibold text-lg mb-2">Platform Dependency</h3>
<p class="text-muted-foreground text-sm leading-relaxed">
Entire communities and applications depend on centralized services.
</p>
</div>
<div>
<h3 class="font-semibold text-lg mb-2">Single Points of Failure</h3>
<p class="text-muted-foreground text-sm leading-relaxed">
Infrastructure outages or policy changes affect millions simultaneously.
</p>
</div>
<div>
<h3 class="font-semibold text-lg mb-2">Closed Ecosystems</h3>
<p class="text-muted-foreground text-sm leading-relaxed">
Users often cannot control or verify the systems they depend on.
</p>
</div>
<div>
<h3 class="font-semibold text-lg mb-2">Data Concentration</h3>
<p class="text-muted-foreground text-sm leading-relaxed">
Massive centralized data collection creates power asymmetry.
</p>
</div>
</CardContent>
</Card>
</div>
</section>
</template>

View File

@@ -0,0 +1,80 @@
<script setup>
import Card from '@/components/ui/Card.vue'
import CardContent from '@/components/ui/CardContent.vue'
import { ShieldCheck } from 'lucide-vue-next'
</script>
<template>
<section class="container py-24">
<div class="grid grid-cols-1 lg:grid-cols-2 gap-16 items-center">
<Card class="border-2 order-2 lg:order-1">
<CardContent class="p-8 space-y-8">
<div>
<h3 class="font-semibold text-lg mb-2">Peer-to-Peer Networking</h3>
<p class="text-muted-foreground text-sm leading-relaxed">
Devices communicate directly instead of relying entirely on central servers.
</p>
</div>
<div>
<h3 class="font-semibold text-lg mb-2">Open Source Infrastructure</h3>
<p class="text-muted-foreground text-sm leading-relaxed">
Systems remain transparent, auditable, and community-driven.
</p>
</div>
<div>
<h3 class="font-semibold text-lg mb-2">Modular Ecosystem</h3>
<p class="text-muted-foreground text-sm leading-relaxed">
Applications can evolve independently without platform lock-in.
</p>
</div>
<div>
<h3 class="font-semibold text-lg mb-2">Distributed Coordination</h3>
<p class="text-muted-foreground text-sm leading-relaxed">
Networks can operate collaboratively without centralized ownership.
</p>
</div>
</CardContent>
</Card>
<div class="order-1 lg:order-2">
<div
class="inline-flex items-center gap-2 px-4 py-2 rounded-full border border-primary/20 bg-primary/10 text-primary text-sm mb-6"
>
<ShieldCheck class="h-4 w-4" />
The NoSys Approach
</div>
<h2 class="text-3xl md:text-5xl font-bold mb-8 text-balance">
Building Open Decentralized Infrastructure
</h2>
<div class="space-y-5 text-lg text-muted-foreground leading-relaxed">
<p>
NoSys provides peer-to-peer infrastructure that applications can build upon.
</p>
<p>
Instead of creating a single centralized platform,
NoSys focuses on enabling decentralized ecosystems.
</p>
<p class="text-foreground font-medium">
The goal is not to control the network.
The goal is to make control less necessary.
</p>
</div>
</div>
</div>
</section>
</template>

View File

@@ -1,124 +0,0 @@
<script setup>
import Card from '@/components/ui/Card.vue'
import CardContent from '@/components/ui/CardContent.vue'
import { AlertCircle } from 'lucide-vue-next'
</script>
<template>
<section class="bg-card">
<div class="container py-24">
<div class="grid grid-cols-1 lg:grid-cols-2 gap-12 items-center">
<div>
<div
class="inline-flex items-center gap-2 px-3 py-1 text-sm
bg-destructive/10 text-destructive rounded-full
border border-destructive/20 mb-6"
>
<AlertCircle class="h-4 w-4" />
The Centralization Problem
</div>
<h2 class="text-3xl md:text-4xl font-bold mb-6">
Critical Infrastructure Is Becoming Centralized
</h2>
<div class="space-y-4 text-muted-foreground leading-relaxed">
<p>
Communication, identity, discovery, distribution, and coordination are increasingly controlled by a small number of corporations and platforms.
</p>
<p>
As technology becomes more integrated into everyday life, centralized control over infrastructure creates structural dependency on entities users cannot govern or audit.
</p>
<p>
NoSys was created to explore a different direction:
decentralized systems where coordination happens directly between participants instead of through centralized intermediaries.
</p>
</div>
</div>
<Card class="border-2">
<CardContent class="p-8">
<div class="space-y-6">
<div class="flex items-start gap-4">
<div class="h-2 w-2 rounded-full bg-destructive mt-2" />
<div>
<h3 class="font-semibold mb-1">
Infrastructure Dependency
</h3>
<p class="text-sm text-muted-foreground">
Critical systems increasingly rely on centralized providers
</p>
</div>
</div>
<div class="flex items-start gap-4">
<div class="h-2 w-2 rounded-full bg-destructive mt-2" />
<div>
<h3 class="font-semibold mb-1">
Platform Control
</h3>
<p class="text-sm text-muted-foreground">
Access, visibility, and communication controlled by private entities
</p>
</div>
</div>
<div class="flex items-start gap-4">
<div class="h-2 w-2 rounded-full bg-destructive mt-2" />
<div>
<h3 class="font-semibold mb-1">
Data Concentration
</h3>
<p class="text-sm text-muted-foreground">
Massive amounts of user data aggregated into centralized systems
</p>
</div>
</div>
<div class="flex items-start gap-4">
<div class="h-2 w-2 rounded-full bg-destructive mt-2" />
<div>
<h3 class="font-semibold mb-1">
Single Points of Failure
</h3>
<p class="text-sm text-muted-foreground">
Centralized architecture creates systemic fragility
</p>
</div>
</div>
</div>
</CardContent>
</Card>
</div>
</div>
</section>
</template>

View File

@@ -1,37 +1,83 @@
<script setup> <script setup>
import Card from '@/components/ui/Card.vue'
import CardContent from '@/components/ui/CardContent.vue'
import { Globe, Network, Cpu } from 'lucide-vue-next'
</script> </script>
<template> <template>
<section class="container py-24">
<section> <div class="max-w-4xl mx-auto text-center mb-16">
<h2 class="text-3xl md:text-5xl font-bold mb-8 text-balance">
Technology Is Becoming Infrastructure
</h2>
<div class="container py-24"> <div class="space-y-6 text-lg text-muted-foreground leading-relaxed max-w-3xl mx-auto">
<p>
<div class="max-w-4xl mx-auto text-center space-y-8"> Communication, transportation, finance, media, identity,
and social interaction increasingly depend on digital systems.
<div class="inline-flex items-center px-3 py-1 text-sm rounded-full border border-border">
Long-Term Vision
</div>
<h2 class="text-3xl md:text-5xl font-bold text-balance">
Decentralization
</h2>
<p class="text-xl text-muted-foreground leading-relaxed">
Future systems may include communication networks, collaborative platforms,
autonomous machine coordination, distributed communities, and applications
that do not yet exist.
</p> </p>
<p class="text-lg text-muted-foreground leading-relaxed"> <p>
NoSys is designed as foundational infrastructure for that future When these systems are controlled by a small number of corporations
open, adaptable, and owned by no single corporation or institution. or centralized authorities, societies become dependent on entities
capable of controlling access, visibility, data, and participation.
</p> </p>
<p class="text-foreground font-medium">
NoSys exists to explore a different direction:
open infrastructure built by communities, for communities.
</p>
</div> </div>
</div> </div>
</section> <div class="grid grid-cols-1 md:grid-cols-3 gap-8">
<Card class="border-2">
<CardContent class="pt-8 space-y-4">
<div class="h-14 w-14 rounded-2xl bg-primary/10 flex items-center justify-center">
<Globe class="h-7 w-7 text-primary" />
</div>
<h3 class="text-2xl font-bold">Open Infrastructure</h3>
<p class="text-muted-foreground leading-relaxed">
Infrastructure should belong to ecosystems and communities,
not isolated corporate silos.
</p>
</CardContent>
</Card>
<Card class="border-2">
<CardContent class="pt-8 space-y-4">
<div class="h-14 w-14 rounded-2xl bg-primary/10 flex items-center justify-center">
<Network class="h-7 w-7 text-primary" />
</div>
<h3 class="text-2xl font-bold">Distributed Systems</h3>
<p class="text-muted-foreground leading-relaxed">
Decentralized architectures reduce dependency on single points
of control and failure.
</p>
</CardContent>
</Card>
<Card class="border-2">
<CardContent class="pt-8 space-y-4">
<div class="h-14 w-14 rounded-2xl bg-primary/10 flex items-center justify-center">
<Cpu class="h-7 w-7 text-primary" />
</div>
<h3 class="text-2xl font-bold">Community Innovation</h3>
<p class="text-muted-foreground leading-relaxed">
Anyone can build applications, protocols,
and new decentralized experiences.
</p>
</CardContent>
</Card>
</div>
</section>
</template> </template>

View File

@@ -0,0 +1,38 @@
<script setup>
import Button from '@/components/ui/Button.vue'
import { RouterLink } from 'vue-router'
</script>
<template>
<section class="container py-24">
<div class="max-w-4xl mx-auto text-center space-y-8">
<h2 class="text-4xl md:text-5xl font-bold">
Be Part of the Network Layer of the Future
</h2>
<p class="text-xl text-muted-foreground">
Join the community shaping decentralized infrastructure, applications, and ecosystems.
</p>
<div class="flex flex-col sm:flex-row gap-4 justify-center">
<RouterLink to="/downloads">
<Button class="bg-amber-400 hover:bg-amber-500 text-black px-8">
Download NoSys
</Button>
</RouterLink>
<RouterLink to="/documentation">
<Button variant="outline" class="px-8">
Explore Documentation
</Button>
</RouterLink>
</div>
</div>
</section>
</template>

View File

@@ -0,0 +1,50 @@
<template>
<section class="container py-24">
<div class="max-w-4xl mx-auto text-center space-y-6">
<h2 class="text-3xl md:text-4xl font-bold">
How People Contribute
</h2>
<p class="text-lg text-muted-foreground">
You dont need to be a developer to contribute to NoSys.
The ecosystem grows through ideas, feedback, modules, and testing.
</p>
<div class="grid grid-cols-1 md:grid-cols-2 gap-6 text-left mt-10">
<div class="p-6 border rounded-lg bg-card">
<h3 class="font-bold mb-2">Feedback & Ideas</h3>
<p class="text-sm text-muted-foreground">
Help shape the direction of the ecosystem.
</p>
</div>
<div class="p-6 border rounded-lg bg-card">
<h3 class="font-bold mb-2">Testing & Usage</h3>
<p class="text-sm text-muted-foreground">
Use NoSys and report real-world behavior.
</p>
</div>
<div class="p-6 border rounded-lg bg-card">
<h3 class="font-bold mb-2">Modules</h3>
<p class="text-sm text-muted-foreground">
Build or share applications on top of the runtime.
</p>
</div>
<div class="p-6 border rounded-lg bg-card">
<h3 class="font-bold mb-2">Documentation</h3>
<p class="text-sm text-muted-foreground">
Improve clarity for future users and contributors.
</p>
</div>
</div>
</div>
</section>
</template>

View File

@@ -1,66 +0,0 @@
<script setup>
import { Lightbulb } from 'lucide-vue-next';
const roadmap = [
// {
// title: "Q1 2026 - In Progress",
// dotColor: "bg-primary",
// tasks: [
// "x",
// "x",
// "x",
// "x",
// ],
// },
// {
// title: "Q2 2026 - Planned",
// dotColor: "bg-muted-foreground",
// tasks: [
// "y",
// "y",
// "y",
// "y",
// ],
// },
// {
// title: "Q3-Q4 2026 - Future",
// dotColor: "bg-muted-foreground",
// tasks: [
// "z",
// "z",
// "z",
// "z",
// ],
// },
]
</script>
<template>
<section class="bg-card">
<div class="container py-24">
<div class="max-w-3xl mx-auto">
<div class="flex items-center gap-3 mb-8">
<div class="h-8 w-8 rounded-lg bg-primary/10 flex items-center justify-center">
<Lightbulb class="h-6 w-6 text-primary" />
</div>
<h2 class="text-3xl md:text-4xl font-bold">Development Roadmap</h2>
</div>
<div class="space-y-8">
<div v-for="(quarter, index) in roadmap" :key="index">
<div class="flex items-center gap-3 mb-4">
<div :class="['h-3 w-3 rounded-full', quarter.dotColor]" />
<h3 class="text-xl font-bold">{{ quarter.title }}</h3>
</div>
<ul class="space-y-2 text-muted-foreground ml-6">
<li class="flex gap-2" v-for="(task, i) in quarter.tasks" :key="i">
<span class="text-primary"></span>
<span>{{ task }}</span>
</li>
</ul>
</div>
</div>
</div>
</div>
</section>
</template>

View File

@@ -0,0 +1,60 @@
<script setup>
import Card from '@/components/ui/Card.vue'
import CardContent from '@/components/ui/CardContent.vue'
import { Boxes } from 'lucide-vue-next'
</script>
<template>
<section class="container py-24">
<div class="max-w-3xl mx-auto text-center mb-16">
<h2 class="text-3xl md:text-4xl font-bold mb-4">
A Growing Ecosystem
</h2>
<p class="text-muted-foreground text-lg">
NoSys is not a single application it is a base layer for many systems.
</p>
</div>
<div class="grid grid-cols-1 md:grid-cols-2 gap-8">
<Card class="border-2">
<CardContent class="p-8 space-y-3">
<h3 class="text-xl font-bold">Community Modules</h3>
<p class="text-muted-foreground">
Anyone can build and share modules that run on top of the runtime.
</p>
</CardContent>
</Card>
<Card class="border-2">
<CardContent class="p-8 space-y-3">
<h3 class="text-xl font-bold">Decentralized Apps</h3>
<p class="text-muted-foreground">
Social apps, messaging, tools, and systems built on peer-to-peer infrastructure.
</p>
</CardContent>
</Card>
<Card class="border-2">
<CardContent class="p-8 space-y-3">
<h3 class="text-xl font-bold">Experimental Systems</h3>
<p class="text-muted-foreground">
Research and experimentation in distributed architectures.
</p>
</CardContent>
</Card>
<Card class="border-2">
<CardContent class="p-8 space-y-3">
<h3 class="text-xl font-bold">Open Collaboration</h3>
<p class="text-muted-foreground">
Shared development between users, not controlled by a single entity.
</p>
</CardContent>
</Card>
</div>
</section>
</template>

View File

@@ -5,24 +5,23 @@ import DotsMouse from '@/components/ui/canvas/DotsMouse.vue'
<template> <template>
<section class="container py-24 md:py-32"> <section class="container py-24 md:py-32">
<div class="max-w-4xl mx-auto text-center"> <div class="max-w-4xl mx-auto text-center space-y-8">
<div class="inline-flex items-center px-3 py-1 text-sm rounded-full border border-border mb-6"> <div class="inline-flex items-center px-4 py-2 rounded-full bg-primary/10 text-primary border border-primary/20 text-sm">
Open Source Infrastructure Peer-to-Peer Systems Modular Runtime Open Community Ecosystem Driven
</div> </div>
<h1 class="text-4xl md:text-5xl lg:text-6xl font-bold mb-6 text-balance"> <h1 class="text-4xl md:text-6xl font-bold text-balance">
Build and Contribute to NoSys Join the NoSys Community
</h1> </h1>
<p class="text-xl text-muted-foreground leading-relaxed max-w-3xl mx-auto"> <p class="text-xl text-muted-foreground leading-relaxed">
NoSys is an open infrastructure platform for decentralized systems. NoSys is built by people, not companies.
Join as a developer, contributor, or operator building peer-to-peer applications and modules on top of the runtime. Users, contributors, and builders shape the ecosystem together.
</p> </p>
</div> </div>
<DotsMouse /> <DotsMouse />
</section> </section>
</template> </template>

View File

@@ -1,62 +0,0 @@
<script setup>
import Card from '@/components/ui/Card.vue';
import CardContent from '@/components/ui/CardContent.vue';
import { Code } from 'lucide-vue-next';
const contributionItems = [
{
title: "Code Contributions",
description: "We welcome contributions to the core platform and modules. Fork the repository, make your changes, and submit a pull request.",
points: [
"Follow the existing code style and conventions",
"Write tests for new features",
"Update documentation as needed",
"Ensure all tests pass before submitting",
],
},
{
title: "Documentation",
description: "Help improve our documentation by fixing errors, adding examples, or writing guides. Clear documentation makes the platform more accessible to everyone.",
},
{
title: "Bug Reports",
description: "Found a bug? Report it on our issue tracker with detailed steps to reproduce, your system information, and any relevant logs.",
},
{
title: "Feature Requests",
description: "Have an idea for a new feature? Open an issue describing the feature, its use case, and how it fits with the project's goals of decentralization and privacy.",
},
{
title: "Testing",
description: "Test beta releases, provide feedback, and help us identify issues before they reach stable releases.",
},
]
</script>
<template>
<section class="">
<div class="container py-24">
<div class="max-w-3xl mx-auto">
<div class="flex items-center gap-3 mb-8">
<Code class="h-8 w-8 text-primary" />
<h2 class="text-3xl md:text-4xl font-bold">How to Contribute</h2>
</div>
<div class="space-y-6">
<Card v-for="(item, index) in contributionItems" :key="index">
<CardContent class="pt-6">
<h3 class="text-xl font-bold mb-3">{{ item.title }}</h3>
<p class="text-muted-foreground leading-relaxed mb-4" v-if="item.description">{{ item.description }}</p>
<ul class="space-y-2 text-muted-foreground text-sm" v-if="item.points">
<li class="flex gap-2" v-for="(point, i) in item.points" :key="i">
<span class="text-primary"></span>
<span>{{ point }}</span>
</li>
</ul>
</CardContent>
</Card>
</div>
</div>
</div>
</section>
</template>

View File

@@ -1,141 +0,0 @@
<script setup>
import Button from '@/components/ui/Button.vue'
import Card from '@/components/ui/Card.vue'
import CardContent from '@/components/ui/CardContent.vue'
import { Heart, Wallet, Github } from 'lucide-vue-next'
</script>
<template>
<section id="donate" class="bg-primary/5">
<div class="container py-24">
<div class="max-w-3xl mx-auto">
<!-- Header -->
<div class="text-center mb-10">
<div class="flex items-center justify-center gap-3 mb-4">
<Heart class="h-7 w-7 text-primary" />
<h2 class="text-3xl md:text-4xl font-bold">
Support Development
</h2>
</div>
<p class="text-muted-foreground text-lg leading-relaxed">
NoSys is open-source infrastructure built to support decentralized systems.
Contributions help fund development, testing, and long-term protocol maintenance.
</p>
</div>
<!-- CTA -->
<div class="flex justify-center mb-12">
<Button size="lg" class="text-lg px-8 py-6 h-auto">
<Heart class="h-5 w-5 mr-2" />
Contribute
</Button>
</div>
<!-- Support Options -->
<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
<!-- GitHub -->
<Card class="border-2">
<CardContent class="pt-6 text-center">
<div class="flex justify-center mb-4">
<Github class="h-10 w-10 text-primary" />
</div>
<h3 class="text-xl font-bold mb-2">
Open Source Contributions
</h3>
<p class="text-muted-foreground text-sm mb-5">
Contribute code, review modules, or support development through GitHub.
</p>
<Button variant="outline" class="w-full bg-transparent">
<a href="https://github.com" target="_blank" rel="noopener noreferrer">
View Repository
</a>
</Button>
</CardContent>
</Card>
<!-- Crypto -->
<Card class="border-2">
<CardContent class="pt-6 text-center">
<div class="flex justify-center mb-4">
<Wallet class="h-10 w-10 text-primary" />
</div>
<h3 class="text-xl font-bold mb-2">
Cryptocurrency Funding
</h3>
<p class="text-muted-foreground text-sm mb-5">
Direct contributions via crypto wallets for protocol and infrastructure development.
</p>
<Button variant="outline" class="w-full bg-transparent">
<a href="#crypto-wallets">
View Wallets
</a>
</Button>
</CardContent>
</Card>
</div>
<!-- Wallets -->
<div
id="crypto-wallets"
class="mt-12 p-6 bg-card rounded-lg border border-border"
>
<h3 class="text-lg font-bold mb-6 flex items-center gap-2">
<Wallet class="h-5 w-5 text-primary" />
Funding Wallets
</h3>
<div class="space-y-4">
<div>
<p class="text-sm font-semibold mb-1">Bitcoin (BTC)</p>
<code class="text-xs bg-muted p-2 rounded block break-all">
bc1q4waz2qznl9jlgz649rxsv5v83le6evvdg96rku
</code>
</div>
</div>
<p class="text-xs text-muted-foreground mt-4">
Contributions are used for core development, protocol research,
and infrastructure maintenance.
</p>
</div>
</div>
</div>
</section>
</template>

View File

@@ -0,0 +1,54 @@
<script setup>
import Card from '@/components/ui/Card.vue'
import CardContent from '@/components/ui/CardContent.vue'
import { MessageSquare, Github, Globe } from 'lucide-vue-next'
</script>
<template>
<section class="container py-24">
<div class="text-center mb-16">
<h2 class="text-3xl md:text-4xl font-bold mb-4">
Where the Community Lives
</h2>
<p class="text-muted-foreground text-lg">
Connect, discuss, and follow the evolution of NoSys.
</p>
</div>
<div class="grid grid-cols-1 md:grid-cols-3 gap-8">
<Card class="border-2">
<CardContent class="p-8 text-center space-y-4">
<MessageSquare class="h-10 w-10 mx-auto text-primary" />
<h3 class="text-xl font-bold">Discussions</h3>
<p class="text-sm text-muted-foreground">
Talk about features, ideas, and ecosystem direction.
</p>
</CardContent>
</Card>
<Card class="border-2">
<CardContent class="p-8 text-center space-y-4">
<Github class="h-10 w-10 mx-auto text-primary" />
<h3 class="text-xl font-bold">Open Source</h3>
<p class="text-sm text-muted-foreground">
Explore the code, report issues, and follow development.
</p>
</CardContent>
</Card>
<Card class="border-2">
<CardContent class="p-8 text-center space-y-4">
<Globe class="h-10 w-10 mx-auto text-primary" />
<h3 class="text-xl font-bold">Ecosystem</h3>
<p class="text-sm text-muted-foreground">
Discover modules and applications built on NoSys.
</p>
</CardContent>
</Card>
</div>
</section>
</template>

View File

@@ -0,0 +1,30 @@
<script setup>
import Button from '@/components/ui/Button.vue'
import { Heart } from 'lucide-vue-next'
</script>
<template>
<section class="container py-24 bg-card">
<div class="max-w-3xl mx-auto text-center space-y-6">
<h2 class="text-3xl md:text-4xl font-bold">
Support the Ecosystem
</h2>
<p class="text-lg text-muted-foreground">
NoSys is open-source and community-driven.
Support helps infrastructure, development, and long-term sustainability.
</p>
<RouterLink to="/contribute">
<Button class="bg-amber-400 hover:bg-amber-500 text-black px-8">
<Heart class="h-4 w-4 mr-2" />
Donate or Support
</Button>
</RouterLink>
</div>
</section>
</template>

View File

@@ -1,50 +0,0 @@
<script setup>
import Card from '@/components/ui/Card.vue';
import CardContent from '@/components/ui/CardContent.vue';
import { Calendar } from 'lucide-vue-next';
const updates = [
// {
// title: "v1.2.0 Released",
// date: "Dec 1, 2024",
// description: "xxxxxxxxxxxxxxxxxxx.",
// },
// {
// title: "Community Milestone: 10K Users",
// date: "Nov 25, 2024",
// description: "We've reached 10,000 active users on the network! Thank you to everyone who's joined the movement for decentralized social media.",
// },
// {
// title: "New Documentation Portal",
// date: "Nov 15, 2024",
// description: "Launched comprehensive documentation with guides for developers, API references, and security best practices.",
// },
]
</script>
<template>
<section class="">
<div class="container py-24">
<div class="max-w-3xl mx-auto">
<div class="flex items-center gap-3 mb-8">
<div class="h-8 w-8 rounded-lg bg-primary/10 flex items-center justify-center">
<Calendar class="h-6 w-6 text-primary" />
</div>
<h2 class="text-3xl md:text-4xl font-bold">Recent Updates</h2>
</div>
<div class="space-y-6">
<Card v-for="(update, index) in updates" :key="index">
<CardContent class="pt-6">
<div class="flex items-start justify-between mb-2">
<h3 class="text-lg font-bold">{{ update.title }}</h3>
<span class="text-sm text-muted-foreground">{{ update.date }}</span>
</div>
<p class="text-muted-foreground text-sm">{{ update.description }}</p>
</CardContent>
</Card>
</div>
</div>
</div>
</section>
</template>

View File

@@ -0,0 +1,41 @@
<script setup>
import { RouterLink } from 'vue-router'
import Button from '@/components/ui/Button.vue'
import { Download, Code } from 'lucide-vue-next'
</script>
<template>
<section class="container py-24">
<div class="max-w-4xl mx-auto text-center space-y-8">
<h2 class="text-4xl md:text-5xl font-bold">
The Ecosystem Is Built by Everyone
</h2>
<p class="text-xl text-muted-foreground">
Supporting NoSys means supporting a decentralized infrastructure future.
</p>
<div class="flex flex-col sm:flex-row gap-4 justify-center">
<RouterLink to="/downloads">
<Button class="bg-amber-400 hover:bg-amber-500 text-black px-8">
<Download class="h-4 w-4 mr-2" />
Download NoSys
</Button>
</RouterLink>
<RouterLink to="/how-it-works">
<Button variant="outline" class="px-8">
<Code class="h-4 w-4 mr-2" />
Understand the System
</Button>
</RouterLink>
</div>
</div>
</section>
</template>

View File

@@ -0,0 +1,64 @@
<script setup>
import { ref } from 'vue'
import Card from '@/components/ui/Card.vue'
import CardContent from '@/components/ui/CardContent.vue'
import Button from '@/components/ui/Button.vue'
import { Wallet, Copy, Check } from 'lucide-vue-next'
const copied = ref(false)
const address = "bc1q4waz2qznl9jlgz649rxsv5v83le6evvdg96rku"
function copy() {
navigator.clipboard.writeText(address)
copied.value = true
setTimeout(() => {
copied.value = false
}, 1500)
}
</script>
<template>
<section class="container py-24">
<div class="max-w-3xl mx-auto text-center mb-12">
<h2 class="text-3xl md:text-4xl font-bold mb-4">
Donate in Bitcoin
</h2>
<p class="text-muted-foreground text-lg">
Currently, NoSys accepts BTC donations only. More options will be added as the ecosystem grows.
</p>
</div>
<div class="max-w-2xl mx-auto">
<Card class="border-2">
<CardContent class="p-8 space-y-6 text-center">
<Wallet class="h-10 w-10 mx-auto text-primary" />
<h3 class="text-xl font-bold">Bitcoin (BTC)</h3>
<div class="bg-muted p-4 rounded text-sm break-all text-left">
{{ address }}
</div>
<Button class="w-full" @click="copy">
<Copy v-if="!copied" class="h-4 w-4 mr-2" />
<Check v-else class="h-4 w-4 mr-2" />
{{ copied ? "Copied" : "Copy Address" }}
</Button>
<p class="text-xs text-muted-foreground">
Send only BTC. Sending other assets may result in permanent loss.
</p>
</CardContent>
</Card>
</div>
</section>
</template>

View File

@@ -0,0 +1,36 @@
<template>
<section class="container py-24 bg-card">
<div class="max-w-4xl mx-auto text-center space-y-6">
<h2 class="text-3xl md:text-4xl font-bold">
Future Support Options
</h2>
<p class="text-lg text-muted-foreground">
Additional contribution methods will be introduced as the ecosystem matures.
</p>
<div class="grid grid-cols-1 md:grid-cols-3 gap-6 mt-8">
<div class="p-6 border rounded-lg">
<h3 class="font-bold">GitHub Sponsors</h3>
<p class="text-sm text-muted-foreground">Direct developer sponsorship</p>
</div>
<div class="p-6 border rounded-lg">
<h3 class="font-bold">Lightning Network</h3>
<p class="text-sm text-muted-foreground">Fast micro-donations</p>
</div>
<div class="p-6 border rounded-lg">
<h3 class="font-bold">Recurring Support</h3>
<p class="text-sm text-muted-foreground">Monthly contributions</p>
</div>
</div>
</div>
</section>
</template>

View File

@@ -0,0 +1,22 @@
<template>
<section class="container py-24 md:py-32 text-center">
<div class="max-w-4xl mx-auto space-y-6">
<div class="inline-flex items-center px-4 py-2 rounded-full bg-primary/10 text-primary border border-primary/20 text-sm">
Open Source Community Funded
</div>
<h1 class="text-4xl md:text-6xl font-bold text-balance">
Support the NoSys Ecosystem
</h1>
<p class="text-xl text-muted-foreground leading-relaxed">
NoSys is built and maintained as an open-source infrastructure project.
Contributions help sustain development, infrastructure, and long-term research.
</p>
</div>
</section>
</template>

View File

@@ -0,0 +1,42 @@
<template>
<section class="container py-24">
<div class="max-w-4xl mx-auto text-center space-y-8">
<h2 class="text-3xl md:text-4xl font-bold">
How Funds Are Used
</h2>
<p class="text-lg text-muted-foreground">
Donations are not profit-driven. They support infrastructure and development.
</p>
<div class="grid grid-cols-1 md:grid-cols-3 gap-6 text-left">
<div class="p-6 border rounded-lg bg-card">
<h3 class="font-bold mb-2">Development</h3>
<p class="text-sm text-muted-foreground">
Core runtime, protocol, and module ecosystem.
</p>
</div>
<div class="p-6 border rounded-lg bg-card">
<h3 class="font-bold mb-2">Infrastructure</h3>
<p class="text-sm text-muted-foreground">
Servers, testing environments, and distributed network tools.
</p>
</div>
<div class="p-6 border rounded-lg bg-card">
<h3 class="font-bold mb-2">Research</h3>
<p class="text-sm text-muted-foreground">
Protocol design, peer-to-peer systems, and security improvements.
</p>
</div>
</div>
</div>
</section>
</template>

View File

@@ -0,0 +1,46 @@
<script setup>
import { RouterLink } from 'vue-router'
import Button from '@/components/ui/Button.vue'
import { ArrowRight, Download } from 'lucide-vue-next'
</script>
<template>
<section class="container py-24">
<div class="max-w-4xl mx-auto text-center space-y-8">
<h2 class="text-4xl md:text-5xl font-bold text-balance">
Start Using a Decentralized Runtime Today
</h2>
<p class="text-xl text-muted-foreground leading-relaxed">
Download NoSys, launch the runtime, and explore applications built on a
peer-to-peer infrastructure no installation, no configuration, no vendor lock-in.
</p>
<div class="flex flex-col sm:flex-row gap-4 justify-center">
<RouterLink to="/downloads">
<Button size="lg" class="bg-amber-400 hover:bg-amber-500 text-black px-8">
<Download class="h-4 w-4 mr-2" />
Download
</Button>
</RouterLink>
<RouterLink to="/how-it-works">
<Button size="lg" variant="outline" class="px-8">
Learn How It Works
<ArrowRight class="h-4 w-4 ml-2" />
</Button>
</RouterLink>
</div>
<p class="text-xs text-muted-foreground">
Open-source Self-contained No system modifications
</p>
</div>
</section>
</template>

View File

@@ -0,0 +1,27 @@
<script setup>
import DotsMouse from '@/components/ui/canvas/DotsMouse.vue'
</script>
<template>
<section class="container py-24 md:py-32">
<div class="max-w-4xl mx-auto text-center space-y-8">
<div class="inline-flex items-center px-4 py-2 rounded-full bg-primary/10 text-primary border border-primary/20 text-sm">
Self-contained runtime No installation required
</div>
<h1 class="text-4xl md:text-6xl font-bold text-balance">
Download the NoSys Runtime
</h1>
<p class="text-xl text-muted-foreground leading-relaxed">
A fully portable peer-to-peer environment containing Python, Node.js,
core networking modules, and the application runtime all bundled in a single package.
</p>
</div>
<DotsMouse />
</section>
</template>

View File

@@ -0,0 +1,25 @@
<template>
<section class="container py-24">
<div class="max-w-3xl mx-auto text-center space-y-6">
<h2 class="text-3xl md:text-4xl font-bold">
How it Runs
</h2>
<p class="text-lg text-muted-foreground">
NoSys does not install dependencies on your system. Everything runs inside its own isolated runtime.
</p>
<div class="bg-card border rounded-lg p-6 text-left font-mono text-sm">
1. Download ZIP<br/>
2. Extract folder<br/>
3. Run start.sh or start.bat<br/>
4. Runtime launches Python + Node internally<br/>
5. Modules load dynamically
</div>
</div>
</section>
</template>

View File

@@ -0,0 +1,71 @@
<script setup>
import Card from '@/components/ui/Card.vue'
import CardContent from '@/components/ui/CardContent.vue'
import Button from '@/components/ui/Button.vue'
import { Download, Terminal, Package } from 'lucide-vue-next'
</script>
<template>
<section class="container py-24">
<div class="text-center mb-16">
<h2 class="text-3xl md:text-4xl font-bold mb-4">
Choose Your Download Method
</h2>
<p class="text-muted-foreground text-lg max-w-2xl mx-auto">
No installation. No system dependency conflicts. Everything runs inside the noSys runtime folder.
</p>
</div>
<div class="grid grid-cols-1 md:grid-cols-2 gap-8">
<!-- ZIP -->
<Card class="border-2">
<CardContent class="p-8 space-y-6 text-center">
<Package class="h-10 w-10 mx-auto text-primary" />
<h3 class="text-2xl font-bold">Runtime Bundle (Recommended)</h3>
<p class="text-muted-foreground">
Download a self-contained .zip with Python, Node.js, core runtime, and default modules.
</p>
<Button class="w-full">
<Download class="h-4 w-4 mr-2" />
Download ZIP
</Button>
<p class="text-xs text-muted-foreground">
Works on Windows, Linux, macOS
</p>
</CardContent>
</Card>
<!-- CLI -->
<Card class="border-2 opacity-80">
<CardContent class="p-8 space-y-6 text-center">
<Terminal class="h-10 w-10 mx-auto text-primary" />
<h3 class="text-2xl font-bold">CLI Bootstrap (Coming Soon)</h3>
<p class="text-muted-foreground">
Install and manage NoSys via a single command in your terminal.
</p>
<div class="bg-muted p-3 rounded text-sm font-mono text-left">
curl -sSL nosys.org/install | bash
</div>
<Button variant="outline" disabled class="w-full">
Coming Soon
</Button>
</CardContent>
</Card>
</div>
</section>
</template>

View File

@@ -0,0 +1,47 @@
<script setup>
import { Laptop, HardDrive, Globe } from 'lucide-vue-next'
</script>
<template>
<section class="container py-24">
<div class="max-w-3xl mx-auto text-center mb-16">
<h2 class="text-3xl md:text-4xl font-bold mb-4">
System Requirements
</h2>
<p class="text-lg text-muted-foreground">
NoSys runs entirely inside its own runtime environment. Your system is only used to launch the bundle.
</p>
</div>
<div class="grid grid-cols-1 md:grid-cols-3 gap-8">
<div class="p-6 border rounded-lg bg-card text-center space-y-4">
<Laptop class="h-10 w-10 mx-auto text-primary" />
<h3 class="text-xl font-bold">Any Modern OS</h3>
<p class="text-sm text-muted-foreground">
Windows, Linux, or macOS. No system installation required.
</p>
</div>
<div class="p-6 border rounded-lg bg-card text-center space-y-4">
<HardDrive class="h-10 w-10 mx-auto text-primary" />
<h3 class="text-xl font-bold">~9999MB Space</h3>
<p class="text-sm text-muted-foreground">
Includes bundled Python runtime, Node runtime, and core modules.
</p>
</div>
<div class="p-6 border rounded-lg bg-card text-center space-y-4">
<Globe class="h-10 w-10 mx-auto text-primary" />
<h3 class="text-xl font-bold">Offline Capable</h3>
<p class="text-sm text-muted-foreground">
Works locally. Network only needed for external peer-to-peer connections.
</p>
</div>
</div>
</section>
</template>

View File

@@ -0,0 +1,67 @@
<template>
<section class="bg-card">
<div class="container py-24">
<div class="max-w-3xl mx-auto text-center mb-16">
<h2 class="text-3xl md:text-4xl font-bold mb-6">
Built on Peer-to-Peer Infrastructure
</h2>
<p class="text-xl text-muted-foreground leading-relaxed">
NoSys combines distributed networking, cryptographic identity,
modular runtimes, and decentralized coordination systems.
</p>
</div>
<div
class="max-w-5xl mx-auto rounded-3xl border bg-background
p-8 md:p-12"
>
<div class="space-y-6 text-center">
<div class="p-5 rounded-2xl border bg-card">
Applications & Modules
</div>
<div class="text-muted-foreground"></div>
<div class="p-5 rounded-2xl border bg-card">
NoSys Runtime
</div>
<div class="text-muted-foreground"></div>
<div class="grid grid-cols-1 md:grid-cols-3 gap-4">
<div class="p-4 rounded-xl border bg-card">
Networking
</div>
<div class="p-4 rounded-xl border bg-card">
Identity
</div>
<div class="p-4 rounded-xl border bg-card">
Rendezvous
</div>
</div>
<div class="text-muted-foreground"></div>
<div class="p-5 rounded-2xl border bg-card">
Peer-to-Peer Network
</div>
</div>
</div>
</div>
</section>
</template>

View File

@@ -1,30 +1,48 @@
<script setup> <script setup>
import { RouterLink } from 'vue-router' import { RouterLink } from 'vue-router'
import Button from '@/components/ui/Button.vue' import Button from '@/components/ui/Button.vue'
</script> </script>
<template> <template>
<section class="container py-24"> <section>
<div class="max-w-3xl mx-auto text-center space-y-6"> <div class="container py-24">
<h2 class="text-3xl md:text-4xl font-bold"> <div class="max-w-3xl mx-auto text-center space-y-8">
Start Building Decentralized Systems
</h2>
<p class="text-xl text-muted-foreground"> <h2 class="text-4xl font-bold text-balance">
Explore the platform, connect peers, and build applications Explore the NoSys Ecosystem
without centralized infrastructure. </h2>
</p>
<Button <p class="text-xl text-muted-foreground leading-relaxed">
size="lg" Install decentralized applications, join community networks,
class="text-lg px-8 bg-amber-400 hover:bg-amber-500 text-black" or build your own modules on top of peer-to-peer infrastructure.
> </p>
<RouterLink to="/downloads">
Get Started <div class="flex flex-col sm:flex-row gap-4 justify-center">
</RouterLink>
</Button> <RouterLink to="/downloads">
<Button
size="lg"
class="bg-amber-400 hover:bg-amber-500 text-black"
>
Download NoSys
</Button>
</RouterLink>
<RouterLink to="/modules">
<Button
size="lg"
variant="outline"
>
Explore Modules
</Button>
</RouterLink>
</div>
</div>
</div> </div>

View File

@@ -0,0 +1,77 @@
<script setup>
import {
MessageCircle,
File,
Gamepad2,
Bot
} from 'lucide-vue-next'
import Card from '@/components/ui/Card.vue'
import CardContent from '@/components/ui/CardContent.vue'
</script>
<template>
<section class="bg-card">
<div class="container py-24">
<div class="max-w-3xl mx-auto text-center mb-16">
<h2 class="text-3xl md:text-4xl font-bold mb-6">
What You Can Do
</h2>
<p class="text-xl text-muted-foreground">
NoSys is designed to support many types of decentralized systems.
</p>
</div>
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6">
<Card>
<CardContent class="pt-6 space-y-4">
<MessageCircle class="h-8 w-8 text-primary" />
<h3 class="font-bold text-lg">Messaging</h3>
<p class="text-sm text-muted-foreground">
Real-time decentralized communication.
</p>
</CardContent>
</Card>
<Card>
<CardContent class="pt-6 space-y-4">
<File class="h-8 w-8 text-primary" />
<h3 class="font-bold text-lg">File Sharing</h3>
<p class="text-sm text-muted-foreground">
Secure peer-to-peer file transfer systems.
</p>
</CardContent>
</Card>
<Card>
<CardContent class="pt-6 space-y-4">
<Gamepad2 class="h-8 w-8 text-primary" />
<h3 class="font-bold text-lg">Games</h3>
<p class="text-sm text-muted-foreground">
Multiplayer applications without centralized servers.
</p>
</CardContent>
</Card>
<Card>
<CardContent class="pt-6 space-y-4">
<Bot class="h-8 w-8 text-primary" />
<h3 class="font-bold text-lg">Automation</h3>
<p class="text-sm text-muted-foreground">
AI agents and distributed autonomous systems.
</p>
</CardContent>
</Card>
</div>
</div>
</section>
</template>

View File

@@ -0,0 +1,83 @@
<script setup>
import Card from '@/components/ui/Card.vue'
import CardContent from '@/components/ui/CardContent.vue'
import { Building2, Database, ShieldOff } from 'lucide-vue-next';
</script>
<template>
<section>
<div class="container py-24">
<div class="grid grid-cols-1 lg:grid-cols-2 gap-16 items-center">
<div>
<h2 class="text-3xl md:text-4xl font-bold mb-6">
Why Decentralization Matters
</h2>
<div class="space-y-5 text-muted-foreground leading-relaxed">
<p>
As more communication, identity, and digital interaction move
online, centralized platforms gain increasing control over
infrastructure, data, and communities.
</p>
<p>
NoSys exists to support an alternative model where applications,
networks, and communities are owned and operated by their users.
</p>
</div>
</div>
<div class="space-y-6">
<Card>
<CardContent class="pt-6 flex gap-4">
<ShieldOff class="h-8 w-8 text-primary shrink-0" />
<div>
<h3 class="font-bold mb-2">No Central Ownership</h3>
<p class="text-sm text-muted-foreground">
The ecosystem is not controlled by a single company.
</p>
</div>
</CardContent>
</Card>
<Card>
<CardContent class="pt-6 flex gap-4">
<Database class="h-8 w-8 text-primary shrink-0" />
<div>
<h3 class="font-bold mb-2">Local Identity & Data</h3>
<p class="text-sm text-muted-foreground">
Identity and data are managed directly by users.
</p>
</div>
</CardContent>
</Card>
<Card>
<CardContent class="pt-6 flex gap-4">
<Building2 class="h-8 w-8 text-primary shrink-0" />
<div>
<h3 class="font-bold mb-2">Community Ecosystem</h3>
<p class="text-sm text-muted-foreground">
Applications and networks can evolve independently.
</p>
</div>
</CardContent>
</Card>
</div>
</div>
</div>
</section>
</template>

View File

@@ -1,40 +1,64 @@
<script setup> <script setup>
const items = [ import {
'Social Networks', Github,
'Encrypted Messaging', Users,
'File Distribution', Terminal
'IoT Networks', } from 'lucide-vue-next'
'Autonomous Systems',
'Collaborative Platforms', import Card from '@/components/ui/Card.vue'
'Distributed Communities', import CardContent from '@/components/ui/CardContent.vue'
'Future Decentralized Applications'
]
</script> </script>
<template> <template>
<section class="container py-24"> <section class="bg-card">
<div class="text-center mb-16"> <div class="container py-24">
<h2 class="text-3xl md:text-4xl font-bold mb-4">
Build Anything on Top
</h2>
<p class="text-xl text-muted-foreground max-w-3xl mx-auto"> <div class="max-w-3xl mx-auto text-center mb-16">
NoSys is designed as infrastructure for decentralized ecosystems,
enabling entirely different categories of peer-to-peer applications.
</p>
</div>
<div class="grid grid-cols-2 md:grid-cols-4 gap-4"> <h2 class="text-3xl md:text-4xl font-bold mb-6">
Open Ecosystem
</h2>
<div <p class="text-xl text-muted-foreground">
v-for="item in items" NoSys is developed openly with community contributions,
:key="item" public repositories, and modular expansion.
class="border rounded-xl p-6 text-center bg-card hover:border-primary transition-colors"
>
<p class="font-medium">
{{ item }}
</p> </p>
</div>
<div class="grid grid-cols-1 md:grid-cols-3 gap-8">
<Card>
<CardContent class="pt-6 space-y-4 text-center">
<Github class="h-10 w-10 text-primary mx-auto" />
<h3 class="font-bold text-xl">Open Source</h3>
<p class="text-muted-foreground">
Transparent development and public code.
</p>
</CardContent>
</Card>
<Card>
<CardContent class="pt-6 space-y-4 text-center">
<Users class="h-10 w-10 text-primary mx-auto" />
<h3 class="font-bold text-xl">Community Driven</h3>
<p class="text-muted-foreground">
Built collaboratively by contributors and users.
</p>
</CardContent>
</Card>
<Card>
<CardContent class="pt-6 space-y-4 text-center">
<Terminal class="h-10 w-10 text-primary mx-auto" />
<h3 class="font-bold text-xl">Developer Friendly</h3>
<p class="text-muted-foreground">
Create new applications and extend the ecosystem.
</p>
</CardContent>
</Card>
</div> </div>
</div> </div>

View File

@@ -1,5 +1,6 @@
<script setup> <script setup>
import { RouterLink } from 'vue-router' import { RouterLink } from 'vue-router'
import Button from '@/components/ui/Button.vue' import Button from '@/components/ui/Button.vue'
import DotsMouse from '@/components/ui/canvas/DotsMouse.vue' import DotsMouse from '@/components/ui/canvas/DotsMouse.vue'
</script> </script>
@@ -7,47 +8,69 @@ import DotsMouse from '@/components/ui/canvas/DotsMouse.vue'
<template> <template>
<section class="container py-24 md:py-32 lg:py-40"> <section class="container py-24 md:py-32 lg:py-40">
<div class="grid grid-cols-1 lg:grid-cols-2 gap-12 items-center"> <div class="grid grid-cols-1 lg:grid-cols-2 gap-16 items-center">
<div class="space-y-6"> <div class="space-y-8">
<div class="inline-block px-3 py-1 text-sm bg-primary/10 text-primary rounded-full border border-primary/20"> <div
Open Source Peer-to-Peer Decentralized class="inline-flex items-center px-3 py-1 text-sm
rounded-full border border-border"
>
Open Source Peer-to-Peer Modular
</div> </div>
<h1 class="text-4xl md:text-5xl lg:text-6xl font-bold tracking-tight text-balance"> <div class="space-y-6">
Infrastructure for a Decentralized Future
</h1>
<p class="text-xl text-muted-foreground text-pretty max-w-2xl"> <h1
NoSys is a peer-to-peer platform for building decentralized systems. class="text-5xl md:text-6xl lg:text-7xl
Create social networks, communication platforms, autonomous networks, font-bold tracking-tight text-balance"
distributed applications, and future technologies without relying on centralized infrastructure. >
</p> A Platform for
<span class="text-primary">
Decentralized Applications
</span>
</h1>
<p
class="text-xl text-muted-foreground
leading-relaxed max-w-2xl"
>
NoSys is a peer-to-peer platform where anyone can install,
use, or create decentralized applications without relying on
centralized platforms.
</p>
</div>
<div class="flex flex-col sm:flex-row gap-4"> <div class="flex flex-col sm:flex-row gap-4">
<Button <RouterLink to="/downloads">
size="lg" <Button
class="text-lg px-8 bg-amber-400 hover:bg-amber-500 text-black" size="lg"
> class="bg-amber-400 hover:bg-amber-500 text-black"
<RouterLink to="/downloads"> >
Download Download NoSys
</RouterLink> </Button>
</Button> </RouterLink>
<Button <RouterLink to="/modules">
variant="outline" <Button
size="lg" variant="outline"
class="text-lg px-8 bg-transparent hover:text-amber-500" size="lg"
> class="bg-transparent"
<RouterLink to="/docs"> >
Documentation Explore Modules
</RouterLink> </Button>
</Button> </RouterLink>
</div> </div>
<div class="flex flex-wrap gap-6 pt-4 text-sm text-muted-foreground">
<div>Community Modules</div>
<div>Distributed Networks</div>
<div>Open Ecosystem</div>
</div>
</div> </div>
<DotsMouse /> <DotsMouse />

View File

@@ -0,0 +1,77 @@
<script setup>
import {
MessageSquare,
Lock,
Folder
} from 'lucide-vue-next'
import Card from '@/components/ui/Card.vue'
import CardContent from '@/components/ui/CardContent.vue'
</script>
<template>
<section>
<div class="container py-24">
<div class="flex flex-col lg:flex-row lg:items-end lg:justify-between gap-8 mb-16">
<div class="max-w-2xl">
<h2 class="text-3xl md:text-4xl font-bold mb-6">
Featured Modules
</h2>
<p class="text-xl text-muted-foreground leading-relaxed">
Applications on NoSys are distributed as modules that run
on top of the platform.
</p>
</div>
</div>
<div class="grid grid-cols-1 md:grid-cols-3 gap-8">
<Card class="border-2">
<CardContent class="pt-6 space-y-4">
<MessageSquare class="h-8 w-8 text-primary" />
<div>
<h3 class="font-bold text-xl mb-2">P2Post</h3>
<p class="text-muted-foreground">
Decentralized social networking and content sharing.
</p>
</div>
</CardContent>
</Card>
<Card class="border-2">
<CardContent class="pt-6 space-y-4">
<Lock class="h-8 w-8 text-primary" />
<div>
<h3 class="font-bold text-xl mb-2">P2Private</h3>
<p class="text-muted-foreground">
Secure encrypted peer-to-peer messaging.
</p>
</div>
</CardContent>
</Card>
<Card class="border-2 border-dashed">
<CardContent class="pt-6 space-y-4">
<Folder class="h-8 w-8 text-primary" />
<div>
<h3 class="font-bold text-xl mb-2">More Modules</h3>
<p class="text-muted-foreground">
The ecosystem is open for community-built applications.
</p>
</div>
</CardContent>
</Card>
</div>
</div>
</section>
</template>

View File

@@ -1,31 +0,0 @@
<script setup>
</script>
<template>
<section class="container py-24">
<div class="max-w-4xl mx-auto text-center space-y-6">
<div class="inline-block px-3 py-1 text-sm rounded-full border border-border">
What is NoSys?
</div>
<h2 class="text-3xl md:text-5xl font-bold text-balance">
A Platform, Not an Application
</h2>
<p class="text-xl text-muted-foreground leading-relaxed">
NoSys provides the foundation for decentralized communication and coordination.
It includes peer discovery, rendezvous, encrypted communication,
sub-network management, and modular infrastructure for building distributed systems.
</p>
<p class="text-lg text-muted-foreground leading-relaxed">
Instead of relying on centralized servers controlled by corporations,
applications built on NoSys communicate directly between peers.
</p>
</div>
</section>
</template>

View File

@@ -1,84 +0,0 @@
<script setup>
import Card from '@/components/ui/Card.vue'
import CardContent from '@/components/ui/CardContent.vue'
import {
Network,
Shield,
Blocks
} from 'lucide-vue-next'
</script>
<template>
<section class="container py-24">
<div class="text-center mb-16">
<h2 class="text-3xl md:text-4xl font-bold mb-4">
Core Infrastructure Principles
</h2>
<p class="text-xl text-muted-foreground max-w-2xl mx-auto">
Built to reduce dependency on centralized systems
</p>
</div>
<div class="grid grid-cols-1 md:grid-cols-3 gap-8">
<Card class="border-2">
<CardContent class="pt-6">
<div class="h-12 w-12 rounded-lg bg-primary/10 flex items-center justify-center mb-4">
<Network class="h-6 w-6 text-primary" />
</div>
<h3 class="text-2xl font-bold mb-3">
Peer-to-Peer
</h3>
<p class="text-muted-foreground leading-relaxed">
Systems communicate directly between peers without depending on centralized infrastructure or single points of control.
</p>
</CardContent>
</Card>
<Card class="border-2">
<CardContent class="pt-6">
<div class="h-12 w-12 rounded-lg bg-primary/10 flex items-center justify-center mb-4">
<Shield class="h-6 w-6 text-primary" />
</div>
<h3 class="text-2xl font-bold mb-3">
Sovereignty
</h3>
<p class="text-muted-foreground leading-relaxed">
Identity, communication, and infrastructure belong to the participants of the network, not centralized providers.
</p>
</CardContent>
</Card>
<Card class="border-2">
<CardContent class="pt-6">
<div class="h-12 w-12 rounded-lg bg-primary/10 flex items-center justify-center mb-4">
<Blocks class="h-6 w-6 text-primary" />
</div>
<h3 class="text-2xl font-bold mb-3">
Modularity
</h3>
<p class="text-muted-foreground leading-relaxed">
Build different systems on top of the same decentralized infrastructure, from social platforms to autonomous machine networks.
</p>
</CardContent>
</Card>
</div>
</section>
</template>

View File

@@ -0,0 +1,100 @@
<script setup>
import Card from '@/components/ui/Card.vue';
import CardContent from '@/components/ui/CardContent.vue';
import { Boxes, Network, Shield } from 'lucide-vue-next';
</script>
<template>
<section>
<div class="container py-24">
<div class="max-w-3xl mx-auto text-center mb-16">
<h2 class="text-3xl md:text-4xl font-bold mb-6">
What is NoSys?
</h2>
<p class="text-xl text-muted-foreground leading-relaxed">
NoSys provides the networking, identity, and runtime systems
needed for decentralized applications to operate directly
between peers.
</p>
</div>
<div class="grid grid-cols-1 md:grid-cols-3 gap-8">
<Card class="border-2">
<CardContent class="pt-6 space-y-4">
<div
class="h-12 w-12 rounded-xl bg-primary/10
flex items-center justify-center"
>
<Network class="h-6 w-6 text-primary" />
</div>
<h3 class="text-2xl font-bold">
Peer-to-Peer
</h3>
<p class="text-muted-foreground leading-relaxed">
Applications communicate directly between devices without
depending on centralized platforms.
</p>
</CardContent>
</Card>
<Card class="border-2">
<CardContent class="pt-6 space-y-4">
<div
class="h-12 w-12 rounded-xl bg-primary/10
flex items-center justify-center"
>
<Boxes class="h-6 w-6 text-primary" />
</div>
<h3 class="text-2xl font-bold">
Modular
</h3>
<p class="text-muted-foreground leading-relaxed">
Install community-built modules for messaging, social
networking, file sharing, games, automation, and more.
</p>
</CardContent>
</Card>
<Card class="border-2">
<CardContent class="pt-6 space-y-4">
<div
class="h-12 w-12 rounded-xl bg-primary/10
flex items-center justify-center"
>
<Shield class="h-6 w-6 text-primary" />
</div>
<h3 class="text-2xl font-bold">
Open Source
</h3>
<p class="text-muted-foreground leading-relaxed">
The ecosystem is transparent, community-driven,
and not controlled by a single company.
</p>
</CardContent>
</Card>
</div>
</div>
</section>
</template>

View File

@@ -0,0 +1,33 @@
<script setup>
import { RouterLink } from 'vue-router'
import Button from '@/components/ui/Button.vue'
</script>
<template>
<section class="container py-24">
<div class="max-w-4xl mx-auto text-center space-y-8">
<h2 class="text-4xl md:text-5xl font-bold text-balance">
Explore the Ecosystem
</h2>
<p class="text-xl text-muted-foreground leading-relaxed">
Use community applications, discover decentralized experiences,
or build entirely new systems on top of NoSys.
</p>
<div class="flex flex-col sm:flex-row gap-4 justify-center">
<RouterLink to="/downloads">
<Button size="lg" class="bg-amber-400 hover:bg-amber-500 text-black px-8">
Download NoSys
</Button>
</RouterLink>
<RouterLink to="/documentation">
<Button size="lg" variant="outline" class="px-8">
Explore Documentation
</Button>
</RouterLink>
</div>
</div>
</section>
</template>

View File

@@ -0,0 +1,95 @@
<script setup>
import Card from '@/components/ui/Card.vue'
import CardContent from '@/components/ui/CardContent.vue'
import {
MessageCircle,
Users,
Gamepad2,
Folder,
Radio,
Car,
Shield,
Network
} from 'lucide-vue-next'
const categories = [
{
icon: MessageCircle,
title: 'Messaging',
description: 'Private communication systems, encrypted chats, and decentralized communities.'
},
{
icon: Users,
title: 'Social Networks',
description: 'Community-driven social platforms without centralized ownership.'
},
{
icon: Folder,
title: 'File Systems',
description: 'Distributed file sharing and decentralized storage applications.'
},
{
icon: Gamepad2,
title: 'Games',
description: 'Peer-to-peer multiplayer experiences without centralized servers.'
},
{
icon: Radio,
title: 'Communication Networks',
description: 'Custom subnetworks and alternative communication layers.'
},
{
icon: Car,
title: 'Autonomous Systems',
description: 'Machine-to-machine coordination and decentralized automation.'
},
{
icon: Shield,
title: 'Security Layers',
description: 'Identity systems, verification tools, and trust mechanisms.'
},
{
icon: Network,
title: 'Experimental Protocols',
description: 'Research projects and new decentralized architectures.'
}
]
</script>
<template>
<section class="container py-24">
<div class="max-w-3xl mx-auto text-center mb-16">
<h2 class="text-3xl md:text-4xl font-bold mb-6">
What Can Be Built?
</h2>
<p class="text-xl text-muted-foreground">
NoSys is infrastructure.
The possibilities are defined by the community.
</p>
</div>
<div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-6">
<Card
v-for="category in categories"
:key="category.title"
class="border-2 hover:border-primary/40 transition-colors"
>
<CardContent class="pt-6 space-y-4">
<div class="h-12 w-12 rounded-xl bg-primary/10 flex items-center justify-center">
<component :is="category.icon" class="h-6 w-6 text-primary" />
</div>
<h3 class="text-lg font-semibold">
{{ category.title }}
</h3>
<p class="text-sm text-muted-foreground leading-relaxed">
{{ category.description }}
</p>
</CardContent>
</Card>
</div>
</section>
</template>

View File

@@ -0,0 +1,56 @@
<script setup>
import Card from '@/components/ui/Card.vue'
import CardContent from '@/components/ui/CardContent.vue'
const examples = [
{
title: 'P2Post',
description: 'A decentralized social media module built on top of NoSys.'
},
{
title: 'P2Private',
description: 'Encrypted peer-to-peer messaging between contacts.'
},
{
title: 'Distributed File Share',
description: 'Community-driven file sharing without centralized hosting.'
},
{
title: 'Mesh Coordination Network',
description: 'Experimental communication layer for resilient local networks.'
}
]
</script>
<template>
<section class="container py-24">
<div class="max-w-3xl mx-auto text-center mb-16">
<h2 class="text-3xl md:text-4xl font-bold mb-6">
Example Modules
</h2>
<p class="text-xl text-muted-foreground">
NoSys already supports applications that demonstrate
what decentralized infrastructure can enable.
</p>
</div>
<div class="grid grid-cols-1 md:grid-cols-2 gap-8 max-w-5xl mx-auto">
<Card
v-for="example in examples"
:key="example.title"
class="border-2"
>
<CardContent class="p-8 space-y-4">
<h3 class="text-2xl font-bold">
{{ example.title }}
</h3>
<p class="text-muted-foreground leading-relaxed">
{{ example.description }}
</p>
</CardContent>
</Card>
</div>
</section>
</template>

View File

@@ -0,0 +1,30 @@
<script setup>
import DotsMouse from '@/components/ui/canvas/DotsMouse.vue'
</script>
<template>
<section class="container py-24 md:py-32 lg:py-40">
<div class="max-w-4xl mx-auto text-center space-y-8">
<div
class="inline-flex items-center gap-2 px-4 py-2 rounded-full border border-primary/20 bg-primary/10 text-primary text-sm"
>
Application Ecosystem
</div>
<div class="space-y-6">
<h1 class="text-4xl md:text-5xl lg:text-6xl font-bold tracking-tight text-balance">
Modules Turn NoSys Into Anything
</h1>
<p class="text-xl text-muted-foreground leading-relaxed max-w-3xl mx-auto">
NoSys is not a single application.
It is a decentralized runtime where the community can build social networks,
messaging apps, file systems, games, autonomous coordination systems,
and entirely new peer-to-peer experiences.
</p>
</div>
</div>
<DotsMouse />
</section>
</template>

View File

@@ -0,0 +1,59 @@
<template>
<section class="container py-24">
<div class="max-w-4xl mx-auto">
<div class="text-center mb-16">
<h2 class="text-3xl md:text-4xl font-bold mb-6">
How Modules Run
</h2>
<p class="text-xl text-muted-foreground">
Modules operate on top of the NoSys runtime and infrastructure stack.
</p>
</div>
<div class="rounded-3xl border border-border bg-background p-8 md:p-12 space-y-6">
<div class="rounded-2xl border border-primary/30 bg-primary/5 p-6 text-center">
<h3 class="text-xl font-bold mb-2">Applications & Modules</h3>
<p class="text-muted-foreground">
Social media, messaging, games, file systems, coordination networks.
</p>
</div>
<div class="flex justify-center text-muted-foreground text-2xl">
</div>
<div class="rounded-2xl border border-border bg-card p-6 text-center">
<h3 class="text-xl font-bold mb-2">VueNoSys UI Layer</h3>
<p class="text-muted-foreground">
Local interfaces rendered directly on the user's machine.
</p>
</div>
<div class="flex justify-center text-muted-foreground text-2xl">
</div>
<div class="rounded-2xl border border-border bg-card p-6 text-center">
<h3 class="text-xl font-bold mb-2">NoSys Runtime</h3>
<p class="text-muted-foreground">
Module management, APIs, peer connections, networking, and routing.
</p>
</div>
<div class="flex justify-center text-muted-foreground text-2xl">
</div>
<div class="rounded-2xl border border-border bg-card p-6 text-center">
<h3 class="text-xl font-bold mb-2">Core Infrastructure</h3>
<p class="text-muted-foreground">
Encryption, identity, rendezvous, peer discovery, distributed communication.
</p>
</div>
</div>
</div>
</section>
</template>

View File

@@ -0,0 +1,68 @@
<script setup>
import Card from '@/components/ui/Card.vue'
import CardContent from '@/components/ui/CardContent.vue'
import { Blocks, Cpu, Globe } from 'lucide-vue-next'
</script>
<template>
<section class="container py-24">
<div class="max-w-3xl mx-auto text-center mb-16">
<h2 class="text-3xl md:text-4xl font-bold mb-6">
Applications Built on Top of the Network
</h2>
<p class="text-xl text-muted-foreground leading-relaxed">
Modules use the infrastructure provided by NoSys:
peer discovery, encrypted communication, identity, networking,
and decentralized coordination.
</p>
</div>
<div class="grid grid-cols-1 md:grid-cols-3 gap-8">
<Card class="border-2">
<CardContent class="pt-8 space-y-4">
<div class="h-14 w-14 rounded-2xl bg-primary/10 flex items-center justify-center">
<Blocks class="h-7 w-7 text-primary" />
</div>
<h3 class="text-2xl font-bold">Independent Modules</h3>
<p class="text-muted-foreground leading-relaxed">
Every application runs as an independent module with its own logic,
interfaces, and network behavior.
</p>
</CardContent>
</Card>
<Card class="border-2">
<CardContent class="pt-8 space-y-4">
<div class="h-14 w-14 rounded-2xl bg-primary/10 flex items-center justify-center">
<Cpu class="h-7 w-7 text-primary" />
</div>
<h3 class="text-2xl font-bold">Shared Infrastructure</h3>
<p class="text-muted-foreground leading-relaxed">
Modules reuse the NoSys stack instead of rebuilding encryption,
networking, peer management, and discovery from scratch.
</p>
</CardContent>
</Card>
<Card class="border-2">
<CardContent class="pt-8 space-y-4">
<div class="h-14 w-14 rounded-2xl bg-primary/10 flex items-center justify-center">
<Globe class="h-7 w-7 text-primary" />
</div>
<h3 class="text-2xl font-bold">Open Ecosystem</h3>
<p class="text-muted-foreground leading-relaxed">
Anyone can create modules, publish them,
fork them, improve them, or build alternatives.
</p>
</CardContent>
</Card>
</div>
</section>
</template>

View File

@@ -0,0 +1,75 @@
<script setup>
import Card from '@/components/ui/Card.vue'
import CardContent from '@/components/ui/CardContent.vue'
import { ShieldCheck } from 'lucide-vue-next'
</script>
<template>
<section class="container py-24">
<div class="grid grid-cols-1 lg:grid-cols-2 gap-12 items-center">
<div>
<div
class="inline-flex items-center gap-2 px-4 py-2 rounded-full border border-primary/20 bg-primary/10 text-primary text-sm mb-6"
>
<ShieldCheck class="h-4 w-4" />
Open & Verifiable
</div>
<h2 class="text-3xl md:text-4xl font-bold mb-6">
Users Choose What They Run
</h2>
<div class="space-y-4 text-muted-foreground leading-relaxed text-lg">
<p>
NoSys does not force a single application ecosystem.
</p>
<p>
Modules are independent, open, and replaceable.
Users can inspect code, fork projects,
build alternatives, or choose different applications.
</p>
<p>
The goal is to reduce dependency on centralized gatekeepers
and give communities direct control over their own digital infrastructure.
</p>
</div>
</div>
<Card class="border-2">
<CardContent class="p-8 space-y-6">
<div>
<h3 class="font-semibold mb-2">Open Source</h3>
<p class="text-sm text-muted-foreground">
Modules can be audited and verified by the community.
</p>
</div>
<div>
<h3 class="font-semibold mb-2">Local Execution</h3>
<p class="text-sm text-muted-foreground">
Interfaces and logic can run directly on the user's device.
</p>
</div>
<div>
<h3 class="font-semibold mb-2">Community Governance</h3>
<p class="text-sm text-muted-foreground">
Ecosystems emerge from communities instead of centralized corporations.
</p>
</div>
<div>
<h3 class="font-semibold mb-2">Replaceable Systems</h3>
<p class="text-sm text-muted-foreground">
No single module controls the entire network.
</p>
</div>
</CardContent>
</Card>
</div>
</section>
</template>

View File

@@ -1,77 +1,230 @@
import { createRouter, createWebHistory } from 'vue-router'; import { createRouter, createWebHistory } from 'vue-router'
import Home from './views/Home.vue';
import About from './views/About.vue'; // Core Pages
import Blog from './views/Blog.vue'; import Home from './views/Home.vue'
import Community from './views/Community.vue'; import About from './views/About.vue'
import Docs from './views/Docs.vue'; import Architecture from './views/Architecture.vue'
import Downloads from './views/Downloads.vue'; import Downloads from './views/Downloads.vue'
import HowItWorks from './views/HowItWorks.vue'; import Docs from './views/Docs.vue'
import Support from './views/Support.vue'; import Modules from './views/Modules.vue'
import Article from './views/Article.vue'; import ModuleDetails from './views/ModuleDetails.vue'
import GettingStarted from './views/GettingStarted.vue'
// Ecosystem
import Community from './views/Community.vue'
import Help from './views/Help.vue'
import Contribute from './views/Contribute.vue'
import Roadmap from './views/Roadmap.vue'
import FAQ from './views/FAQ.vue'
import Security from './views/Security.vue'
// Content
import Blog from './views/Blog.vue'
import Article from './views/Article.vue'
const routes = [ const routes = [
// Home
{ {
path: '/', path: '/',
name: 'Home', name: 'Home',
component: Home, component: Home,
meta: {
title: 'noSys - Peer-to-Peer Platform'
}
}, },
// Main Pages
{ {
path: '/about', path: '/about',
name: 'About', name: 'About',
component: About, component: About,
meta: {
title: 'About noSys'
}
}, },
{ {
path: '/how-it-works', path: '/architecture',
name: 'HowItWorks', name: 'Architecture',
component: HowItWorks, component: Architecture,
meta: {
title: 'How noSys Works'
}
}, },
{ {
path: '/downloads', path: '/downloads',
name: 'Downloads', name: 'Downloads',
component: Downloads, component: Downloads,
meta: {
title: 'Download noSys'
}
}, },
{ {
path: '/documentation', path: '/docs',
name: 'Documentation', name: 'Docs',
component: Docs, component: Docs,
meta: {
title: 'Documentation'
}
}, },
{
path: '/getting-started',
name: 'GettingStarted',
component: GettingStarted,
meta: {
title: 'Getting Started'
}
},
// Modules Ecosystem
{
path: '/modules',
name: 'Modules',
component: Modules,
meta: {
title: 'Modules'
}
},
{
path: '/modules/:slug',
name: 'ModuleDetails',
component: ModuleDetails,
props: true,
meta: {
title: 'Module'
}
},
// Community / Ecosystem
{ {
path: '/community', path: '/community',
name: 'Community', name: 'Community',
component: Community, component: Community,
meta: {
title: 'Community'
}
}, },
{
path: '/help',
name: 'Help',
component: Help,
meta: {
title: 'Help'
}
},
{
path: '/contribute',
name: 'Contribute',
component: Contribute,
meta: {
title: 'Contribute'
}
},
{
path: '/roadmap',
name: 'Roadmap',
component: Roadmap,
meta: {
title: 'Roadmap'
}
},
{
path: '/security',
name: 'Security',
component: Security,
meta: {
title: 'Security'
}
},
{
path: '/faq',
name: 'FAQ',
component: FAQ,
meta: {
title: 'FAQ'
}
},
// Blog
{ {
path: '/blog', path: '/blog',
name: 'Blog', name: 'Blog',
component: Blog, component: Blog,
meta: {
title: 'Blog'
}
}, },
{ {
path: "/blog/:slug", path: '/blog/:slug',
name: "Article", name: 'Article',
component: Article, component: Article,
props: true props: true,
meta: {
title: 'Article'
}
}, },
// Legacy Redirects
{ {
path: '/support', path: '/how-it-works',
name: 'Support', redirect: '/architecture'
component: Support,
}, },
{ {
path: "/:pathMatch(.*)*", path: '/documentation',
redirect: "/" redirect: '/docs'
},
// 404
{
path: '/:pathMatch(.*)*',
redirect: '/'
} }
];
]
const router = createRouter({ const router = createRouter({
history: createWebHistory(import.meta.env.BASE_URL), history: createWebHistory(import.meta.env.BASE_URL),
routes, routes,
scrollBehavior(to, from, savedPosition) { scrollBehavior(to, from, savedPosition) {
if (savedPosition) { if (savedPosition) {
return savedPosition return savedPosition
} }
return { top: 0 } return {
top: 0
}
} }
}); })
export default router; router.afterEach((to) => {
const baseTitle = 'NoSys'
document.title = to.meta?.title
? `${to.meta.title}${baseTitle}`
: baseTitle
})
export default router

View File

@@ -1,14 +1,14 @@
<script setup> <script setup>
import AboutHero from "@/components/sections/about/AboutHero.vue" import AboutHero from '@/components/sections/about/AboutHero.vue'
import AboutTheProblem from "@/components/sections/about/AboutTheProblem.vue" import AboutVision from '@/components/sections/about/AboutVision.vue'
import AboutWhy from "@/components/sections/about/AboutWhy.vue" import AboutProblem from '@/components/sections/about/AboutProblem.vue'
import AboutTechnology from "@/components/sections/about/AboutTechnology.vue" import AboutSolution from '@/components/sections/about/AboutSolution.vue'
import AboutVision from "@/components/sections/about/AboutVision.vue" import AboutPrinciples from '@/components/sections/about/AboutPrinciples.vue'
import AboutCTA from "@/components/sections/about/AboutCTA.vue" import AboutFuture from '@/components/sections/about/AboutFuture.vue'
import AboutCTA from '@/components/sections/about/AboutCTA.vue'
</script> </script>
<template> <template>
<div class="flex flex-col"> <div class="flex flex-col">
<section class="border-b border-border"> <section class="border-b border-border">
@@ -17,30 +17,36 @@ import AboutCTA from "@/components/sections/about/AboutCTA.vue"
</div> </div>
</section> </section>
<section class="border-b border-border">
<div class="container mx-auto">
<AboutTheProblem />
</div>
</section>
<section class="border-b border-border">
<div class="container mx-auto">
<AboutWhy />
</div>
</section>
<section class="border-b border-border">
<div class="container mx-auto">
<AboutTechnology />
</div>
</section>
<section class="border-b border-border"> <section class="border-b border-border">
<div class="container mx-auto"> <div class="container mx-auto">
<AboutVision /> <AboutVision />
</div> </div>
</section> </section>
<section class="border-b border-border bg-card">
<div class="container mx-auto">
<AboutProblem />
</div>
</section>
<section class="border-b border-border">
<div class="container mx-auto">
<AboutSolution />
</div>
</section>
<section class="border-b border-border bg-card">
<div class="container mx-auto">
<AboutPrinciples />
</div>
</section>
<section class="border-b border-border">
<div class="container mx-auto">
<AboutFuture />
</div>
</section>
<section> <section>
<div class="container mx-auto"> <div class="container mx-auto">
<AboutCTA /> <AboutCTA />
@@ -48,5 +54,4 @@ import AboutCTA from "@/components/sections/about/AboutCTA.vue"
</section> </section>
</div> </div>
</template> </template>

View File

@@ -0,0 +1,18 @@
<script setup>
import DocsHero from "@/components/sections/documentation/DocsHero.vue"
import DocsQuickLinks from "@/components/sections/documentation/DocsQuickLinks.vue"
import UnderConstruction from "@/components/sections/UnderConstruction.vue"
</script>
<template>
<div class="flex flex-col">
<section class="">
<div class="container mx-auto">
<UnderConstruction />
</div>
</section>
</div>
</template>

View File

@@ -1,96 +1,17 @@
<script setup>
import UnderConstruction from "@/components/sections/UnderConstruction.vue"
</script>
<template> <template>
<div class="flex flex-col"> <div class="flex flex-col">
<!-- Hero -->
<section class="container py-24 md:py-32">
<div class="max-w-3xl mx-auto text-center">
<h1 class="text-4xl md:text-5xl lg:text-6xl font-bold mb-6">{{ article?.title }}</h1>
<div class="flex justify-center items-center gap-6 text-sm text-muted-foreground mb-4">
<span class="flex items-center gap-1">
<User class="h-4 w-4" /> {{ article?.author }}
</span>
<span class="flex items-center gap-1">
<Calendar class="h-4 w-4" /> {{ article?.date }}
</span>
<span class="px-2 py-1 bg-muted rounded text-xs">{{ article?.category }}</span>
</div>
<p class="text-muted-foreground leading-relaxed">{{ article?.excerpt }}</p>
</div>
</section>
<!-- Article Content --> <section class="">
<section class="border-t border-border bg-card"> <div class="container mx-auto">
<div class="container py-16"> <UnderConstruction />
<div class="max-w-4xl mx-auto">
<Card>
<CardContent class="p-8">
<div v-html="articleContent"></div>
</CardContent>
</Card>
</div>
</div> </div>
</section> </section>
<!-- Back to Blog -->
<section class="container py-16 text-center">
<Button asChild variant="outline">
<RouterLink to="/blog" class="flex items-center gap-2">
<ArrowRight class="h-4 w-4 rotate-180" />
Back to Blog
</RouterLink>
</Button>
</section>
</div> </div>
</template> </template>
<script setup>
import Card from "@/components/ui/Card.vue"
import CardContent from "@/components/ui/CardContent.vue"
import Button from "@/components/ui/Button.vue"
import { RouterLink, useRoute } from "vue-router"
import { Calendar, User, ArrowRight } from "lucide-vue-next"
// Dados de posts (mesmos da página de blog)
const posts = [
{
title: "The Case for Decentralized Social Media",
excerpt:
"Why the future of social networking must be peer-to-peer, and how centralized platforms have failed users through censorship, surveillance, and data exploitation.",
author: "Core Team",
date: "December 5, 2024",
category: "Philosophy",
slug: "case-for-decentralization",
content: "<p>The future of social networking must shift toward peer-to-peer (P2P) models because centralized platforms have consistently failed users by enabling censorship, surveillance, and data exploitation, undermining user privacy and freedom of expression. P2P networks decentralize control, empowering individuals to communicate directly without intermediaries, thereby reducing the risks of arbitrary content suppression and government or corporate overreach. Additionally, P2P systems inherently enhance privacy, as data is distributed rather than stored in centralized servers vulnerable to breaches and misuse. This paradigm shift fosters a more open, resilient, and user-centric social networking environment, restoring trust and sovereignty over personal information and online interactions.</p>"
},
{
title: "Understanding P2P Networking",
excerpt:
"A deep dive into how peer-to-peer networks function, the challenges they solve, and why they're more resilient than traditional client-server architectures.",
author: "Tech Team",
date: "November 28, 2024",
category: "Technology",
slug: "understanding-p2p",
content: "<p>Here we explain how P2P networks work and why they're important...</p>"
},
{
title: "Building Privacy-First Applications",
excerpt:
"How we designed our platform with privacy as the foundation, not an afterthought. Learn about the cryptographic principles that protect user data.",
author: "Security Team",
date: "November 20, 2024",
category: "Security",
slug: "privacy-first-apps",
content: "<p>Content about privacy-first applications and cryptography...</p>"
},
// ... adicionar os demais posts conforme necessário
]
// Pegar o slug da rota
const route = useRoute()
const slug = route.params.slug
// Encontrar o artigo correspondente
const article = posts.find((p) => p.slug === slug)
// Para demo, o conteúdo do artigo pode vir de Markdown convertido para HTML ou API
const articleContent = article?.content || "<p>Article not found.</p>"
</script>

View File

@@ -1,37 +1,11 @@
<script setup> <script setup>
import Card from "@/components/ui/Card.vue"
import CardContent from "@/components/ui/CardContent.vue"
import Button from "@/components/ui/Button.vue"
import { RouterLink } from "vue-router"
import { Calendar, User, ArrowRight } from "lucide-vue-next"
import BlogHero from "@/components/sections/blog/BlogHero.vue"
import BlocgRecentArticles from "@/components/sections/blog/BlogRecentArticles.vue"
import BlogRecentArticles from "@/components/sections/blog/BlogRecentArticles.vue"
import BlogSections from "@/components/sections/blog/BlogSections.vue"
import UnderConstruction from "@/components/sections/UnderConstruction.vue" import UnderConstruction from "@/components/sections/UnderConstruction.vue"
</script> </script>
<template> <template>
<div class="flex flex-col"> <div class="flex flex-col">
<section class="border-b border-border">
<div class="container mx-auto">
<BlogHero />
</div>
</section>
<section class="border-b border-border">
<div class="container mx-auto">
<BlogRecentArticles />
</div>
</section>
<section class="border-b border-border">
<div class="container mx-auto">
<BlogSections />
</div>
</section>
<section class=""> <section class="">
<div class="container mx-auto"> <div class="container mx-auto">

View File

@@ -1,103 +1,15 @@
<script setup> <script setup>
import Card from "@/components/ui/Card.vue" import CommunityHero from '@/components/sections/community/CommunityHero.vue'
import CardContent from "@/components/ui/CardContent.vue" import CommunitySpaces from '@/components/sections/community/CommunitySpaces.vue'
import Button from "@/components/ui/Button.vue" import CommunityEcosystem from '@/components/sections/community/CommunityEcosystem.vue'
import { Github, MessageCircle, Bug, Code, Lightbulb, Calendar, Heart, Wallet } from "lucide-vue-next" import CommunityContribute from '@/components/sections/community/CommunityContribute.vue'
import CommunityHero from "@/components/sections/community/CommunityHero.vue" import CommunitySupport from '@/components/sections/community/CommunitySupport.vue'
import CommunityProjectSupport from "@/components/sections/community/CommunityProjectSupport.vue" import CommunityCTA from '@/components/sections/community/CommunityCTA.vue'
import CommunityDevRoadMap from "@/components/sections/community/CommunityDevRoadMap.vue"
import CommunityHowToContribute from "@/components/sections/community/CommunityHowToContribute.vue"
import CommunityUpdates from "@/components/sections/community/CommunityUpdates.vue"
import UnderConstruction from "@/components/sections/UnderConstruction.vue"
const currentYear = new Date().getFullYear()
// Contribution Guide items
const contributionItems = [
{
title: "Code Contributions",
description: "We welcome contributions to the core platform and modules. Fork the repository, make your changes, and submit a pull request.",
points: [
"Follow the existing code style and conventions",
"Write tests for new features",
"Update documentation as needed",
"Ensure all tests pass before submitting",
],
},
{
title: "Documentation",
description: "Help improve our documentation by fixing errors, adding examples, or writing guides. Clear documentation makes the platform more accessible to everyone.",
},
{
title: "Bug Reports",
description: "Found a bug? Report it on our issue tracker with detailed steps to reproduce, your system information, and any relevant logs.",
},
{
title: "Feature Requests",
description: "Have an idea for a new feature? Open an issue describing the feature, its use case, and how it fits with the project's goals of decentralization and privacy.",
},
{
title: "Testing",
description: "Test beta releases, provide feedback, and help us identify issues before they reach stable releases.",
},
]
// Roadmap items
const roadmap = [
{
title: "Q1 2025 - In Progress",
dotColor: "bg-primary",
tasks: [
"Mobile iOS app development",
"Improved NAT traversal for restrictive networks",
"Group video calling module",
"Enhanced content discovery algorithms",
],
},
{
title: "Q2 2025 - Planned",
dotColor: "bg-muted-foreground",
tasks: [
"Distributed storage for larger media files",
"Advanced reputation and trust metrics",
"Built-in Tor integration for enhanced anonymity",
"Marketplace module for P2P commerce",
],
},
{
title: "Q3-Q4 2025 - Future",
dotColor: "bg-muted-foreground",
tasks: [
"Cross-platform desktop synchronization",
"Blockchain integration for identity verification (optional)",
"Plugin ecosystem marketplace",
"Advanced analytics dashboard for users",
],
},
]
// Recent updates
const updates = [
{
title: "v1.2.0 Released",
date: "Dec 1, 2024",
description: "Major update with group Waves, improved encryption performance, and enhanced NAT traversal. See full release notes on the downloads page.",
},
{
title: "Community Milestone: 10K Users",
date: "Nov 25, 2024",
description: "We've reached 10,000 active users on the network! Thank you to everyone who's joined the movement for decentralized social media.",
},
{
title: "New Documentation Portal",
date: "Nov 15, 2024",
description: "Launched comprehensive documentation with guides for developers, API references, and security best practices.",
},
]
</script> </script>
<template> <template>
<div class="flex flex-col"> <div class="flex flex-col">
<section class="border-b border-border"> <section class="border-b border-border">
<div class="container mx-auto"> <div class="container mx-auto">
<CommunityHero /> <CommunityHero />
@@ -106,32 +18,33 @@ const updates = [
<section class="border-b border-border"> <section class="border-b border-border">
<div class="container mx-auto"> <div class="container mx-auto">
<CommunityProjectSupport /> <CommunitySpaces />
</div>
</section>
<section class="border-b border-border bg-card">
<div class="container mx-auto">
<CommunityEcosystem />
</div> </div>
</section> </section>
<section class="border-b border-border"> <section class="border-b border-border">
<div class="container mx-auto"> <div class="container mx-auto">
<CommunityDevRoadMap /> <CommunityContribute />
</div> </div>
</section> </section>
<section class="border-b border-border"> <section class="border-b border-border bg-card">
<div class="container mx-auto"> <div class="container mx-auto">
<CommunityHowToContribute /> <CommunitySupport />
</div> </div>
</section> </section>
<section class="border-b border-border"> <section>
<div class="container mx-auto"> <div class="container mx-auto">
<CommunityUpdates /> <CommunityCTA />
</div> </div>
</section> </section>
<section class="">
<div class="container mx-auto">
<UnderConstruction />
</div>
</section>
</div> </div>
</template> </template>

43
src/views/Contribute.vue Normal file
View File

@@ -0,0 +1,43 @@
<script setup>
import ContributeHero from '@/components/sections/contribute/ContributeHero.vue'
import ContributeDonate from '@/components/sections/contribute/ContributeDonate.vue'
import ContributeTransparency from '@/components/sections/contribute/ContributeTransparency.vue'
import ContributeFuture from '@/components/sections/contribute/ContributeFuture.vue'
import ContributeCTA from '@/components/sections/contribute/ContributeCTA.vue'
</script>
<template>
<div class="flex flex-col">
<section class="border-b border-border">
<div class="container mx-auto">
<ContributeHero />
</div>
</section>
<section class="border-b border-border">
<div class="container mx-auto">
<ContributeDonate />
</div>
</section>
<section class="border-b border-border bg-card">
<div class="container mx-auto">
<ContributeTransparency />
</div>
</section>
<section class="border-b border-border">
<div class="container mx-auto">
<ContributeFuture />
</div>
</section>
<section>
<div class="container mx-auto">
<ContributeCTA />
</div>
</section>
</div>
</template>

View File

@@ -1,16 +1,4 @@
<script setup> <script setup>
import Card from "@/components/ui/Card.vue"
import CardContent from "@/components/ui/CardContent.vue"
import {
AccordionRoot,
AccordionItem,
AccordionHeader,
AccordionTrigger,
AccordionContent
} from "radix-vue"
import { Book, Code, Shield, HelpCircle } from "lucide-vue-next"
import { RouterLink } from "vue-router"
import Button from "@/components/ui/Button.vue"
import DocsHero from "@/components/sections/documentation/DocsHero.vue" import DocsHero from "@/components/sections/documentation/DocsHero.vue"
import DocsQuickLinks from "@/components/sections/documentation/DocsQuickLinks.vue" import DocsQuickLinks from "@/components/sections/documentation/DocsQuickLinks.vue"
import UnderConstruction from "@/components/sections/UnderConstruction.vue" import UnderConstruction from "@/components/sections/UnderConstruction.vue"
@@ -19,7 +7,7 @@ import UnderConstruction from "@/components/sections/UnderConstruction.vue"
<template> <template>
<div class="flex flex-col"> <div class="flex flex-col">
<section class="border-b border-border"> <!-- <section class="border-b border-border">
<div class="container mx-auto"> <div class="container mx-auto">
<DocsHero /> <DocsHero />
</div> </div>
@@ -29,7 +17,7 @@ import UnderConstruction from "@/components/sections/UnderConstruction.vue"
<div class="container mx-auto"> <div class="container mx-auto">
<DocsQuickLinks /> <DocsQuickLinks />
</div> </div>
</section> </section> -->
<section class=""> <section class="">
<div class="container mx-auto"> <div class="container mx-auto">

View File

@@ -1,35 +1,43 @@
<script setup> <script setup>
import Card from "@/components/ui/Card.vue" import DownloadHero from '@/components/sections/downloads/DownloadHero.vue'
import CardContent from "@/components/ui/CardContent.vue" import DownloadOptions from '@/components/sections/downloads/DownloadOptions.vue'
import Button from "@/components/ui/Button.vue" import DownloadHowItWorks from '@/components/sections/downloads/DownloadHowItWorks.vue'
import { Download, Shield, AlertTriangle } from "lucide-vue-next" import DownloadRequirements from '@/components/sections/downloads/DownloadRequirements.vue'
import { RouterLink } from "vue-router" import DownloadCTA from '@/components/sections/downloads/DownloadCTA.vue'
import DownloadsHero from "@/components/sections/downloads/DownloadsHero.vue"
import SupportGettingStarted from "@/components/sections/support/SupportGettingStarted.vue"
import SupportNeedHelp from "@/components/sections/support/SupportNeedHelp.vue"
</script> </script>
<template> <template>
<div class="flex flex-col"> <div class="flex flex-col">
<section class="">
<section class="border-b border-border">
<div class="container mx-auto"> <div class="container mx-auto">
<DownloadsHero /> <DownloadHero />
</div> </div>
</section> </section>
<section class=""> <section class="border-b border-border">
<div class="container mx-auto"> <div class="container mx-auto">
<SupportGettingStarted /> <DownloadOptions />
</div> </div>
</section> </section>
<section class=""> <section class="border-b border-border">
<div class="container mx-auto"> <div class="container mx-auto">
<SupportNeedHelp /> <DownloadHowItWorks />
</div> </div>
</section> </section>
<section class="border-b border-border bg-card">
<div class="container mx-auto">
<DownloadRequirements />
</div>
</section>
<section>
<div class="container mx-auto">
<DownloadCTA />
</div>
</section>
</div> </div>
</template> </template>

17
src/views/FAQ.vue Normal file
View File

@@ -0,0 +1,17 @@
<script setup>
import UnderConstruction from "@/components/sections/UnderConstruction.vue"
</script>
<template>
<div class="flex flex-col">
<section class="">
<div class="container mx-auto">
<UnderConstruction />
</div>
</section>
</div>
</template>

View File

@@ -0,0 +1,17 @@
<script setup>
import UnderConstruction from "@/components/sections/UnderConstruction.vue"
</script>
<template>
<div class="flex flex-col">
<section class="">
<div class="container mx-auto">
<UnderConstruction />
</div>
</section>
</div>
</template>

17
src/views/Help.vue Normal file
View File

@@ -0,0 +1,17 @@
<script setup>
import UnderConstruction from "@/components/sections/UnderConstruction.vue"
</script>
<template>
<div class="flex flex-col">
<section class="">
<div class="container mx-auto">
<UnderConstruction />
</div>
</section>
</div>
</template>

View File

@@ -1,7 +1,10 @@
<script setup> <script setup>
import HomeHero from '@/components/sections/home/HomeHero.vue' import HomeHero from '@/components/sections/home/HomeHero.vue'
import HomePlatform from '@/components/sections/home/HomePlatform.vue' import HomeWhatIs from '@/components/sections/home/HomeWhatIs.vue'
import HomePrinciples from '@/components/sections/home/HomePrinciples.vue' import HomeCapabilities from '@/components/sections/home/HomeCapabilities.vue'
import HomeModules from '@/components/sections/home/HomeModules.vue'
import HomeArchitecture from '@/components/sections/home/HomeArchitecture.vue'
import HomeDecentralization from '@/components/sections/home/HomeDecentralization.vue'
import HomeEcosystem from '@/components/sections/home/HomeEcosystem.vue' import HomeEcosystem from '@/components/sections/home/HomeEcosystem.vue'
import HomeCTA from '@/components/sections/home/HomeCTA.vue' import HomeCTA from '@/components/sections/home/HomeCTA.vue'
</script> </script>
@@ -17,13 +20,31 @@ import HomeCTA from '@/components/sections/home/HomeCTA.vue'
<section class="border-b border-border"> <section class="border-b border-border">
<div class="container mx-auto"> <div class="container mx-auto">
<HomePlatform /> <HomeWhatIs />
</div> </div>
</section> </section>
<section class="border-b border-border"> <section class="border-b border-border">
<div class="container mx-auto"> <div class="container mx-auto">
<HomePrinciples /> <HomeCapabilities />
</div>
</section>
<section class="border-b border-border">
<div class="container mx-auto">
<HomeModules />
</div>
</section>
<section class="border-b border-border">
<div class="container mx-auto">
<HomeArchitecture />
</div>
</section>
<section class="border-b border-border">
<div class="container mx-auto">
<HomeDecentralization />
</div> </div>
</section> </section>

View File

@@ -0,0 +1,43 @@
<script setup>
// import HomeHero from '@/components/sections/home/HomeHero.vue'
// import HomePlatform from '@/components/sections/home/HomePlatform.vue'
// import HomePrinciples from '@/components/sections/home/HomePrinciples.vue'
// import HomeEcosystem from '@/components/sections/home/HomeEcosystem.vue'
// import HomeCTA from '@/components/sections/home/HomeCTA.vue'
</script>
<template>
<!-- <div class="flex flex-col">
<section class="border-b border-border">
<div class="container mx-auto">
<HomeHero />
</div>
</section>
<section class="border-b border-border">
<div class="container mx-auto">
<HomePlatform />
</div>
</section>
<section class="border-b border-border">
<div class="container mx-auto">
<HomePrinciples />
</div>
</section>
<section class="border-b border-border">
<div class="container mx-auto">
<HomeEcosystem />
</div>
</section>
<section>
<div class="container mx-auto">
<HomeCTA />
</div>
</section>
</div> -->
</template>

55
src/views/Modules.vue Normal file
View File

@@ -0,0 +1,55 @@
<script setup>
import ModulesHero from '@/components/sections/modules/ModulesHero.vue'
import ModulesOverview from '@/components/sections/modules/ModulesOverview.vue'
import ModulesCategories from '@/components/sections/modules/ModulesCategories.vue'
import ModulesExamples from '@/components/sections/modules/ModulesExamples.vue'
import ModulesHowTheyWork from '@/components/sections/modules/ModulesHowTheyWork.vue'
import ModulesSecurity from '@/components/sections/modules/ModulesSecurity.vue'
import ModulesCTA from '@/components/sections/modules/ModulesCTA.vue'
</script>
<template>
<div class="flex flex-col">
<section class="border-b border-border">
<div class="container mx-auto">
<ModulesHero />
</div>
</section>
<section class="border-b border-border">
<div class="container mx-auto">
<ModulesOverview />
</div>
</section>
<section class="border-b border-border bg-card">
<div class="container mx-auto">
<ModulesCategories />
</div>
</section>
<section class="border-b border-border">
<div class="container mx-auto">
<ModulesExamples />
</div>
</section>
<section class="border-b border-border bg-card">
<div class="container mx-auto">
<ModulesHowTheyWork />
</div>
</section>
<section class="border-b border-border">
<div class="container mx-auto">
<ModulesSecurity />
</div>
</section>
<section>
<div class="container mx-auto">
<ModulesCTA />
</div>
</section>
</div>
</template>

17
src/views/Roadmap.vue Normal file
View File

@@ -0,0 +1,17 @@
<script setup>
import UnderConstruction from "@/components/sections/UnderConstruction.vue"
</script>
<template>
<div class="flex flex-col">
<section class="">
<div class="container mx-auto">
<UnderConstruction />
</div>
</section>
</div>
</template>

17
src/views/Security.vue Normal file
View File

@@ -0,0 +1,17 @@
<script setup>
import UnderConstruction from "@/components/sections/UnderConstruction.vue"
</script>
<template>
<div class="flex flex-col">
<section class="">
<div class="container mx-auto">
<UnderConstruction />
</div>
</section>
</div>
</template>

View File

@@ -1,72 +0,0 @@
<script setup>
import { ref } from "vue"
import Card from "@/components/ui/Card.vue"
import CardContent from "@/components/ui/CardContent.vue"
import {
AccordionRoot,
AccordionItem,
AccordionHeader,
AccordionTrigger,
AccordionContent
} from "radix-vue"
import Button from "@/components/ui/Button.vue"
import Input from "@/components/ui/Input.vue"
import TextArea from "@/components/ui/TextArea.vue"
import Label from "@/components/ui/Label.vue"
import { Search, BookOpen, Zap, Mail } from "lucide-vue-next"
import { RouterLink } from "vue-router"
import SupportHero from "@/components/sections/support/SupportHero.vue"
import SupportQuickLinks from "@/components/sections/support/SupportQuickLinks.vue"
import SupportFAQ from "@/components/sections/support/SupportFAQ.vue"
import SupportVideos from "@/components/sections/support/SupportVideos.vue"
import SupportGettingStarted from "@/components/sections/support/SupportGettingStarted.vue"
import SupportContactForm from "@/components/sections/support/SupportContactForm.vue"
import UnderConstruction from "@/components/sections/UnderConstruction.vue"
</script>
<template>
<div class="flex flex-col">
<section class="border-b border-border">
<div class="container mx-auto">
<SupportHero />
</div>
</section>
<section class="border-b border-border">
<div class="container mx-auto">
<SupportQuickLinks />
</div>
</section>
<section class="border-b border-border">
<div class="container mx-auto">
<SupportFAQ />
</div>
</section>
<section class="border-b border-border">
<div class="container mx-auto">
<SupportVideos />
</div>
</section>
<section class="border-b border-border">
<div class="container mx-auto">
<SupportGettingStarted />
</div>
</section>
<section class="">
<div class="container mx-auto">
<SupportContactForm />
</div>
</section>
<section class="">
<div class="container mx-auto">
<UnderConstruction />
</div>
</section>
</div>
</template>