From a517aa9d67ff52b705ef9e66b00f551ac18d8638 Mon Sep 17 00:00:00 2001 From: Kathy Lussier Date: Fri, 10 Mar 2017 08:57:26 -0500 Subject: [PATCH] LP#1670425: New responsive design for advanced search limiters block When the screen is 600px or smaller, we continue to only display the 'x filters applied' link as we did with the sidebar display because displaying limiters pushes the results too far down the screen. Clicking the link toggles the display of the limiters. Signed-off-by: Kathy Lussier --- Open-ILS/src/templates/opac/css/style.css.tt2 | 26 +++++++++++++++++---- .../src/templates/opac/parts/result/adv_filter.tt2 | 13 +++++++---- Open-ILS/src/templates/opac/parts/searchbar.tt2 | 27 ++++++++++++++++++---- 3 files changed, 53 insertions(+), 13 deletions(-) diff --git a/Open-ILS/src/templates/opac/css/style.css.tt2 b/Open-ILS/src/templates/opac/css/style.css.tt2 index 6a21624da0..9d88a5fb59 100644 --- a/Open-ILS/src/templates/opac/css/style.css.tt2 +++ b/Open-ILS/src/templates/opac/css/style.css.tt2 @@ -1059,13 +1059,12 @@ div.adv_search_available { #adv_filter_results_block h4 { display: inline; } #adv_filter_results_block { - margin-top: 10px; - margin-bottom: 16px; + margin-top: 6px; } .adv_filter_results_block_label { font-weight:bold; - padding: 4px 6px 4px 12px; + padding: 4px 0px 4px 12px; } .adv_filter_results_group { @@ -1076,9 +1075,15 @@ div.adv_search_available { border-color: [% css_colors.accent_medium %]; border-width: 1px; padding: 2px 4px 2px 4px; - margin-right:6px; } +.adv_filter_results_group_wrapper { + display: inline-block; + margin-left: 1em; + margin-bottom: 8px; + } + + .remove_filter { font-size: 16px; margin-left: 3px; @@ -1993,6 +1998,19 @@ a.preflib_change { .results_header_btns a { margin: 0.3em; } + .adv_filter_results_hide { + display: none; + } + .adv_filter_results_show { + display: block; + } + .adv_filter_results_block_label { + display: block; + } + .adv_filter_results_group_wrapper { + display: block; + margin-left: 1em; + } #main-content { margin: 0 1px; } diff --git a/Open-ILS/src/templates/opac/parts/result/adv_filter.tt2 b/Open-ILS/src/templates/opac/parts/result/adv_filter.tt2 index d2c4e73343..367c816f36 100644 --- a/Open-ILS/src/templates/opac/parts/result/adv_filter.tt2 +++ b/Open-ILS/src/templates/opac/parts/result/adv_filter.tt2 @@ -11,7 +11,8 @@ FOR filter IN ctx.query_struct.filters; IF crad AND NOT pubdate_filters.grep('^' _ filter.name _ '$').size; remove_filter = 'fi:' _ fname; -%] -
+
+

[% IF filter.negate; l('Not'); END %] [% (crad.description || crad.label) | html %]

[% temp = []; FOR fval IN fvalues; @@ -35,11 +36,13 @@ FOR filter IN ctx.query_struct.filters; title="[% l('Remove [_1] filter', (crad.description || crad.label)) %]" aria-label=[% l('Remove [_1] filter', (crad.description || crad.label)) %]" href="[% mkurl('', {}, [remove_filter]) %]" rel="nofollow" vocab="">× +
[%- END; # IF crad -%] [%- IF filter.name == 'locations'; locs = ctx.search_acpl('id',filter.args) -%] -
+
+

[% IF filter.negate; l('Not'); END %] [% l('Locations') %]

[% temp = []; FOR loc IN locs; @@ -53,7 +56,7 @@ FOR filter IN ctx.query_struct.filters; × - +
[%- END; # IF locations -%] @@ -61,7 +64,8 @@ FOR filter IN ctx.query_struct.filters; date1 = CGI.param('date1'); date2 = CGI.param('date2'); -%] -
+
+

[% IF filter.negate; l('Not'); END %] [% l('Publication Year') %]

[% IF filter.name == 'date1' %][% l('[_1]', date1) %] @@ -73,6 +77,7 @@ FOR filter IN ctx.query_struct.filters; × +
[%- END; # IF pubdate_filters -%] diff --git a/Open-ILS/src/templates/opac/parts/searchbar.tt2 b/Open-ILS/src/templates/opac/parts/searchbar.tt2 index 757e3fee89..5dfcecd1c1 100644 --- a/Open-ILS/src/templates/opac/parts/searchbar.tt2 +++ b/Open-ILS/src/templates/opac/parts/searchbar.tt2 @@ -131,27 +131,44 @@ END; [% END %] [% END %] + [% IF fcount > 0 %] + + [% END %] [% IF ctx.query_struct.filters.size > 0 %] [% stuff = INCLUDE 'opac/parts/result/adv_filter.tt2' %] [% IF stuff %]

[% l('Search Results filters') %]

-
+
[% l('Filtered by:') %] [% stuff %]
[% END %] [% END %] - [% IF (is_advanced AND NOT is_special) AND CGI.param('qtype') %] + [% IF (is_advanced AND NOT is_special) AND CGI.param('qtype') %] [% END %] +