orasche
78af83d2e3
thumbnail of the actual image (hero background, intro image, insights cover), key copy in the summary line, full details expanded; card and intro-paragraph previews are wrapped in the same mechanism - New SubmarketPluginPreview for vitec_usecaselist / vitec_productfeature / vitec_productlist: instead of bare standard boxes they now list the selected story titles (flagging stories that still lack a quote), the featured product and the hand-picked products in order - Container-style collapse for whole page-module COLUMNS: a chevron at the right of every column header folds a section down to its title row, state kept per page and colPos in localStorage - the slot view of a sub-market page folds to six slim bands - Previews sit under the page module's pointer-events lock and its click-to-edit layer: pointer events are re-enabled inside the collapse markup and the toggle runs on pointerdown in the capture phase - Two more v14 removals fixed on the way, both latent in the OLDER preview classes too (Usecaseshow, Modelcard would have crashed the page module): GridColumnItem::getRecord() now returns a Domain\Record object, and StandaloneView is gone - previews normalize the record via a shared helper and render through the ViewFactory
98 lines
3.5 KiB
HTML
Executable File
98 lines
3.5 KiB
HTML
Executable File
<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers" data-namespace-typo3-fluid="true">
|
|
<f:layout name="Preview"/>
|
|
<f:section name="Content">
|
|
|
|
<f:asset.css identifier="vitec-backend-preview" href="EXT:vitec/Resources/Public/Css/backend-preview.css"/>
|
|
<f:asset.script identifier="vitec-backend-collapse" src="EXT:vitec/Resources/Public/JavaScript/backend-preview-collapse.js"/>
|
|
|
|
<details class="vitec-collapse">
|
|
<summary>
|
|
<span class="vitec-collapse__label">Intro Paragraph</span>
|
|
<span class="vitec-collapse__hint">{data.header}</span>
|
|
</summary>
|
|
<div class="vitec-collapse__body">
|
|
<div class="vitec-preview">
|
|
<div class="vitec-preview__body">
|
|
<div class="vitec-preview__label">VITEC · Intro Paragraph</div>
|
|
|
|
<h3 class="vitec-preview__headline">
|
|
<f:if condition="{data.header}">
|
|
<f:then>{data.header}</f:then>
|
|
<f:else>
|
|
<em style="color:#c00;">⚠ Headline missing</em>
|
|
</f:else>
|
|
</f:if>
|
|
</h3>
|
|
|
|
<f:if condition="{data.subheader}">
|
|
<div class="vitec-preview__subline">{data.subheader}</div>
|
|
</f:if>
|
|
|
|
<f:if condition="{data.bodytext}">
|
|
<div class="vitec-preview__body-text">
|
|
<f:format.stripTags>{data.bodytext}</f:format.stripTags>
|
|
</div>
|
|
</f:if>
|
|
|
|
<f:if condition="{data.button_text}">
|
|
<div class="vitec-preview__ctas">
|
|
<span class="vitec-preview__cta-btn vitec-preview__cta-btn--{data.button_style}">
|
|
{data.button_text} →
|
|
</span>
|
|
</div>
|
|
</f:if>
|
|
</div>
|
|
|
|
<f:comment>Settings sidebar</f:comment>
|
|
<div class="vitec-preview__settings">
|
|
|
|
<span class="vitec-badge">
|
|
<f:switch expression="{data.intro_layout_variant}">
|
|
<f:case value="variant_1">▤ Variant 1</f:case>
|
|
<f:case value="variant_2">▥ Variant 2</f:case>
|
|
<f:case value="variant_3">▤ Variant 3</f:case>
|
|
<f:case value="variant_4">▥ Variant 4</f:case>
|
|
<f:defaultCase>{data.intro_layout_variant}</f:defaultCase>
|
|
</f:switch>
|
|
</span>
|
|
|
|
<f:if condition="{data.button_text}">
|
|
<span class="vitec-badge">
|
|
<span class="vitec-badge__dot vitec-badge__dot--{data.button_style}"></span>
|
|
Button: {data.button_style}
|
|
</span>
|
|
</f:if>
|
|
|
|
<f:if condition="{data.fullwidth}">
|
|
<span class="vitec-badge">↔ Full width</span>
|
|
</f:if>
|
|
|
|
<f:comment>
|
|
The dot modifiers in backend-preview.css are fixed palette classes;
|
|
this colour is free-form, so the swatch carries the stored hex as an
|
|
inline style. The outline keeps white visible on the light preview.
|
|
</f:comment>
|
|
<f:if condition="{data.background_color}">
|
|
<span class="vitec-badge">
|
|
<span class="vitec-badge__dot" style="background: {data.background_color}; border: 1px solid #999;"></span>
|
|
BG: {data.background_color}
|
|
</span>
|
|
</f:if>
|
|
|
|
<f:if condition="{data.button_text} && {data.button_link.url} == ''">
|
|
<span class="vitec-badge vitec-badge--warning">⚠ Button text without link</span>
|
|
</f:if>
|
|
|
|
<f:if condition="{data.debug}">
|
|
<span class="vitec-badge vitec-badge--warning">⚙ Debug ON</span>
|
|
</f:if>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</details>
|
|
|
|
</f:section>
|
|
</html>
|