Proper layout for media pane filters/sorting.
This commit is contained in:
Matthias Mees
parent
b310936e45
commit
68471a932d
@ -8,7 +8,7 @@
|
||||
<form method="get" action="?">
|
||||
{$media.token}
|
||||
{$media.form_hidden}
|
||||
<fieldset>
|
||||
<fieldset id="media_pane_filter">
|
||||
<legend><span>{$CONST.FILTERS}</span></legend>
|
||||
|
||||
<a id="toggle_filters" class="button_link icon_link" href="#" title="{$CONST.FILTERS}" onclick="showFilters(); return false"><span class="icon-filter"></span><span class="visuallyhidden"> {$CONST.FILTERS}</span></a>
|
||||
@ -30,71 +30,72 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="moreFilter" class="serendipity_pluginlist_section" style="height: auto; display: none">
|
||||
<div id="moreFilter" class="serendipity_pluginlist_section clearfix" style="height: auto; display: none">
|
||||
<div class="form_field">
|
||||
<label for="keyword_input">{$CONST.MEDIA_KEYWORDS}</label>
|
||||
<input id="keyword_input" name="serendipity[keywords]" type="text" value="{$media.keywords_selected|@escape}">
|
||||
</div>
|
||||
|
||||
<div id="keyword_list" class="clearfix">
|
||||
{foreach from=$media.keywords item="keyword"}
|
||||
<a href="#" onclick="AddKeyword('{$keyword|@escape}'); return false">{$keyword|@escape}</a>
|
||||
{/foreach}
|
||||
<div id="keyword_list" class="clearfix">
|
||||
{foreach from=$media.keywords item="keyword"}
|
||||
<a href="#" onclick="AddKeyword('{$keyword|@escape}'); return false">{$keyword|@escape}</a>
|
||||
{/foreach}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{foreach from=$media.sort_order item="so_val" key="so_key"}
|
||||
<div class="{cycle values="left,center,right"}">
|
||||
{if $so_val.type == 'date' || $so_val.type == 'intrange'}
|
||||
<fieldset>
|
||||
<legend class="visuallyhidden"><span>Sort</span></legend> {* i18n *}
|
||||
<fieldset>
|
||||
<legend><span>Sort ({$so_key})</span></legend> {* i18n/should be labelled properly *}
|
||||
{else}
|
||||
<div class="form_{if $so_val.type == 'authors'}select{else}field{/if}">
|
||||
<label for="serendipity_filter_{$so_key}">{$so_val.desc}</label>
|
||||
<div class="form_{if $so_val.type == 'authors'}select{else}field{/if}">
|
||||
<label for="serendipity_filter_{$so_key}">{$so_val.desc}</label>
|
||||
{/if}
|
||||
{if $so_val.type == 'date'}
|
||||
{if $media.filter[$so_key].from != '' OR $media.filter[$so_key].to != ''}{assign var="show_filter" value=$media.filter[$so_key]}{/if}
|
||||
<div class="form_field">
|
||||
{* Core might need to be adapted to input[type=date] *}
|
||||
<label for="serendipity_filter_{$so_key}_from" class="visuallyhidden">From</label> {* i18n *}
|
||||
<input id="serendipity_filter_{$so_key}_from" name="serendipity[filter][{$so_key}][from]" type="date" value="{$media.filter[$so_key].from|@escape}">
|
||||
-
|
||||
<label for="serendipity_filter_{$so_key}_to" class="visuallyhidden">To</label> {* i18n *}
|
||||
<input id="serendipity_filter_{$so_key}_to" name="serendipity[filter][{$so_key}][to]" type="date" value="{$media.filter[$so_key].to|@escape}">
|
||||
{* <span class="input_hint">(DD.MM.YYYY | YYYY-MM-DD | MM/DD/YYYY)</span> *}
|
||||
</div>
|
||||
<div class="form_field">
|
||||
{* Core might need to be adapted to input[type=date] *}
|
||||
<label for="serendipity_filter_{$so_key}_from" class="visuallyhidden">From</label> {* i18n *}
|
||||
<input id="serendipity_filter_{$so_key}_from" name="serendipity[filter][{$so_key}][from]" type="date" value="{$media.filter[$so_key].from|@escape}">
|
||||
-
|
||||
<label for="serendipity_filter_{$so_key}_to" class="visuallyhidden">To</label> {* i18n *}
|
||||
<input id="serendipity_filter_{$so_key}_to" name="serendipity[filter][{$so_key}][to]" type="date" value="{$media.filter[$so_key].to|@escape}">
|
||||
{* <span class="input_hint">(DD.MM.YYYY | YYYY-MM-DD | MM/DD/YYYY)</span> *}
|
||||
</div>
|
||||
{elseif $so_val.type == 'intrange'}
|
||||
{if $media.filter[$so_key].from != '' OR $media.filter[$so_key].to != ''}{assign var="show_filter" value=$media.filter[$so_key]}{/if}
|
||||
<div class="form_field">
|
||||
{* Could also use input[type=range]; unsure if that's actually useful (yet) *}
|
||||
<label for="serendipity_filter_{$so_key}_from" class="visuallyhidden">From</label> {* i18n *}
|
||||
<input id="serendipity_filter_{$so_key}_from" name="serendipity[filter][{$so_key}][from]" type="text" value="{$media.filter[$so_key].from|@escape}">
|
||||
-
|
||||
<label for="serendipity_filter_{$so_key}_to" class="visuallyhidden">To</label> {* i18n *}
|
||||
<input id="serendipity_filter_{$so_key}_to" name="serendipity[filter][{$so_key}][to]" type="text" value="{$media.filter[$so_key].to|@escape}">
|
||||
</div>
|
||||
<div class="form_field">
|
||||
{* Could also use input[type=range]; unsure if that's actually useful (yet) *}
|
||||
<label for="serendipity_filter_{$so_key}_from" class="visuallyhidden">From</label> {* i18n *}
|
||||
<input id="serendipity_filter_{$so_key}_from" name="serendipity[filter][{$so_key}][from]" type="text" value="{$media.filter[$so_key].from|@escape}">
|
||||
-
|
||||
<label for="serendipity_filter_{$so_key}_to" class="visuallyhidden">To</label> {* i18n *}
|
||||
<input id="serendipity_filter_{$so_key}_to" name="serendipity[filter][{$so_key}][to]" type="text" value="{$media.filter[$so_key].to|@escape}">
|
||||
</div>
|
||||
{elseif $so_val.type == 'authors'}
|
||||
{if $media.filter[$so_key] != ''}{assign var="show_filter" value=$media.filter[$so_key]}{/if}
|
||||
<select id="serendipity_filter_{$so_key}" name="serendipity[filter][{$so_key}]">
|
||||
<option value="">{$CONST.ALL_AUTHORS}</option>
|
||||
{foreach from=$media.authors item="media_author"}
|
||||
<option value="{$media_author.authorid}"{if $media.filter[$so_key] == $media_author.authorid} selected{/if}>{$media_author.realname|@escape}</option>
|
||||
{/foreach}
|
||||
</select>
|
||||
<select id="serendipity_filter_{$so_key}" name="serendipity[filter][{$so_key}]">
|
||||
<option value="">{$CONST.ALL_AUTHORS}</option>
|
||||
{foreach from=$media.authors item="media_author"}
|
||||
<option value="{$media_author.authorid}"{if $media.filter[$so_key] == $media_author.authorid} selected{/if}>{$media_author.realname|@escape}</option>
|
||||
{/foreach}
|
||||
</select>
|
||||
{else}
|
||||
{if $media.filter[$so_key] != ''}{assign var="show_filter" value=$media.filter[$so_key]}{/if}
|
||||
<input id="serendipity_filter_{$so_key}" name="serendipity[filter][{$so_key}]" type="text" value="{$media.filter[$so_key]|@escape}">
|
||||
<input id="serendipity_filter_{$so_key}" name="serendipity[filter][{$so_key}]" type="text" value="{$media.filter[$so_key]|@escape}">
|
||||
{/if}
|
||||
{if $so_val.type == 'date' || $so_val.type == 'intrange'}
|
||||
</fieldset>
|
||||
</fieldset>
|
||||
{else}
|
||||
</div>
|
||||
</div>
|
||||
{/if}
|
||||
</div>
|
||||
{/foreach}
|
||||
</div>
|
||||
</fieldset>
|
||||
{if $media.keywords_selected != '' OR $show_filter}
|
||||
<script>showFilters();</script>
|
||||
{/if}
|
||||
<fieldset>
|
||||
<fieldset id="media_pane_sort">
|
||||
<legend><span>{$CONST.SORT_ORDER}</span></legend>
|
||||
|
||||
<div class="clearfix">
|
||||
|
||||
@ -453,7 +453,9 @@ form > a,
|
||||
.pluginmanager_plugin .form_check,
|
||||
.pluginmanager_plugin h5,
|
||||
.media_file .form_check,
|
||||
.media_file h3 {
|
||||
.media_file h3,
|
||||
#media_pane_filter label,
|
||||
#media_pane_sort label {
|
||||
display: inline-block;
|
||||
*display: inline;
|
||||
*zoom: 1;
|
||||
@ -948,7 +950,9 @@ fieldset p,
|
||||
#sort_entries .form_select label,
|
||||
#filter_entries .form_select label,
|
||||
#filter_entries .form_field label,
|
||||
#serendipity_category label { width: 20%; }
|
||||
#serendipity_category label,
|
||||
#media_pane_filter label,
|
||||
#media_pane_sort label { width: 20%; }
|
||||
|
||||
#serendipity_category .form_multiselect label {
|
||||
display: block;
|
||||
@ -967,15 +971,22 @@ fieldset p,
|
||||
#serendipity_comment .form_field input,
|
||||
#serendipity_comment select { width: 84%; }
|
||||
|
||||
#edit_entry_timestamp { position: relative; }
|
||||
#edit_entry_timestamp,
|
||||
#media_pane_filter { position: relative; }
|
||||
|
||||
#reset_timestamp,
|
||||
#media_pane_filter #toggle_filters {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
#reset_timestamp {
|
||||
max-height: 1.25em;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: .1875em;
|
||||
}
|
||||
|
||||
#media_pane_filter #toggle_filters { right: 1.5em;}
|
||||
|
||||
.editor_toolbar { margin-top: .25em; }
|
||||
|
||||
.editor_toolbar input { margin: 0 .25em .75em 0; }
|
||||
@ -1147,7 +1158,9 @@ fieldset p,
|
||||
#filter_entries .form_field label,
|
||||
#filter_comments label,
|
||||
#serendipity_category label,
|
||||
#serendipity_comment label {
|
||||
#serendipity_comment label,
|
||||
#media_pane_filter label,
|
||||
#media_pane_sort label {
|
||||
display: block;
|
||||
width: auto;
|
||||
}
|
||||
@ -1156,7 +1169,10 @@ fieldset p,
|
||||
#sort_entries .form_select,
|
||||
#filter_comments .clearfix>div,
|
||||
#serendipity_category>.clearfix>div,
|
||||
#serendipity_comment .form_field {
|
||||
#serendipity_comment .form_field,
|
||||
#media_filter>div,
|
||||
#moreFilter>div,
|
||||
#media_pane_sort>.clearfix>div {
|
||||
float: left;
|
||||
width: 33% ;
|
||||
}
|
||||
@ -1167,14 +1183,21 @@ fieldset p,
|
||||
width: 25%;
|
||||
}
|
||||
|
||||
#moreFilter .left,
|
||||
#serendipity_comment .form_tarea { clear: both; }
|
||||
|
||||
#moreFilter fieldset input,
|
||||
#moreFilter fieldset select { margin-bottom: .75em; }
|
||||
|
||||
#edit_entry_metadata select { width: 100%; }
|
||||
|
||||
#edit_entry_metadata select[multiple],
|
||||
#sort_entries .form_select select,
|
||||
#filter_entries .form_select select,
|
||||
#filter_entries .form_field input { width: 84%; }
|
||||
#filter_entries .form_field input,
|
||||
#media_filter input,
|
||||
#media_filter select,
|
||||
#media_pane_sort select { width: 84%; }
|
||||
|
||||
#edit_entry_timestamp,
|
||||
#reset_timestamp {
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user