Created
July 24, 2016 10:12
-
-
Save danielkoch/b5cb4ad5be5cd6389684dd22190acf2b to your computer and use it in GitHub Desktop.
FED fluid colum for TYPO3 4.7
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
{namespace fed=Tx_Fed_ViewHelpers} | |
{namespace flux=Tx_Flux_ViewHelpers} | |
{namespace v=Tx_Vhs_ViewHelpers} | |
<f:layout name="FCE" /> | |
<f:section name="Configuration"> | |
<f:if condition="{columns} < 1"> | |
<fed:data.var name="columns" type="integer">1</fed:data.var> | |
</f:if> | |
<flux:flexform wizardTab="FCE" id="contentColumns" enabled="TRUE" icon="columns.png"> | |
<flux:flexform.field.input name="header"/> | |
<flux:flexform.field.checkbox name="line" /> | |
<flux:flexform.field.select name="columnClass" | |
items="{ | |
0: {0: '100', 1: '100%'}, | |
1: {0: '50-50', 1: '50% - 50%'}, | |
2: {0: '66-33', 1: '66% - 33%'}, | |
3: {0: '33-33-33', 1: '33% - 33% - 33%'}, | |
4: {0: '25-25-25-25', 1: '25% - 25% - 25% - 25%'} | |
}" maxItems="1" /> | |
<flux:flexform.grid> | |
<flux:flexform.grid.row> | |
<f:for each="{columnClass->fed:explode(glue: '-')}" as="className" iteration="iteration"> | |
<flux:flexform.grid.column style="width: {className}%"> | |
<flux:flexform.content name="column{iteration.cycle}" /> | |
</flux:flexform.grid.column> | |
</f:for> | |
</flux:flexform.grid.row> | |
</flux:flexform.grid> | |
</flux:flexform> | |
</f:section> | |
<f:section name="Preview"> | |
{columnClass} | |
<flux:widget.grid /> | |
</f:section> | |
<f:section name="Main"> | |
<f:if condition="{header}"> | |
<h2 class="section-headline">{header}</h2> | |
</f:if> | |
<div class="line size-{columnClass} page-gap"> | |
<f:for each="{fed:data.func(func: 'explode', arguments: {0: '-', 1: columnClass})}" as="className" iteration="iteration"> | |
<div class="unit size-{className} unit-{iteration.cycle}"> | |
<flux:flexform.renderContent area="column{iteration.cycle}" /> | |
</div> | |
</f:for> | |
</div> | |
<f:if condition="{line}"> | |
<hr/> | |
</f:if> | |
</f:section> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment