Add team roles and content management updates

2026-06-25 19:52:46 +02:00
parent 54293f4c45
commit 693769e5a8
126 changed files with 6966 additions and 738 deletions
@@ -0,0 +1,74 @@
+<template>
+  <Teleport to="body">
+    <div
+      v-if="open"
+      class="fixed inset-0 z-[120] flex items-center justify-center bg-[#25123f]/70 px-4 py-8 backdrop-blur-sm"
+      @click.self="$emit('close')"
+    >
+      <div class="max-h-[88vh] w-full max-w-4xl overflow-hidden rounded-[34px] border border-violet-100 bg-white shadow-[0_34px_100px_rgba(38,18,63,0.35)]">
+        <div class="flex items-start justify-between gap-4 border-b border-violet-100 bg-gradient-to-r from-[#f8f2ff] via-white to-[#fff1f8] px-7 py-6">
+          <div>
+            <p class="text-xs font-semibold uppercase tracking-[0.24em] text-violet-500">Footer Preview</p>
+            <h3 class="mt-2 text-xl font-bold text-slate-900">{{ title }}</h3>
+            <p v-if="url" class="mt-2 break-all text-sm text-slate-500">{{ url }}</p>
+          </div>
+          <button
+            type="button"
+            class="grid h-11 w-11 shrink-0 place-items-center rounded-full bg-violet-100 text-violet-600 transition hover:bg-violet-200"
+            aria-label="Preview schließen"
+            @click="$emit('close')"
+          >
+            <X class="h-5 w-5" />
+          </button>
+        </div>
+        <div class="max-h-[calc(88vh-140px)] overflow-y-auto bg-[radial-gradient(circle_at_top,#f7ecff_0%,#ffffff_48%,#f7f1ff_100%)] px-7 py-6 text-sm leading-7 text-slate-600">
+          <div
+            v-if="contentHtml"
+            class="footer-preview-content rounded-[22px] border border-violet-50 bg-white/90 px-5 py-4 shadow-sm"
+            v-html="contentHtml"
+          />
+          <p v-else class="rounded-[18px] border border-amber-100 bg-amber-50 px-4 py-3 font-semibold text-amber-800">
+            Für diese Footer-Seite ist noch kein Inhalt hinterlegt.
+          </p>
+        </div>
+      </div>
+    </div>
+  </Teleport>
+</template>
+
+<script setup lang="ts">
+import { X } from '@lucide/vue'
+
+defineProps<{
+  open: boolean
+  title: string
+  url: string
+  contentHtml: string
+}>()
+
+defineEmits<{
+  close: []
+}>()
+</script>
+
+<style scoped>
+.footer-preview-content :deep(p) {
+  margin: 0 0 0.85rem;
+}
+
+.footer-preview-content :deep(p:last-child),
+.footer-preview-content :deep(ul:last-child),
+.footer-preview-content :deep(ol:last-child) {
+  margin-bottom: 0;
+}
+
+.footer-preview-content :deep(ul),
+.footer-preview-content :deep(ol) {
+  margin: 0 0 0.85rem 1.25rem;
+  padding-left: 1rem;
+}
+
+.footer-preview-content :deep(li) {
+  margin: 0.2rem 0;
+}
+</style>