Files
nosys_web/src/components/sections/about/AboutOurMission.vue
2026-01-04 01:33:29 +10:00

87 lines
3.1 KiB
Vue

<script setup>
import Card from '@/components/ui/Card.vue';
import CardContent from '@/components/ui/CardContent.vue';
import { Target } from 'lucide-vue-next';
</script>
<template>
<section class="">
<div class="container py-24">
<div class="grid grid-cols-1 lg:grid-cols-2 gap-12 items-center">
<Card class="border-2 order-2 lg:order-1">
<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-primary mt-2" />
<div>
<h3 class="font-semibold mb-1">No Central Authority</h3>
<p class="text-sm text-muted-foreground">
Peer-to-peer connections remove central control
</p>
</div>
</div>
<div class="flex items-start gap-4">
<div class="h-2 w-2 rounded-full bg-primary mt-2" />
<div>
<h3 class="font-semibold mb-1">End-to-End Encryption</h3>
<p class="text-sm text-muted-foreground">
Communications secured and private
</p>
</div>
</div>
<div class="flex items-start gap-4">
<div class="h-2 w-2 rounded-full bg-primary mt-2" />
<div>
<h3 class="font-semibold mb-1">User Ownership</h3>
<p class="text-sm text-muted-foreground">
You own your identity and data
</p>
</div>
</div>
<div class="flex items-start gap-4">
<div class="h-2 w-2 rounded-full bg-primary mt-2" />
<div>
<h3 class="font-semibold mb-1">Open Source</h3>
<p class="text-sm text-muted-foreground">
Transparency through open code
</p>
</div>
</div>
</div>
</CardContent>
</Card>
<div class="order-1 lg:order-2">
<div
class="inline-flex items-center gap-2 px-3 py-1 text-sm bg-primary/10
text-primary rounded-full border border-primary/20 mb-6"
>
<Target class="h-4 w-4" />
Our Mission
</div>
<h2 class="text-3xl md:text-4xl font-bold mb-6">
Giving Control Back to Users
</h2>
<div class="space-y-4 text-muted-foreground leading-relaxed">
<p>
We're building a social network based on privacy, free expression and autonomy.
</p>
<p class="text-lg font-semibold text-foreground">
A truly peer-to-peer network where no one can censor or exploit you.
</p>
<p>
Decentralization + encryption + open source = independence.
</p>
</div>
</div>
</div>
</div>
</section>
</template>