Skip to content

Instantly share code, notes, and snippets.

Show Gist options
  • Save danielkoch/b5cb4ad5be5cd6389684dd22190acf2b to your computer and use it in GitHub Desktop.
Save danielkoch/b5cb4ad5be5cd6389684dd22190acf2b to your computer and use it in GitHub Desktop.
FED fluid colum for TYPO3 4.7
{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