From af39a22725634982e358a332cdec8056827da83c 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 Signed-off-by: Ben Shum --- Open-ILS/src/templates/opac/css/style.css.tt2 | 25 ++++++++++++++--- .../opac/parts/result/adv_filter.tt2 | 13 ++++++--- .../src/templates/opac/parts/searchbar.tt2 | 27 +++++++++++++++---- 3 files changed, 52 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 b8e650d2df..495436882c 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 { @@ -1077,9 +1076,15 @@ div.adv_search_available { border-width: 1px; border-radius: 4px; 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; @@ -1999,6 +2004,18 @@ 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; + } #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 %] +
+ [ [% l('[quant,_1,filter,filters] applied', fcount) %] ] +
+ [% 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') %]
- [% IF fcount > 0 %] - [ [% l('[quant,_1,filter,filters] applied', fcount) %] ] - [% END %] [ [% l('Refine My Original Search') %] ]
[% END %] +