{namespace flux=Tx_Flux_ViewHelpers}
{namespace v=Tx_Vhs_ViewHelpers}

<f:layout name="Content"/>

<div xmlns="http://www.w3.org/1999/xhtml"
	 xmlns:flux="http://fedext.net/ns/flux/ViewHelpers"
	 xmlns:v="http://fedext.net/ns/vhs/ViewHelpers"
	 xmlns:f="http://typo3.org/ns/fluid/ViewHelpers">

	<f:section name="Configuration">
		<v:var.set name="ts" value="{v:var.typoscript(path: 'plugin.tx_fluidcontentgrids.settings')}"/>

		<flux:flexform wizardTab="Grids" id="gridColsFour"
					   icon="{v:extension.path.resources(path: 'Icons/icon-row.gif')}">

			<flux:flexform.sheet name="display">
				<flux:flexform.field.checkbox name="fluidRow"/>
			</flux:flexform.sheet>

			<flux:flexform.grid>
				<flux:flexform.grid.row>
					<flux:flexform.grid.column>
						<flux:flexform.content name="column1"/>
					</flux:flexform.grid.column>
					<flux:flexform.grid.column>
						<flux:flexform.content name="column2"/>
					</flux:flexform.grid.column>
					<flux:flexform.grid.column>
						<flux:flexform.content name="column3"/>
					</flux:flexform.grid.column>
					<flux:flexform.grid.column>
						<flux:flexform.content name="column4"/>
					</flux:flexform.grid.column>
				</flux:flexform.grid.row>
			</flux:flexform.grid>

		</flux:flexform>
	</f:section>

	<f:section name="Preview">
		<flux:widget.grid/>
	</f:section>

	<f:section name="Main">
		<div class="row{f:if(condition: fluidRow, then: '-fluid')}">
			<div class="span3">
				<flux:flexform.renderContent area="column1"/>
			</div>
			<div class="span3">
				<flux:flexform.renderContent area="column2"/>
			</div>
			<div class="span3">
				<flux:flexform.renderContent area="column3"/>
			</div>
			<div class="span3">
				<flux:flexform.renderContent area="column4"/>
			</div>
		</div>
	</f:section>

</div>