---
import Footer from "../../../components/Footer.astro"
import Layout from "../../../layouts/Layout.astro"
import {Calendar, ChevronDown} from "@lucide/astro"
import path from "../../../utils/path.ts"

const program = [
    {
        title: "Warum ist Big Tech gefährlich?",
        description: "Einfach, sicher und verantwortungsvoll digital unterwegs - eine Herausforderung!"
    },
    {
        title: "Passwort-Manager",
        description: "Passwörter im Alltag sicher merken"
    },
    {
        title: "Messenger",
        description: "Alternativen zu SMS, WhatsApp, oder andere Messenger von Großkonzernen"
    },
    {
        title: "Datenschutzrechte für Betroffene",
        description: "Nutze deine Recht auf Auskunft, Löschen, Korrektur und mehr"
    },
    {
        title: "Die eigene Cloud",
        description: "Nextcloud Funktionen und interessante Features"
    },
    {
        title: "Office-Anwedungen",
        description: "Alternativen zu Microsoft Word, PowerPoint und Excel im Vergleich"
    },
    {
        title: "Digitale Unabhängigkeit - wie sieht es bei Euch aus?",
        description: "Austausch mit Gruppen und Initiativen über Maßnahmen zur digitalen Unabhängigkeit"
    },
    {
        title: "Alles digital?!",
        description: "Digitale Zwänge und Alternativen"
    },
    {
        title: "Digitale Mythen",
        description: "Cookie-Banner, Datenschutz und was Hacking wirklich ist"
    },
    {
        title: "OpenStreetMap",
        description: "Mehr Souveränität bei Karten und Geodaten"
    },
]
---

<Layout>
  <div class="bg-base-100">
    <div class="container p-8 max-w-2xl mx-auto">
      <h2 class="text-4xl text-center font-semibold">Wir haben Vorträge und Workshops zu folgenden Themen:</h2>
    </div>
  </div>
  <div class="bg-base-200 py-20">
    <div class="container p-8 mx-auto">
      <div class="flex flex-col gap-5 items-center">
          {program.map(element => (
              <div class="pb-5 not-last-of-type:border-b w-full text-center">
                <span class="font-bold">{element.title}</span>
                <p>{element.description}</p>
              </div>
          ))}
      </div>
    </div>
  </div>
  <Footer/>
</Layout>