ISMAIL MASSERAN
130 lines
5.1 KiB
Vue
130 lines
5.1 KiB
Vue
<script lang="ts" setup>
|
|
import {
|
|
AccordionRoot,
|
|
AccordionItem,
|
|
AccordionTrigger,
|
|
AccordionContent,
|
|
} from "@/components/ui/accordion";
|
|
import {
|
|
Preview,
|
|
SectionTitle,
|
|
SectionContent,
|
|
InstallPackage,
|
|
PreviewCode,
|
|
} from "@/components/docs";
|
|
import { Box } from "@/components/ui/box";
|
|
</script>
|
|
|
|
<template>
|
|
<div id="preview" class="-mt-20">
|
|
<Preview>
|
|
<template #preview>
|
|
<Box raised="single" class="w-full">
|
|
<AccordionRoot class="w-full" :default-value="['product-information']">
|
|
<AccordionItem value="product-information">
|
|
<AccordionTrigger>Product Information</AccordionTrigger>
|
|
<AccordionContent>
|
|
<p class="mb-2">
|
|
Our flagship product combines cutting-edge technology with
|
|
sleek design. Built with premium materials, it offers
|
|
unparalleled performance and reliability.
|
|
</p>
|
|
<p>
|
|
Key features include advanced processing capabilities, and an
|
|
intuitive user interface designed for both beginners and
|
|
experts.
|
|
</p>
|
|
</AccordionContent>
|
|
</AccordionItem>
|
|
<AccordionItem value="shipping-details">
|
|
<AccordionTrigger>Shipping Details</AccordionTrigger>
|
|
<AccordionContent>
|
|
<p class="mb-2">
|
|
We offer worldwide shipping through trusted courier partners.
|
|
Standard delivery takes 3-5 business days, while express
|
|
shipping ensures delivery within 1-2 business days.
|
|
</p>
|
|
<p>
|
|
All orders are carefully packaged and fully insured. Track
|
|
your shipment in real-time through our dedicated tracking
|
|
portal.
|
|
</p>
|
|
</AccordionContent>
|
|
</AccordionItem>
|
|
<AccordionItem value="return-policy">
|
|
<AccordionTrigger>Return Policy</AccordionTrigger>
|
|
<AccordionContent>
|
|
<p class="mb-2">
|
|
We stand behind our products with a comprehensive 30-day
|
|
return policy. If you're not completely satisfied, simply
|
|
return the item in its original condition.
|
|
</p>
|
|
<p>
|
|
Our hassle-free return process includes free return shipping
|
|
and full refunds processed within 48 hours of receiving the
|
|
returned item.
|
|
</p>
|
|
</AccordionContent>
|
|
</AccordionItem>
|
|
</AccordionRoot>
|
|
</Box>
|
|
</template>
|
|
<template #code>
|
|
<PreviewCode>
|
|
{{ `
|
|
<Box raised="single" class="w-full">
|
|
<AccordionRoot class="w-full" :default-value="['product-information']">
|
|
<AccordionItem value="product-information">
|
|
<AccordionTrigger>Product Information</AccordionTrigger>
|
|
<AccordionContent>
|
|
<p class="mb-2">
|
|
Our flagship product combines cutting-edge technology with
|
|
sleek design. Built with premium materials, it offers
|
|
unparalleled performance and reliability.
|
|
</p>
|
|
<p>
|
|
Key features include advanced processing capabilities, and an
|
|
intuitive user interface designed for both beginners and
|
|
experts.
|
|
</p>
|
|
</AccordionContent>
|
|
</AccordionItem>
|
|
<AccordionItem value="shipping-details">
|
|
<AccordionTrigger>Shipping Details</AccordionTrigger>
|
|
<AccordionContent>
|
|
<p class="mb-2">
|
|
We offer worldwide shipping through trusted courier partners.
|
|
Standard delivery takes 3-5 business days, while express
|
|
shipping ensures delivery within 1-2 business days.
|
|
</p>
|
|
<p>
|
|
All orders are carefully packaged and fully insured. Track
|
|
your shipment in real-time through our dedicated tracking
|
|
portal.
|
|
</p>
|
|
</AccordionContent>
|
|
</AccordionItem>
|
|
<AccordionItem value="return-policy">
|
|
<AccordionTrigger>Return Policy</AccordionTrigger>
|
|
<AccordionContent>
|
|
<p class="mb-2">
|
|
We stand behind our products with a comprehensive 30-day
|
|
return policy. If you're not completely satisfied, simply
|
|
return the item in its original condition.
|
|
</p>
|
|
<p>
|
|
Our hassle-free return process includes free return shipping
|
|
and full refunds processed within 48 hours of receiving the
|
|
returned item.
|
|
</p>
|
|
</AccordionContent>
|
|
</AccordionItem>
|
|
</AccordionRoot>
|
|
</Box>
|
|
` }}
|
|
</PreviewCode>
|
|
</template>
|
|
</Preview>
|
|
</div>
|
|
</template>
|