TPAC: Streamline facet display

Rather than including a DIV containing only a non-breaking space to
clear the lines of the facets, just use CSS to clear each facet and set
a bottom margin appropriately.

Also, take advantage of wide screens by allowing facets to display
more broadly rather than being limited to a 10% width of the screen.

Signed-off-by: Dan Scott <dscott@laurentian.ca>
Signed-off-by: Lebbeous Fogle-Weekley <lebbeous@esilibrary.com>
Signed-off-by: Dan Wells <dbw2@calvin.edu>

diff --git a/Open-ILS/src/templates/opac/css/style.css.tt2 b/Open-ILS/src/templates/opac/css/style.css.tt2
index dcedbda..212967b 100644 (file)
--- a/Open-ILS/src/templates/opac/css/style.css.tt2
+++ b/Open-ILS/src/templates/opac/css/style.css.tt2
@@ -1018,7 +1018,7 @@ div#facet_sidebar {
 }
 
 .facet_box_temp .header {
-    height:31px;
+    height: 2em;
     overflow:hidden;
     background:[% css_colors.primary %];
     -moz-border-top-left-radius: 5px;
@@ -1062,18 +1062,18 @@ div#facet_sidebar {
 }
 
 .facet_template {
-    padding-bottom:5px;
+    clear: both;
 }
 
 .facet_template .facet {
     float:left;
-    width:124px;
+    width: 12em;
+    margin-bottom: 0.5em;
 }
 
 .facet_template .count {
     float:right;
     color: [% css_colors.accent_mediumdark %];
-    padding-right:11px;
 }
 
 .facet_template_selected .facet {
@@ -1672,6 +1672,13 @@ a.preflib_change {
     font-size: [% css_fonts.size_bigger %];
 }
 
+@media only screen and (min-width: 1280px) {
+    .facet_box_temp { width: inherit; }
+    .facet_box_wrapper .box_wrapper .box { width: inherit; }
+    .facet_template .facet { width: inherit; max-width: 640px; }
+    .facet_template .count { margin-left: 1em; }
+}
+
 @media only screen and (max-width: 800px) {
     .facet_sidebar_hidden, .result_block_hidden {
         display: none;

diff --git a/Open-ILS/src/templates/opac/parts/result/facets.tt2 b/Open-ILS/src/templates/opac/parts/result/facets.tt2
index c5b95a0..12d6597 100644 (file)
--- a/Open-ILS/src/templates/opac/parts/result/facets.tt2
+++ b/Open-ILS/src/templates/opac/parts/result/facets.tt2
@@ -110,7 +110,6 @@ FOR facet IN sorted_facets;
                             [% END %]
                         </div>
                         <div class="count">([% facet_data.count %])</div>
-                        <div class="clear">&nbsp;</div>
                     </div>
                 [% 
                     ELSE;
@@ -122,7 +121,6 @@ FOR facet IN sorted_facets;
                             <a href='[% mkurl('', {facet => selected_facets.merge([param_string])}, ['page']) %]'>[% display_value %]</a>
                         </div>
                         <div class="count">([% facet_data.count %])</div>
-                        <div class="clear">&nbsp;</div>
                     </div>
                 [% END %]
             [% END %]