Fixed design and texts
This commit is contained in:
87
src/components/sections/about/AboutOurMission.vue
Normal file
87
src/components/sections/about/AboutOurMission.vue
Normal file
@@ -0,0 +1,87 @@
|
||||
<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>
|
||||
Reference in New Issue
Block a user