From ce5acb3e86721bd585e766e602ad3ae8e0382977 Mon Sep 17 00:00:00 2001
From: Dan Scott <dscott@laurentian.ca>
Date: Sun, 2 Oct 2011 22:59:28 -0400
Subject: [PATCH] TPAC: Simple CSS gradients for the header/footer

Firefox, Safari, Chrome, Opera, and the Android browser support
gradients. Use them. iOS 5 will support gradients. IE does not,
naturally, but support is promised for IE 10.

Signed-off-by: Dan Scott <dscott@laurentian.ca>
---
 Open-ILS/src/templates/opac/parts/footer.tt2 |  3 ++-
 Open-ILS/src/templates/opac/parts/topnav.tt2 |  2 ++
 Open-ILS/web/css/skin/default/opac/style.css | 20 ++++++++++++++------
 3 files changed, 18 insertions(+), 7 deletions(-)

diff --git a/Open-ILS/src/templates/opac/parts/footer.tt2 b/Open-ILS/src/templates/opac/parts/footer.tt2
index 0443b97834..e2fe842005 100644
--- a/Open-ILS/src/templates/opac/parts/footer.tt2
+++ b/Open-ILS/src/templates/opac/parts/footer.tt2
@@ -2,6 +2,7 @@
     USE CGI = CGI_utf8;
     hostname = CGI.url({'-base' => 1});
 -%]
+<div id="footer-wrap">
 <div id="footer">
     <a href="[% hostname %]">[% l('Dynamic catalog') %]</a> &nbsp;|&nbsp;
     <a href="http://example.com">[% l('Bottom Link 2') %]</a> &nbsp;|&nbsp;
@@ -22,4 +23,4 @@
         </a>
     </div>
 </div>
-
+</div>
diff --git a/Open-ILS/src/templates/opac/parts/topnav.tt2 b/Open-ILS/src/templates/opac/parts/topnav.tt2
index 92ee814d66..bdb9d54d29 100644
--- a/Open-ILS/src/templates/opac/parts/topnav.tt2
+++ b/Open-ILS/src/templates/opac/parts/topnav.tt2
@@ -1,4 +1,5 @@
 [% IF !ctx.is_staff %]
+<div id="header-wrap">
 <div id="header">
     <div class="float-left">
         [% INCLUDE "opac/parts/topnav_logo.tt2" %]
@@ -94,5 +95,6 @@
     </div>
     <div class="common-no-pad"></div>
 </div>
+</div>
 [% END %]
 [% INCLUDE "opac/parts/topnav_links.tt2" %]
diff --git a/Open-ILS/web/css/skin/default/opac/style.css b/Open-ILS/web/css/skin/default/opac/style.css
index cc896f5c87..06e4125dfd 100644
--- a/Open-ILS/web/css/skin/default/opac/style.css
+++ b/Open-ILS/web/css/skin/default/opac/style.css
@@ -2,7 +2,7 @@ body {
 	margin:0;
 	font-family: Arial, Helvetica, sans-serif;
 	font-size: 12px;
-	background:#333;
+	background: darkgreen;
 }
 
 img {
@@ -138,6 +138,12 @@ div.select-wrapper:hover {
 #dash_holds { color: #ffcc33; }
 #dash_pickup { color: #1dd93c; }
 #dash_fines { color: #f41d36; }
+#header-wrap {
+    background: linear-gradient(lightgreen, #252525);
+    background: -moz-linear-gradient(lightgreen, #252525);
+    background: -o-linear-gradient(lightgreen, #252525);
+    background: -webkit-linear-gradient(lightgreen, #252525);
+}
 #header {
 	color: #fff;
 	padding: 26px 0px 26px 0px;
@@ -890,20 +896,22 @@ div.select-wrapper:hover {
 .facetField { border-top: 1px solid #CCC; }
 .facetFields { padding-left: 5px; }
 .facetFieldLineValue { overflow: hidden; text-overflow: ellipsis; }
-
+#footer-wrap {
+    background: linear-gradient(lightgreen, darkgreen);
+    background: -moz-linear-gradient(lightgreen, darkgreen);
+    background: -o-linear-gradient(lightgreen, darkgreen);
+    background: -webkit-linear-gradient(lightgreen, darkgreen);
+}
 #footer {
 	padding-top:5px;
 	padding-bottom: 10px;
-	color: white;
 	margin: auto;
 	width: 974px;
-	color: #afafaf;
 	font-size: 11px;
 }
 
 #footer a {
-	color: white;
-	color: #afafaf;
+	color: black;
 }
 
 .color_4 {
-- 
2.11.0