Zebra striping for configuration groups.

This commit is contained in:
Matthias Mees 2013-06-22 13:57:08 +02:00
parent 08fe4a0c96
commit 95b5764edf
3 changed files with 29 additions and 4 deletions

View File

@ -13,19 +13,20 @@
{if $config|@sizeof > 1}
<h3>{if $allowToggle}<a id="optionel{$category@iteration}" class="show_config_option" href="#el{$category@index}" title="{$CONST.TOGGLE_OPTION}"><span class="icon-plus"></span> {$category.title}</a>{else}{$category.title}{/if}</h3>
{/if}
<fieldset id="el{$category@index}" class="config_optiongroup{if $config_groupkeys@last} config_optiongroup_last{/if} additional_info">
<fieldset id="el{$category@index}" class="config_optiongroup{if $config_groupkeys@last} config_optiongroup_last{/if} additional_info option_list">
<legend class="visuallyhidden">{$category.description}</legend>
{foreach $category.items as $item}
{cycle assign='zebra_class' values='odd,even'}
{if $item.guessedInput}
{if $item.type == 'bool'}
<fieldset class="clearfix">
<fieldset class="clearfix {$zebra_class}">
<legend><span>{$item.title} <span>{$item.description}</span></span></legend>
<div class="clearfix grouped">
{$item.guessedInput}
</div>
</fieldset>
{else}
<div class="clearfix form_{if $item.type == 'list'}select{elseif $item.type == 'multilist'}multiselect{elseif $item.type == 'textarea'}area{else}field{/if}">
<div class="clearfix {$zebra_class} form_{if $item.type == 'list'}select{elseif $item.type == 'multilist'}multiselect{elseif $item.type == 'textarea'}area{else}field{/if}">
<label for="{$item.var}">{$item.title}<span>{$item.description}</span></label>
{$item.guessedInput}
</div>

View File

@ -730,6 +730,7 @@ function highlightComment(id, checkvalue) {
});
$('#show_config_all').click(function(e) {
// TODO: switch toggle icon on $(this)
var $container = $(this).attr('href');
var $toggleIcons = $($container).find('.show_config_option > span');
var $toggleOption = $($container).find('.config_optiongroup');

View File

@ -877,7 +877,7 @@ input[type=checkbox],
}
.serendipity_commentDirection,
.configuration_group fieldset > fieldset,
.configuration_group ul .form_check,
#preview,
.form_field,
.form_area,
@ -892,6 +892,25 @@ input[type=checkbox],
margin-bottom: .75em;
}
.configuration_group fieldset > fieldset,
.configuration_group .form_field,
.configuration_group .form_area,
.configuration_group .form_check,
.configuration_group .form_radio,
.configuration_group .form_select,
.configuration_group .form_multiselect {
margin-top: 0;
margin-bottom: 0;
}
.configuration_group fieldset > fieldset,
.configuration_group .form_field,
.configuration_group .form_area,
.configuration_group .form_select,
.configuration_group .form_multiselect {
padding: .75em 0;
}
.importer_data dd,
.form_buttons > input {
margin-bottom: .75em;
@ -1441,6 +1460,7 @@ form > .button_link:first-of-type {
}
.zebra_list,
.option_list,
#categories .odd,
#categories .even,
#serendipity_image_folders .odd,
@ -1449,12 +1469,15 @@ form > .button_link:first-of-type {
}
.zebra_list > li,
.option_list .odd,
.option_list .even,
#categories,
#serendipity_image_folders {
border-bottom: 1px solid #aaa;
}
.zebra_list > .odd,
.option_list > .odd,
#categories .odd,
#serendipity_image_folders .odd {
background: #eee;