adding more colors and style.css changes to make them usable to ease customizations

Signed-off-by: Terran McCanna <tmccanna@georgialibraries.org>
Signed-off-by: Galen Charlton <gmc@equinoxinitiative.org>

diff --git a/Open-ILS/src/templates/opac/css/style.css.tt2 b/Open-ILS/src/templates/opac/css/style.css.tt2
index 3a01b6f..a2fc5d6 100644 (file)
--- a/Open-ILS/src/templates/opac/css/style.css.tt2
+++ b/Open-ILS/src/templates/opac/css/style.css.tt2
@@ -8,7 +8,7 @@ body {
     margin:0;
     font-family: Arial, Helvetica, sans-serif;
     font-size: [% css_fonts.size_base %];
-    background-color: [% css_colors.primary %];
+    background-color: [% css_colors.footer %];
     [% IF rtl == 't' -%]
     direction: rtl;
     [%- END %]
@@ -186,7 +186,7 @@ for now until a better color is picked - if needed.
 }
 
 #header-wrap {
-    background-color: [% css_colors.primary_fade %];
+    background-color: [% css_colors.header %];
     background-image: -moz-linear-gradient([% css_colors.primary %], [% css_colors.primary_fade %]);
     background-image: -o-linear-gradient([% css_colors.primary %], [% css_colors.primary_fade %]);
     background-image: -webkit-linear-gradient([% css_colors.primary %], [% css_colors.primary_fade %]);
@@ -200,16 +200,16 @@ for now until a better color is picked - if needed.
 }
 
 #header a {
-    color: [% css_colors.background %];
+    color: [% css_colors.header_links_text %];
 }
 
 #header a:hover {
-    color: [% css_colors.text_invert %];
+    color: [% css_colors.opac_button_hover_text %];
     text-decoration: none;
 }
 
 #header-links {
-    color: [% css_colors.text_invert %];
+    color: [% css_colors.header_text %];
     font-size: [% css_fonts.size_small %];
     font-weight: bold;
     position: relative;
@@ -218,7 +218,7 @@ for now until a better color is picked - if needed.
 }
 
 #header-links a {
-    color: [% css_colors.text_invert %];
+    color: [% css_colors.header_links_text %];
     display: block;
     text-decoration: none;
     [% IF rtl == 't' -%]
@@ -231,7 +231,7 @@ for now until a better color is picked - if needed.
 }
 
 #header-links a:hover {
-    color: [% css_colors.text_invert %];
+    color: [% css_colors.header_links_text %];
     text-shadow: 0 0 0.2em [% css_colors.primary %], 0 0 0.2em [% css_colors.primary %];
     text-decoration: none;
 }
@@ -239,12 +239,12 @@ for now until a better color is picked - if needed.
 #header #header-links2 {
     position:relative;
     top:-8px;
-    color: [% css_colors.text_invert %];
+    color: [% css_colors.header_links_text %];
     padding-bottom: 15px;
 }
 
 #header #header-links2 a {
-    color: [% css_colors.text_invert %];
+    color: [% css_colors.header_links_text %];
 }
 
 #header #header-links2 a:hover {
@@ -1721,7 +1721,7 @@ div#facet_sidebar {
 }
 
 #footer-wrap {
-    background-color: [% css_colors.primary %];
+    background-color: [% css_colors.footer %];
     background-image: -moz-linear-gradient([% css_colors.primary_fade %], [% css_colors.primary %]);
     background-image: -o-linear-gradient([% css_colors.primary_fade %], [% css_colors.primary %]);
     background-image: -webkit-linear-gradient([% css_colors.primary_fade %], [% css_colors.primary %]);
@@ -1740,13 +1740,13 @@ div#facet_sidebar {
 }
 
 #footer a {
-    color: [% css_colors.text_invert %];
+    color: [% css_colors.footer_text %];
     text-decoration: none;
     text-shadow: 0 0 0.2em [% css_colors.primary %], 0 0 0.2em [% css_colors.primary %];
 }
 
 #copyright_text, #footer_logo {
-    color: [% css_colors.text_invert %];
+    color: [% css_colors.footer_text %];
 }
 
 .color_4 {
@@ -1890,7 +1890,7 @@ a.dash-link:hover { text-decoration: underline !important; }
 
 .invisible { visibility: hidden; }
 .rdetail-extras-summary { margin: 10px; }
-.staff-hold { background-color: [% css_colors.accent_lightest %]; }
+.staff-hold { background-color: [% css_colors.background %]; }
 .expert-search tbody tr th {
     [% IF rtl == 't' -%]
     text-align: left;
@@ -1980,7 +1980,7 @@ a.dash-link:hover { text-decoration: underline !important; }
     cursor: pointer !important;
     border-radius: 5px;
     border: 1px solid [% css_colors.primary %];
-    background-color:  [% css_colors.primary_fade %];
+    background-color:  [% css_colors.button %];
     margin: 0.5em;
     padding: 0.3em;
     display: inline-block;
@@ -1988,7 +1988,8 @@ a.dash-link:hover { text-decoration: underline !important; }
 
 .opac-multiline-button > a:hover,
 .opac-button:hover, .results_header_btns a:hover, #simple-detail-view-links a:hover, #dash_wrapper a.opac-button:hover {
-    background-color: [% css_colors.primary %];
+    background-color: [% css_colors.opac_button_hover %];
+    color: [% css_colors.opac_button_hover_text %];
 }
 
 .opac-button:disabled {
@@ -2005,12 +2006,13 @@ button.opac-button::-moz-focus-inner, input.opac-button::-moz-focus-inner {
 }
 
 .opac-button-header, #dash_wrapper .opac-button {
-    background-color: [% css_colors.control %];
+    color: [% css_colors.opac_button_text %];
+    background-color: [% css_colors.opac_button %];
     box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
     font-size: [% css_fonts.size_base %];
 }
 a.opac-button-header:hover, #dash_wrapper a.opac-button:hover {
-    border-color: [% css_colors.control %];
+    border-color: [% css_colors.opac_button_hover %];
 }
 
 .opac-multiline-button > a {

diff --git a/Open-ILS/src/templates/opac/parts/css/colors.tt2 b/Open-ILS/src/templates/opac/parts/css/colors.tt2
index 2c0c1f1..037ff05 100644 (file)
--- a/Open-ILS/src/templates/opac/parts/css/colors.tt2
+++ b/Open-ILS/src/templates/opac/parts/css/colors.tt2
@@ -28,12 +28,24 @@
         border_standard = "#e9ebf3", # light grey-blue
         border_dark = "black", # black
         border_alert = "red", # red
+        button = "#00593d", #dark green
         button_text = "#fbf9f9", # off-white 
         button_text_shadow = "#555555", # medium grey
         table_heading = "#d8d8d8", # grey-blue
         mobile_header_text = "#fff", # white
         item_selected = "#ddd", # grey (lighter)
         link = "#00593d", # dark green
+        footer = "#00593d", #dark green
+        footer_text = "#FFFFFF" #white
+        header = "#FFFFFF", #white
+        header_text = "#FFFFFF", #white
+        header_links_bar = "#000000", #black
+        header_links_text = "#FFFFFF", #white
+        header_links_text_hover = "#FFFFFF", #white
+        opac_button = "#00593d", # dark green
+        opac_button_text = "#FFFFFF", #white
+        opac_button_hover = "#00593d", # dark green
+        opac_button_hover_text = "#FFFFFF" #white
     };
     
 %]