34 lines
1.2 KiB
Vue
34 lines
1.2 KiB
Vue
<script setup>
|
|
import { defineProps } from 'vue';
|
|
|
|
const props = defineProps({
|
|
block: {
|
|
type: Object,
|
|
required: true,
|
|
},
|
|
});
|
|
|
|
const faqs = props.block.faqs || [
|
|
{ question: 'Hva er dette?', answer: 'Dette er et eksempel på et spørsmål og svar.' },
|
|
{ question: 'Hvordan fungerer det?', answer: 'Du legger til innhold og publiserer siden.' },
|
|
];
|
|
</script>
|
|
|
|
<template>
|
|
<section class="relative py-20 md:py-24 overflow-hidden mx-auto max-w-[1280px] bg-black">
|
|
<div class="container mx-auto px-6 lg:px-20">
|
|
<h2 class="text-amber-600 text-xl md:text-2xl font-serif mb-6">{{ block.title || 'Vanlige spørsmål' }}</h2>
|
|
<div class="space-y-4">
|
|
<details v-for="(faq, index) in faqs" :key="index" class="bg-gray-700 p-4 rounded-md shadow">
|
|
<summary class="cursor-pointer font-medium text-white">{{ faq.question }}</summary>
|
|
<p class="mt-2 text-gray-300">{{ faq.answer }}</p>
|
|
</details>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
</template>
|
|
|
|
<style scoped>
|
|
/* Optional collapse styles */
|
|
</style>
|