Feature: #79622 - Introducing Frame Class for Fluid Styled Content
See forge#79622
Description
In CSS Styled Content it is possible to provide additional CSS classes for the wrapping container element. This feature is now available for Fluid Styled Content, too.
The default layout of Fluid Styled Content is now passing the value of
Frame Class
directly to the template and prefixes the value by default
with frame-<key>
.
Implementation in Fluid Styled Content
<div id="c{data.uid}" class="frame frame-{data.frame_class} ...">
...
</div>
Copied!
Explanation of Keys and Effects of Frame Classes
Name | Key | CSS Class | Additional Effects |
---|---|---|---|
Default | default | frame-default |
|
Ruler Before | ruler-before | frame-ruler-before | A ruler is added after the output. |
Ruler After | ruler-after | frame-ruler-after | A ruler is added after the output. |
Indent | indent | frame-indent | Margin of 15% is added to the left and right side. |
Indent, 33/66% | intent-left | frame-indent-left | Margin of 33% is added to the left side. |
Indent, 66/33% | indent-right | frame-indent-right | Margin of 33% is added to the right side. |
No Frame | none | (none) | No Frame is rendered. |
Please note that you need to include the optional static template "Fluid Styled Content Styling" to have a visual effect on the new added CSS classes.
Edit Predefined Options
TCEFORM.tt_content.frame_class {
removeItems = default,ruler-before,ruler-after,indent,indent-left,indent-right,none
addItems {
superframe = LLL:EXT:extension/Resources/Private/Language/locallang.xlf:superframe
}
}
Copied!
$GLOBALS['TCA']['tt_content']['columns']['frame_class']['config']['items'][] = [
0 = LLL:EXT:extension/Resources/Private/Language/locallang.xlf:superframe
1 = superframe
];
Copied!
Impact
Frame Class
is now available to all Fluid Styled Content elements.