TPAC: Remove more explicit widths from results page
authorDan Scott <dscott@laurentian.ca>
Fri, 9 Dec 2011 17:05:14 +0000 (12:05 -0500)
committerDan Scott <dscott@laurentian.ca>
Fri, 9 Dec 2011 17:05:14 +0000 (12:05 -0500)
Refactor the facet sidebar such that headers consist of a floated span
and a div with no specific width; absent a specific width, the button
will float over top of text that might expand due to translation.

Also remove the explicit table cell width for the results counter column
and move some inline styles over to CSS. More to be done in results
table but we are on our way.

Signed-off-by: Dan Scott <dscott@laurentian.ca>
Open-ILS/src/templates/opac/parts/result/facets.tt2
Open-ILS/src/templates/opac/parts/result/table.tt2
Open-ILS/web/css/skin/default/opac/style.css

index 76c335f..7b02773 100644 (file)
@@ -19,8 +19,7 @@ FOR facet_label IN labels.sort;
 
         <div class="facet_box_temp">
             <div class="header">
-                <div class="title">[% facet.cmf.label %]</div>
-                <div class="button">
+                <span class="button">
 
                     [% IF close_facets.grep(close_key).0;
                         new_close = [];
@@ -40,8 +39,8 @@ FOR facet_label IN labels.sort;
                         <a href="[% mkurl('', {close_facet => close_facets.merge([close_key])}) %]"><img 
                             src="[% ctx.media_prefix %]/images/adv_search_minus_btn.png" alt="[% l('Collapse') %]" /></a>
                     [% END %]
-                </div>
-                <div class="clear">&nbsp;</div>
+                </span>
+                <div class="title">[% facet.cmf.label %]</div>
             </div>
             [% IF !close_facets.grep(close_key).0 %]
             <div class="box_wrapper">
@@ -88,7 +87,6 @@ FOR facet_label IN labels.sort;
                     [% END %]
                 [% END %]
                 </div>
-                <div class="clear">&nbsp;</div>
             </div> <!-- box_wrapper -->
             [% END %]
         </div> <!-- facet_box_temp -->
index 422a378..d9ef345 100644 (file)
 <div id="result_table_div">
     <table cellpadding="0" cellspacing="0" border="0" width="100%">
         <tr>
-            <td valign="top" width="1" style="padding-right:20px;">
-                <div style="width:174px;">
-                    [% INCLUDE "opac/parts/staff_saved_searches.tt2" %]
-                    [% INCLUDE 'opac/parts/result/facets.tt2' %]
-                </div>
+            <td valign="top" width="1">
+                [% INCLUDE "opac/parts/staff_saved_searches.tt2" %]
+                [% INCLUDE 'opac/parts/result/facets.tt2' %]
             </td>
-            <td class='opac-auto-015' width="1"></td>
+            <td class="facet_border" width="1"></td>
             <td valign="top">
                 <table cellpadding="0" cellspacing="0"
                     border="0" width="100%" style="margin-top:10px;">
@@ -37,8 +35,7 @@
                                 <table cellpadding="0" cellspacing="0" class='result_table_subtable'>
                                     <tbody class='result_table_subtbody'>
                                         <tr name='counts_row'>
-                                            <td width="58" valign="top"
-                                                style="font-weight:bold;padding-left:10px;"
+                                            <td valign="top" class="results_row_count"
                                                 name="results_row_count">[%
                                                     result_count; result_count = result_count + 1
                                                 %].</td>
index a52fe3d..5e6a494 100644 (file)
@@ -896,12 +896,11 @@ span.dash_divider {
 
 .facet_box_temp {
        padding-bottom:3px;
-       width:180px;
+       width: 15em;
        overflow:hidden;
 }
 
 .facet_box_temp .header {
-       width:180px;
        height:31px;
        overflow:hidden;
        background:url('/images/facet_box_bg.png') no-repeat;
@@ -914,7 +913,6 @@ span.dash_divider {
        float:left;
        padding-top:6px;
        padding-left:12px;
-       width:134px;
        overflow:hidden;
 }
 
@@ -931,7 +929,7 @@ span.dash_divider {
 }
 
 .facet_box_wrapper .box_wrapper .box {
-       width:166px;
+       width: 14em;
        border-top:1px solid #7ebee5;
        border-left:1px solid #f3f3f3;
        border-right:1px solid #f3f3f3;
@@ -963,6 +961,11 @@ span.dash_divider {
     background-color: #d7d7d7;
 }
 
+.facet_border {
+    border-left: 1px solid #e9ebf3;
+    padding-right: 0.5em;
+}
+
 #footer-wrap {
     background: linear-gradient(lightGreen, #252525);
     background: -moz-linear-gradient(lightGreen, #252525);
@@ -1028,6 +1031,7 @@ a.dash-link:hover { text-decoration: underline !important; }
 }
 .list-create-table-buttons input[type=image] { margin-top: 2px; }
 .result_table_format_cell { padding: 0px 10px; text-align: center; }
+.results_row_count { font-weight: bold; }
 #hold_editor h1 { font-size: 120%; font-weight: bold; }
 #hold_editor h2 { font-size: 111%; font-weight: normal; text-indent: 2em; font-style: italic; }
 #hold_editor h1, #hold_editor h2 { margin: 2px 0; }
@@ -1224,10 +1228,6 @@ table.bookbag-specific {
     border-bottom: none;
     *height: 0px;
 }
-.opac-auto-015 {
-    border-left: 1px solid #e9ebf3;
-    padding-right: 27px;
-}
 .adv_global_filter_sort {
     border: none;
     width: 100%;