Fixed layout for editing categories.

This commit is contained in:
Matthias Mees 2013-02-18 18:22:00 +01:00
parent 25c8884db9
commit 2de81f9d1f
2 changed files with 34 additions and 22 deletions

View File

@ -75,24 +75,6 @@
</div> </div>
<div class="clearfix"> <div class="clearfix">
<div class="form_field">
<label for="category_icon">{$CONST.IMAGE}</label>
{* TODO: this should probably become/fallback to input[type=file] *}
<input id="category_icon" name="serendipity[cat][icon]" type="text" value="{$this_cat.category_icon|default:""|escape:"html"}" onchange="document.getElementById('imagepreview').src = this.value; document.getElementById('imagepreview').style.display = '';">
<script>
var category_icon = document.getElementById('category_icon');
var imgBtn = document.createElement('div');
imgBtn.id = "insert_image";
imgBtn.innerHTML = '<input type="button" name="insImage" value="{$CONST.IMAGE}" onclick="window.open(\'serendipity_admin_image_selector.php?serendipity[htmltarget]=category_icon&amp;serendipity[filename_only]=true\', \'ImageSel\', \'width=800,height=600,toolbar=no,scrollbars=1,scrollbars,resize=1,resizable=1\');">';
category_icon.parentNode.insertBefore(imgBtn, category_icon.nextSibling);
</script>
<!-- noscript>FIXXME: Emit a warning if JS is disabled</noscript -->
<figure id="preview" class="standalone">
<figcaption>{$CONST.PREVIEW}</figcaption>
<img id="imagepreview" src="{$this_cat.category_icon|default:""|escape:"html"}" alt="">
</figure>
</div>
<div class="form_multiselect"> <div class="form_multiselect">
<label for="read_authors">{$CONST.PERM_READ}</label> <label for="read_authors">{$CONST.PERM_READ}</label>
<select id="read_authors" size="6" multiple name="serendipity[cat][read_authors][]"> <select id="read_authors" size="6" multiple name="serendipity[cat][read_authors][]">
@ -114,10 +96,29 @@
</div> </div>
</div> </div>
<fieldset> <div class="clearfix">
<legend><span>{$CONST.CATEGORY_HIDE_SUB}</span></legend> <div class="form_field">
<label for="category_icon">{$CONST.IMAGE}</label>
{* TODO: this should probably become/fallback to input[type=file] *}
<input id="category_icon" name="serendipity[cat][icon]" type="text" value="{$this_cat.category_icon|default:""|escape:"html"}" onchange="document.getElementById('imagepreview').src = this.value; document.getElementById('imagepreview').style.display = '';">
<script>
var category_icon = document.getElementById('category_icon');
var imgBtn = document.createElement('div');
imgBtn.id = "insert_image";
imgBtn.innerHTML = '<input type="button" name="insImage" value="{$CONST.IMAGE}" onclick="window.open(\'serendipity_admin_image_selector.php?serendipity[htmltarget]=category_icon&amp;serendipity[filename_only]=true\', \'ImageSel\', \'width=800,height=600,toolbar=no,scrollbars=1,scrollbars,resize=1,resizable=1\');">';
category_icon.parentNode.insertBefore(imgBtn, category_icon.nextSibling);
</script>
<!-- noscript>FIXXME: Emit a warning if JS is disabled</noscript -->
</div>
<span class="block_level">{$CONST.CATEGORY_HIDE_SUB_DESC}</span> <figure id="preview">
<figcaption>{$CONST.PREVIEW}</figcaption>
<img id="imagepreview" src="{$this_cat.category_icon|default:""|escape:"html"}" alt="">
</figure>
</div>
<fieldset class="clearfix">
<legend><span>{$CONST.CATEGORY_HIDE_SUB} <span>{$CONST.CATEGORY_HIDE_SUB_DESC}</span></span></legend>
<div class="clearfix"> <div class="clearfix">
<div class="form_radio"> <div class="form_radio">

View File

@ -821,6 +821,7 @@ input[type=checkbox] { margin-right: .4em; }
.serendipity_commentDirection, .serendipity_commentDirection,
.configuration_group fieldset>fieldset, .configuration_group fieldset>fieldset,
#preview,
.form_field, .form_field,
.form_area, .form_area,
.form_check, .form_check,
@ -1187,6 +1188,8 @@ form>.button_link:first-of-type { margin-top: 0; }
#serendipity_admin_groups li ul div { margin-left: 1.5em; } #serendipity_admin_groups li ul div { margin-left: 1.5em; }
.category_info { margin-left: 2.5em; }
#template_select article, #template_select article,
.media_file, .media_file,
.plugins_installable>li { .plugins_installable>li {
@ -1436,7 +1439,9 @@ form>.button_link:first-of-type { margin-top: 0; }
#uploadform .form_select select, #uploadform .form_select select,
#uploadform .form_field input, #uploadform .form_field input,
#serendipity_plugin_config fieldset legend, #serendipity_plugin_config fieldset legend,
#serendipity_plugin_config fieldset>.clearfix { #serendipity_plugin_config fieldset>.clearfix,
#serendipity_category fieldset legend,
#serendipity_category fieldset>.clearfix {
float: left; float: left;
margin-right: 2%; margin-right: 2%;
width: 48%; width: 48%;
@ -1541,6 +1546,12 @@ form>.button_link:first-of-type { margin-top: 0; }
width: 33% ; width: 33% ;
} }
#preview {
float: left;
margin-bottom: 2.25em;
width: 66%;
}
#filter_entries .form_select, #filter_entries .form_select,
#filter_entries .form_field { #filter_entries .form_field {
float: left; float: left;