add configurable support for fluid layouts

1 files changed, 59 insertions, 53 deletions

diff --git a/templates/admin_themes_manager.tpl b/templates/admin_themes_manager.tpl
index 1bfc227..875faa1 100644
--- a/templates/admin_themes_manager.tpl
+++ b/templates/admin_themes_manager.tpl
@@ -18,71 +18,77 @@
 		{jstabs}
 			{jstab title="Site Theme"}
 				{legend legend="Pick Site Theme"}
-					<ul class="data">
-						{foreach from=$stylesList item=s}
-							<li class="item">
-								<legend {if $style eq $s.style}class="highlight"{/if}>
-									{if $style eq $s.style}
-										{booticon iname="icon-ok"  ipackage="icons"  iexplain="Current Theme"}&nbsp;
-									{/if}
-									<a href="{$smarty.const.THEMES_PKG_URL}admin/admin_themes_manager.php?site_style={$s.style}">{$s.style|replace:"_":" "}</a>
-								</legend>
+					{foreach from=$stylesList item=s}
+						<legend {if $style eq $s.style}class="highlight"{/if}>
+							{if $style eq $s.style}
+								{booticon iname="icon-ok"  ipackage="icons"  iexplain="Current Theme"}&nbsp;
+							{/if}
+							<a href="{$smarty.const.THEMES_PKG_URL}admin/admin_themes_manager.php?site_style={$s.style}">{$s.style|replace:"_":" "}</a>
+						</legend>
 
-								{if $s.style_info.preview}
-									<a class="floatright" href="{$smarty.const.THEMES_PKG_URL}admin/admin_themes_manager.php?site_style={$s.style}">
-										<img class="thumb" src="{$s.style_info.preview}" alt="{tr}Theme Preview{/tr}" title="{$s.style}" />
-									</a>
-								{/if}
+						{if $s.style_info.preview}
+							<a class="floatright" href="{$smarty.const.THEMES_PKG_URL}admin/admin_themes_manager.php?site_style={$s.style}">
+								<img class="thumb" src="{$s.style_info.preview}" alt="{tr}Theme Preview{/tr}" title="{$s.style}" />
+							</a>
+						{/if}
 
-								<a class="btn btn-primary" href="{$smarty.const.THEMES_PKG_URL}admin/admin_themes_manager.php?site_style={$s.style}">{tr}Select{/tr} {$s.style|replace:"_":" "}</a>
-								{$s.style_info.description}
-								{if $s.alternate}
-									<h3>{tr}Variations of this style{/tr}</h3>
-									<ul>
-										{foreach from=$s.alternate key=variation item=d}
-											<li><a href="{$smarty.const.THEMES_PKG_URL}admin/admin_themes_manager.php?site_style={$s.style}&amp;style_variation={$variation}">{$variation|replace:"_":" "}</a></li>
-										{/foreach}
-									</ul>
-								{/if}
-
-								<div class="clear"></div>
-							</li>
-						{/foreach}
-					</ul>
+						<a class="btn btn-primary" href="{$smarty.const.THEMES_PKG_URL}admin/admin_themes_manager.php?site_style={$s.style}">{tr}Select{/tr} {$s.style|replace:"_":" "}</a>
+						{$s.style_info.description}
+						{if $s.alternate}
+							<h3>{tr}Variations of this style{/tr}</h3>
+							<ul>
+								{foreach from=$s.alternate key=variation item=d}
+									<li><a href="{$smarty.const.THEMES_PKG_URL}admin/admin_themes_manager.php?site_style={$s.style}&amp;style_variation={$variation}">{$variation|replace:"_":" "}</a></li>
+								{/foreach}
+							</ul>
+						{/if}
+					{/foreach}
 				{/legend}
 			{/jstab}
 
 			{jstab title="Theme Layout"}
+				{form}
 				<p class="help">
 					{tr}Here you can pick the layout of the site style. this will basically rearrange the positions of the three columns.
 					<br />Please note that not all styles support this method of layout selection. Themes that support the style layout selection have a note of it in the description.
 					<br />For more information on the layouts and how to tweak them, please visit the <a class="external" href="http://www.bitweaver.org/wiki/ThemeLayouts">ThemeLayouts</a>{/tr}
 				</p>
 
-				{legend legend="Pick Theme Layout"}
-					<ul id="layoutgala">
-						{foreach from=$styleLayouts key=key item=layout}
-							<li class="{cycle values="even,odd"}">
-								<a {if $gBitSystem->getConfig(site_style_layout) == $key}class="highlight" {/if}href="{$smarty.const.THEMES_PKG_URL}admin/admin_themes_manager.php?site_style_layout={$key}">
-									{if $layout.gif}<img src="{$smarty.const.THEMES_PKG_URL}layouts/{$layout.gif}" alt="{tr}Layout{/tr}: {$key}" title="{tr}Layout{/tr}: {$key}"/><br />{/if}
-									{if $gBitSystem->getConfig(site_style_layout) == $key}{booticon iname="icon-ok"  ipackage="icons"  iexplain="Current Theme Layout"}{/if}
-									{$key|replace:"_":" "}
-									{if $layout.txt}<br />{include file="`$smarty.const.THEMES_PKG_PATH`layouts/`$layout.txt`"}{/if}
-								</a>
-							</li>
-						{/foreach}
-					</ul>
+				{legend legend="Theme Layout"}
+					<div class="control-group">
+						{formlabel label="Header Layout"}
+						{forminput}
+						<select name="layout-header">
+							<option value="">{tr}Fixed Width{/tr}</option>
+							<option value="-fluid" {if $gBitSystem->getConfig('layout-header')}selected="selected"{/if}>{tr}Fluid Full Width{/tr}</option>
+						</select>
+						{/forminput}
+					</div>
+					<div class="control-group">
+						{formlabel label="Main Content Section Layout"}
+						{forminput}
+						<select name="layout-maincontent">
+							<option value="">{tr}Fixed Width{/tr}</option>
+							<option value="-fluid" {if $gBitSystem->getConfig('layout-maincontent')}selected="selected"{/if}>{tr}Fluid Full Width{/tr}</option>
+						</select>
+						{/forminput}
+					</div>
+					<div class="control-group">
+						{formlabel label="Header Layout"}
+						{forminput}
+						<select name="layout-footer">
+							<option value="">{tr}Fixed Width{/tr}</option>
+							<option value="-fluid" {if $gBitSystem->getConfig('layout-footer')}selected="selected"{/if}>{tr}Fluid Full Width{/tr}</option>
+						</select>
+						{/forminput}
+					</div>
+					<div class="control-group submit">
+						{forminput}
+							<input type="submit" class="btn" name="save_layout" value="{tr}Save Layout{/tr}"/>
+						{/forminput}
+					</div>
 				{/legend}
-
-				<ul class="help">
-					<li class="bg_ace b3-s-fff">{tr}Header: Found at the top of a website - contains website title and slogan.{/tr}</li>
-					<li class="bg_eca b3-s-fff">{tr}Content: The main content bearing section of a website.{/tr}</li>
-					<li class="bg_aec b3-s-fff">{tr}Navigation: Usually found on the left hand side - frequently contains links to important pages.{/tr}</li>
-					<li class="bg_cae b3-s-fff">{tr}Extra: Sometimes found on the right hand side - frequently contains adidtional information and links.{/tr}</li>
-					<li class="bg_cea b3-s-fff">{tr}Footer: Usually found at the bottom of a website - contains copyright information and powered by link.{/tr}</li>
-					<li class="bg_eee b3-s-fff">{tr}px: Indicates that the block is set using a defined pixel width.{/tr}</li>
-					<li class="bg_eee b3-s-fff">{tr}%: Indicates that the block is set using a percentage, making it fluid in terms of browser window width.{/tr}</li>
-				</ul>
+				{/form}
 			{/jstab}
 
 			{jstab title="Icon Theme"}
@@ -94,7 +100,7 @@
 						If you are a developer and you want to view a list of available icons, you can do this with the {smartlink ititle="Icon Browser" ifile="icon_browser.php"}.
 					</p>
 
-					<ul class="data">
+					<ul>
 						{foreach from=$iconThemes item=s}
 							<li class="item">
 								<legend {if $style eq $s.style}class="highlight"{/if}>