<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>