frommeandClaude Opus 5.5
bf171285cd
Restored from a46918d (the FAQ page /skireisen/infos/allgemeine-infos/faqs/);
markup matches TYPO3 10.
Co-Authored-By: Claude Opus 5.5 <[email protected]>
41 lines
2.2 KiB
HTML
41 lines
2.2 KiB
HTML
<html data-namespace-typo3-fluid="true" lang="en"
|
|
xmlns="http://www.w3.org/1999/xhtml"
|
|
xmlns:f="http://typo3.org/ns/fluid/ViewHelpers"
|
|
xmlns:ep="http://typo3.org/ns/EP/EpTheme/ViewHelpers">
|
|
|
|
<f:if condition="{faqs}">
|
|
<div class="py-4" data-faq-target="category">
|
|
<f:if condition="{category}">
|
|
<div class="flex items-center space-x-2 pb-3">
|
|
<div class="bg-badge-gradient text-white rounded-full w-8 h-8 flex items-center justify-center">
|
|
<svg class="w-4 h-4" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor"><path d="M5.45455 15L1 18.5V3C1 2.44772 1.44772 2 2 2H17C17.5523 2 18 2.44772 18 3V15H5.45455ZM4.76282 13H16V4H3V14.3851L4.76282 13ZM8 17H18.2372L20 18.3851V8H21C21.5523 8 22 8.44772 22 9V22.5L17.5455 19H9C8.44772 19 8 18.5523 8 18V17Z"></path></svg>
|
|
</div>
|
|
<span class="headline--4 uppercase block">{category}</span>
|
|
</div>
|
|
</f:if>
|
|
<f:for each="{faqs}" as="faq">
|
|
<div class="py-4"
|
|
data-controller="collapse"
|
|
data-collapse-collapsed-value="true"
|
|
data-faq-target="entry">
|
|
<button type="button"
|
|
aria-label="Antwort anzeigen/ausblenden"
|
|
class="text-lg md:text-xl flex items-center"
|
|
data-action="collapse#toggle">
|
|
{ep:icon(icon: 'chevron-right', class: 'w-6 h-6 transition-transform duration-200 ease-in-out', data: '{collapse-target: \'icon\'}')}
|
|
<span class="text-left">
|
|
{faq.data.question}
|
|
</span>
|
|
</button>
|
|
<div class="pt-2 pl-6 transition-transform ease-out overflow-hidden origin-top transform hidden max-w-screen-md"
|
|
data-collapse-target="container"
|
|
data-rte-content>
|
|
{faq.data.answer -> f:format.html()}
|
|
</div>
|
|
</div>
|
|
</f:for>
|
|
</div>
|
|
</f:if>
|
|
|
|
</html>
|