From 00a58d70ab5f94813decf11d3443e46f27318227 Mon Sep 17 00:00:00 2001
From: Dan Wells <dbw2@calvin.edu>
Date: Fri, 4 Oct 2013 11:23:13 -0400
Subject: [PATCH] TPAC: Redo some margins/padding for better collapse behavior

In the "results header", we have both buttons and form elements. In
order to have these elements collapse in an orderly fashion, they need
to be exactly the same size. To accomplish this, let's simplify and
redo a few of the element margins and padding.

At the very least, this will make the elements line up better
vertically when viewed at the normal screen width.

Signed-off-by: Dan Wells <dbw2@calvin.edu>
Signed-off-by: Jason Stephenson <jstephenson@mvlc.org>
---
 Open-ILS/src/templates/opac/css/style.css.tt2 | 27 ++++++++++++++++++---------
 1 file changed, 18 insertions(+), 9 deletions(-)

diff --git a/Open-ILS/src/templates/opac/css/style.css.tt2 b/Open-ILS/src/templates/opac/css/style.css.tt2
index a7b65c3beb..60ae498a9c 100644
--- a/Open-ILS/src/templates/opac/css/style.css.tt2
+++ b/Open-ILS/src/templates/opac/css/style.css.tt2
@@ -680,8 +680,23 @@ div.format_icon {
     font-weight: bold;
     float: left;
     color: [% css_colors.text %];
+    /* this border is not visible, but it keeps these labels the same size
+    as the buttons */
+    border: 1px solid [% css_colors.accent_medium %];
     background: [% css_colors.accent_medium %];
-    margin: 0.5em 0.5em 0.5em 0em;
+    margin: 0.5em 0.3em;
+    padding: 0.3em;
+}
+/* we need a negative margin on the select to allow the containing <label>
+to determine the actual size of the element.  By doing this, we can increase
+the odds that the buttons and the select will be the same size, and therefore
+collapse correctly when the window width decreases */
+.results_header_lbl select {
+    margin: -0.5em 0;
+}
+
+#limit_to_available {
+    vertical-align: middle;
 }
 
 .results_header_sel {
@@ -1218,7 +1233,6 @@ a.dash-link:hover { text-decoration: underline !important; }
 
 .results_header_btns, .results_header_sel {
     float:left;
-    margin: 0.5em 0.5em 0.5em 0em;
 }
 
 /*
@@ -1236,7 +1250,7 @@ a.dash-link:hover { text-decoration: underline !important; }
     border-radius: 5px;
     border: 1px solid [% css_colors.primary %];
     background:  [% css_colors.primary_fade %];
-    margin: 10px;
+    margin: 0.5em;
     padding: 0.3em;
     display: inline-block;
 }
@@ -1259,11 +1273,6 @@ button.opac-button::-moz-focus-inner, input.opac-button::-moz-focus-inner {
     border: 0;
 }
 
-.results_header_btns a, #simple-detail-view-links a {
-    vertical-align: middle;
-    display: table-cell;
-}
-
 .opac-button-header, #dash_wrapper .opac-button {
     background: [% css_colors.control %];
     box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
@@ -1839,7 +1848,7 @@ a.preflib_change {
         background-color: inherit;
     }
     .results_header_btns a {
-        margin: 0px;
+        margin: 0.3em;
     }
     #main-content {
         margin-left: 1px;
-- 
2.11.0