From: Michael Peters <mrpeters@library.in.gov>
Date: Fri, 23 Sep 2011 18:17:10 +0000 (-0400)
Subject: Based on Dan Scott's "tpac_semantic_amazon_record_details" branch.  My branch attempts
X-Git-Url: https://old-git.evergreen-ils.org/?a=commitdiff_plain;h=0727cad40e5582fbabe4401b21718a921a8f829b;p=working%2FEvergreen.git

Based on Dan Scott's "tpac_semantic_amazon_record_details" branch.  My branch attempts

to add a more "Evergreen" feel to the TTPAC, versus the grey/blue hues in the current skin.

New features include transparent PNG's to replace old JPG to make use of transparency and
the addition of embedded font, Open Sans, via Google's Web Fonts API.

Signed-off-by: Michael Peters <mrpeters@library.in.gov>
---

diff --git a/Open-ILS/src/templates/opac/parts/footer.tt2 b/Open-ILS/src/templates/opac/parts/footer.tt2
index 0443b97834..12987e460e 100644
--- a/Open-ILS/src/templates/opac/parts/footer.tt2
+++ b/Open-ILS/src/templates/opac/parts/footer.tt2
@@ -15,7 +15,7 @@
     <div id="footer_logo">
         [% l('Powered by') %]
         <a href="http://evergreen-ils.org">
-            <img src="[% ctx.media_prefix %]/opac/images/eg_tiny_logo.jpg"
+            <img src="[% ctx.media_prefix %]/opac/images/eg_tiny_logo.png"
                 style="border:none; width: 94px; height: 16px;"
                 alt="[% l('Evergreen') %]"
             />
diff --git a/Open-ILS/src/templates/opac/parts/homesearch.tt2 b/Open-ILS/src/templates/opac/parts/homesearch.tt2
index e5104b6652..4ed901731c 100644
--- a/Open-ILS/src/templates/opac/parts/homesearch.tt2
+++ b/Open-ILS/src/templates/opac/parts/homesearch.tt2
@@ -1,3 +1,3 @@
 <div style='width:664px;height:35px;background:#FFFFFF;'>
-    <strong><center><img src="[% ctx.media_prefix %]/opac/images/main_logo.jpg" /></center></strong>
+    <strong><center><img src="[% ctx.media_prefix %]/opac/images/main_logo.png" /></center></strong>
 </div>
diff --git a/Open-ILS/src/templates/opac/parts/topnav_logo.tt2 b/Open-ILS/src/templates/opac/parts/topnav_logo.tt2
index 7e479f90b8..cd067d66aa 100644
--- a/Open-ILS/src/templates/opac/parts/topnav_logo.tt2
+++ b/Open-ILS/src/templates/opac/parts/topnav_logo.tt2
@@ -1,2 +1,2 @@
         <a href="http://evergreen-ils.org"><img alt="[% l('Evergreen Logo') %]" 
-            src="[% ctx.media_prefix %]/opac/images/small_logo.jpg" /></a>
+            src="[% ctx.media_prefix %]/opac/images/small_logo.png" /></a>
diff --git a/Open-ILS/web/css/skin/default/opac/style.css b/Open-ILS/web/css/skin/default/opac/style.css
index 33a7f41a45..596afd73a8 100644
--- a/Open-ILS/web/css/skin/default/opac/style.css
+++ b/Open-ILS/web/css/skin/default/opac/style.css
@@ -1,8 +1,9 @@
 body {
 	margin:0;
-	font-family: Arial, Helvetica, sans-serif;
+	font-family: 'Droid Sans', Arial, Helvetica, sans-serif;
 	font-size: 12px;
-	background:#333;
+	font-weight: 600;
+	background: #13533f url(/opac/images/header-bg.gif) repeat-x top left;
 }
 
 img {
@@ -10,20 +11,50 @@ img {
 }
 
 a {
-	color: #003399;
+	color: #black;
+	text-decoration: none;
+}
+
+a:hover {
+        color: white;
+        text-shadow: 0 0 0.2em #ffffff;
+        text-decoration: none;
 }
 
 #search-wrapper input[type=text] {
 	border:none;
 	margin:0;
 	padding:0;
+	padding:3px;
+	margin: 	0;
+	border-radius:4px;
+	-webkit-box-shadow:
+	    0 3px 0 #ccc,
+	    0 -1px #fff inset;
+	background: #f8f8f8;
+	color:#13533f;
+	border: 2px solid #DEDEDE;
+	display: inline-block;
+	font-family: 'Droid Sans', Arial, Helvetica, sans-serif;
 }
 
 #search-wrapper select, .results_header_lbl select {
-	border:1px solid #e9ebf3;
-	margin:0;
-	padding:0;
-	width:168px;
+	padding:3px;
+	margin: 0;
+	border-radius:4px;
+	-webkit-box-shadow: 
+	       	0 3px 0 #ccc,
+	    	0 -1px #fff inset;
+	background: #f8f8f8;
+	color:#13533f;
+	border: 2px solid #DEDEDE;
+	display: inline-block;
+	-webkit-appearance:none; 
+	cursor:pointer;
+	padding: 5px;
+	height:30px;
+	overflow: hidden;
+	font-family: 'Droid Sans', Arial, Helvetica, sans-serif;
 }
 
 /*
@@ -152,20 +183,22 @@ div.select-wrapper:hover {
 
 #header a:hover {
 	color: white;
+	text-shadow: 0 0 0.2em #ffffff;
 	text-decoration: none;
 }
 
 #header-links {
-	color: #afafaf;
-	font-size: 11px;
-	font-weight: bold;
+	color: #ffffff;
+	font-size: 12px;
+	font-weight: normal;
 	position: relative;
 	top:4px;
-	
 }
 
 #header-links a {
-	color: #afafaf;
+	color: #ffffff;
+	font-size: 13px;
+	font-weight: 700;
 	display: block;
 	float:left;
 	margin-right:22px;
@@ -187,10 +220,6 @@ div.select-wrapper:hover {
 	color: white;
 }
 
-#header #header-links2 a:hover {
-	text-decoration: underline;
-}
-
 #header #your-acct-login {
 	padding-top:10px;
 }
@@ -217,13 +246,14 @@ div.select-wrapper:hover {
 #search-wrapper {
 	border-bottom: 1px solid #e9ebf3;
 	padding-bottom: 5px;
-	background: white;
+	background: #ffffff url(/opac/images/search-bg.gif) repeat-x top left;
+	min-height: 150px;
 }
 
 .search_box_wrapper {
-	border:1px solid #e9ebf3;
+	border:1px solid #4f786c;
 	padding: 1px;
-    padding-left: 3px;
+	padding-left: 3px;
 }
 
 #search-wrapper #breadcrumb {
@@ -282,11 +312,11 @@ div.select-wrapper:hover {
     display: block;
     margin: 10px 7px 10px 0px;
     padding: 10px 0px 10px 0px;
-    -moz-border-radius: 5%; 
-    border-radius: 5%;
+    -moz-border-radius: 4px 4px 4px 4px;
+    border-radius: 4px 4px 4px 4px;
     font-weight: bold;
-    color: #45709b;
-    background: #9ad0f1;
+    color: #ffffff;
+    background: #2e8469;
     font-weight: bold;
 }
 
@@ -295,29 +325,46 @@ div.select-wrapper:hover {
 }
 
 #adv_search.on, #num_search.on, #expert_search.on {
-    color: #333333;
+    color: #13533f;
     background: white;
 }
 
 #adv_search_tabs a.acct-tab-on, #acct_tabs a.acct-tab-on, #acct_fines_tabs a.acct-tab-on {
-    color: #333333;
+    color: #13533f;
     background: white;
 }
 
+#main-content input[type=text], #main-content select {
+    padding:3px;
+    margin: 0;
+    border-radius:4px;
+    -webkit-box-shadow:
+        0 3px 0 #ccc,
+        0 -1px #fff inset;
+    background: #f8f8f8;
+    color:#13533f;
+    border: 2px solid #DEDEDE;
+    display: inline-block;
+    -webkit-appearance:none;
+    cursor:pointer;
+    background: url("/images/login-bg.jpg") repeat-x scroll center top transparent;
+    background-size: 162px 50px;
+}
+
 .acct-tab-off {
-    background: #9ad0f1;
+    background: #2e8469;
 }
 
 #acct_checked_tabs a, #acct_holds_tabs a, #acct_prefs_tabs a {
     margin-top: 0px;
     font-size: 10px;
-    color: #333333;
+    color: #ffffff;
     padding: 10px 10px 10px 10px;
 }
 
 #acct_checked_tabs div.selected a, #acct_holds_tabs div.selected a, #acct_prefs_tabs div.selected a {
     background: #e1e1e1;
-    color: #333333;
+    color: #13533f;
 }
 
 #acct_checked_tabs, #acct_holds_tabs, #acct_prefs_tabs {
@@ -328,11 +375,17 @@ div.select-wrapper:hover {
 #rdetail_header {
 	font-size:14px;
 	font-weight:bold;
-	color:#074079;
+	color:#13533f;
 	padding: 5px 7px 6px 0px;
 	border-bottom: 1px dotted #ccc;
 }
 
+#rdetail_title {
+       font-size: 18px;
+       font-weight: bold;
+       color: #13533f;
+}
+
 #rdetail_result_count {
 	color: black;
 	font-size: 11px;
@@ -379,6 +432,10 @@ div.select-wrapper:hover {
     padding-top: 1.5em;
 }
 
+#rdetails_status {
+    margin-top: 1.5em;
+}
+
 #rdetails_status td, #rdetails_status2 td {
 	white-space:nowrap !important;
 	padding: 7px 0px 3px 13px;
@@ -387,20 +444,21 @@ div.select-wrapper:hover {
 #rdetails_status thead th {
 	background-color: #d8d8d8;
 	padding: 13px 0px 13px 13px;
-	font-size: 10px;
+	font-size: 13px;
 	text-transform: uppercase;
 	font-weight: bold;
-    text-align: left;
+	text-align: left;
 }
 
 #rdetails_status tbody td {
 	padding-left: 13px;
-    text-align: left;
+	text-align: left;
 }
 
 .rdetail_extras {
 	height: 29px;
-	background: #9ad0f1;
+	background: #2e8469
+	color: white;
 	padding-top:1px;
 	margin-bottom: 10px;
 	margin-top: 10px;
@@ -499,7 +557,7 @@ div.select-wrapper:hover {
 }
 
 #hp-ql-table a {
-	color: #333;
+	color: #13533f;
 	font-weight: bold;
 	font-size: 13px;
 	text-transform: uppercase;
@@ -540,7 +598,7 @@ div.select-wrapper:hover {
 
 #content-wrapper {
 	background: white;
-	min-height: 260px;
+	min-height: 150px;
 	border-bottom: 1px solid black;
 }
 
@@ -556,7 +614,7 @@ div.select-wrapper:hover {
 #main-content .login_boxes {
 	border: 1px solid #dedede;
 	background:url('/images/login-bg.jpg') top repeat-x;
-	color: #333;
+	color: #13533f;
 }
 
 #main-content .login_boxes h1 {
@@ -645,7 +703,7 @@ div.select-wrapper:hover {
 .results_header_nav1 .h1 {
 	font-size:14px;
 	font-weight:bold;
-	color:#074079;
+	color:#13533F;
 }
 
 .start_end_links_span {
@@ -668,9 +726,6 @@ div.select-wrapper:hover {
 
 .result_table_subtable { width: 100%; border-collapse: collapse; border: 0; }
 
-
-
-
 .icon_text {
 	text-transform:capitalize;
 }
@@ -734,7 +789,7 @@ div.select-wrapper:hover {
 	height:22px;
 	font-size:14px;
 	font-weight:bold;
-	color:#074079;
+	color:#13533F;
 	padding: 0px 7px 0px 0px;
 	border-bottom: 1px dotted #ccc;
 }
@@ -817,7 +872,9 @@ div.select-wrapper:hover {
 }
 
 .search_catalog_lbl {
-	font-size: 14px;
+       font-size: 16px;
+       font-weight: bold;
+       color: #13533F;
 }
 
 .lbl1 {
@@ -845,7 +902,7 @@ div.select-wrapper:hover {
 }
 
 .myopac_payments_table th { text-align: left; }
-.myopac_payments_table thead th { border-bottom: 1px dashed #333; }
+.myopac_payments_table thead th { border-bottom: 1px dashed #13533f; }
 .myopac_payments_table thead th:first-child { width: 8em; }
 .myopac_payments_table tbody tr:nth-child(odd) { background-color: #ddd; }
 .myopac_payments_table form { display: inline; }
@@ -896,13 +953,19 @@ div.select-wrapper:hover {
 	color: white;
 	margin: auto;
 	width: 974px;
-	color: #afafaf;
 	font-size: 11px;
 }
 
 #footer a {
 	color: white;
-	color: #afafaf;
+        font-size: 13px;
+        font-weight: 700;
+}
+
+#footer a:hover {
+        color: white;
+        text-shadow: 0 0 0.2em #ffffff;
+        text-decoration: none;
 }
 
 .color_4 {
@@ -912,8 +975,39 @@ div.select-wrapper:hover {
 }
 
 .advanced_div { padding-top: 15px; }
-#adv_global_search select { width: 13em; }
-#adv_global_input_table select { width: 7em; }
+
+#adv_global_search select { 
+width: 13em; 
+    padding:3px;
+    margin: 0;
+    border-radius:4px;
+    -webkit-box-shadow:
+        0 3px 0 #ccc,
+        0 -1px #fff inset;
+    background: #f8f8f8;
+    color:#13533f;
+    outline:none;
+    display: inline-block;
+    -webkit-appearance:none;
+    cursor:pointer;
+    font-family: 'Droid Sans', Arial, Helvetica, sans-serif;
+}
+
+#adv_global_input_table select {
+    width: 7em; 
+    padding:3px;
+    margin: 0;
+    border-radius:4px;
+    -webkit-box-shadow:
+        0 3px 0 #ccc,
+        0 -1px #fff inset;
+    background: #f8f8f8;
+    color:#13533f;
+    outline:none;
+    display: inline-block;
+    -webkit-appearance:none;
+    font-family: 'Droid Sans', Arial, Helvetica, sans-serif;
+}
 .adv_adv_link { font-size: 8pt; color: red; }
 #acct_prefs_header { float: left; }
 .search_page_nav_link { cursor: pointer; }
@@ -929,7 +1023,7 @@ div.select-wrapper:hover {
 .row-remover { position: relative; top: 1px; vertical-align: middle; }
 .subtle-button {
     background-color: #ffffff;
-    color: #003399; text-decoration: none;
+    color: #black; text-decoration: none;
     font-size: 12px;
     padding: 0; border: 0; margin: 0;
     vertical-align: middle;
@@ -994,9 +1088,11 @@ a.dash-link:hover { text-decoration: underline !important; }
 .opac-button, .results_header_btns, #simple-detail-view-links { 
     color: white; 
     font-weight: bold; 
-    -moz-border-radius: 5%;
-    border-radius: 5%;
-    background: #1784c7; 
+    -moz-border-radius: 4px 4px 4px 4px;
+    border-radius: 4px 4px 4px 4px;
+    background: #2E8469; 
+    font-family: 'Droid Sans', Arial, Helvetica, sans-serif;
+    height: 30px;
 }
 
 .results_header_btns a, #simple-detail-view-links a {
@@ -1008,7 +1104,7 @@ a.dash-link:hover { text-decoration: underline !important; }
 }
 
 a.opac-button:hover, .results_header_btns a:hover, #simple-detail-view-links a:hover {
-    background: #359ee0;
+    background: #26a67e;
     text-decoration: none;
 }
 
@@ -1032,7 +1128,8 @@ a.opac-button {
 
 #rdetail_record_details {
     clear: both;
-    margin-top: 1em;
+    margin-top: 1.5em;
+    padding-top: 1.5em;
 }
 
 .rdetail_subject_type {
@@ -1044,7 +1141,7 @@ a.opac-button {
 
 .error { color: red; font-weight: bold; }
 .success { color: green; font-weight: bold; }
-
+=======
 .rdetail_related_subjects {
     margin-top: 1.5em;
 }
diff --git a/Open-ILS/web/images/plus_sign.png b/Open-ILS/web/images/plus_sign.png
index a17d58a192..0a917352b5 100644
Binary files a/Open-ILS/web/images/plus_sign.png and b/Open-ILS/web/images/plus_sign.png differ
diff --git a/Open-ILS/web/images/rdetail_arrow.png b/Open-ILS/web/images/rdetail_arrow.png
index e464bf2a76..515e9aa941 100644
Binary files a/Open-ILS/web/images/rdetail_arrow.png and b/Open-ILS/web/images/rdetail_arrow.png differ
diff --git a/Open-ILS/web/images/utils-corner-left.png b/Open-ILS/web/images/utils-corner-left.png
index db70a75741..bed9956950 100644
Binary files a/Open-ILS/web/images/utils-corner-left.png and b/Open-ILS/web/images/utils-corner-left.png differ
diff --git a/Open-ILS/web/images/utils-corner-mid.png b/Open-ILS/web/images/utils-corner-mid.png
index 80d4857eb3..4fd4922521 100644
Binary files a/Open-ILS/web/images/utils-corner-mid.png and b/Open-ILS/web/images/utils-corner-mid.png differ
diff --git a/Open-ILS/web/images/utils-corner-right.png b/Open-ILS/web/images/utils-corner-right.png
index 303ab75156..f6fcebeb7e 100644
Binary files a/Open-ILS/web/images/utils-corner-right.png and b/Open-ILS/web/images/utils-corner-right.png differ
diff --git a/Open-ILS/web/opac/images/content-bg.gif b/Open-ILS/web/opac/images/content-bg.gif
index 3af8f8b8de..9964a5f990 100644
Binary files a/Open-ILS/web/opac/images/content-bg.gif and b/Open-ILS/web/opac/images/content-bg.gif differ