From 35014da2861944b48160a4d90ba489881007dc9d Mon Sep 17 00:00:00 2001
From: Andromeda Yelton <andromeda.yelton@gmail.com>
Date: Mon, 12 Dec 2011 16:09:18 -0500
Subject: [PATCH] watermark ALL the things

---
 frontend/templates/base.html  |  2 +-
 frontend/templates/home.html  |  2 +-
 static/css/landingpage.css    |  1 +
 static/css/sitewide.css       | 23 +++++++++--------------
 static/js/watermark_change.js |  4 ++--
 static/js/watermark_init.js   |  2 +-
 static/less/landingpage.less  |  1 +
 static/less/sitewide.less     | 30 +++++++++++++++++-------------
 8 files changed, 33 insertions(+), 32 deletions(-)

diff --git a/frontend/templates/base.html b/frontend/templates/base.html
index ce077f1f..c4ceb146 100644
--- a/frontend/templates/base.html
+++ b/frontend/templates/base.html
@@ -33,7 +33,7 @@
             <div class="js-search">
             <div class="js-search-inner">
                 <form action="{% url search %}" method="get">
-                    <input type="text" id="watermark" size="25" class="inputbox" name="q" value="{{ q }}">
+                    <input type="text" id="watermark" size="25" onfocus="imgfocus()" onblur="imgblur(15)" class="inputbox" name="q" value="{{ q }}">
                     <input type="button" onclick="this.form.searchword.focus();"  class="button" value="Search">
                 </form>
             </div>
diff --git a/frontend/templates/home.html b/frontend/templates/home.html
index afbd3a85..a875d6af 100755
--- a/frontend/templates/home.html
+++ b/frontend/templates/home.html
@@ -117,7 +117,7 @@ var $j = jQuery.noConflict();
                         <div id="js-search">
                         	<label>What book would you give to the world? </label>
 				                <form action="{% url search %}" method="get">
-                				    <input type="text" id="watermark" onfocus="imgfocus()" onblur="imgblur()" size="25" class="inputbox" name="q" value="{{ q }}">
+                				    <input type="text" id="watermark" onfocus="imgfocus()" onblur="imgblur(0)" size="25" class="inputbox" name="q" value="{{ q }}">
                 				    <input type="button" onclick="this.form.searchword.focus();"  class="button" value="Search">
                					</form>
                         </div>
diff --git a/static/css/landingpage.css b/static/css/landingpage.css
index 3cfc09c7..2faa3186 100644
--- a/static/css/landingpage.css
+++ b/static/css/landingpage.css
@@ -270,6 +270,7 @@ h2.page-heading {
   padding: 0;
   margin: 5px 0 5px 20px;
   width: 175px;
+  outline: none;
 }
 #js-search input[type=button] {
   background: url(/static/images/landingpage/search-button.png) 0 0 no-repeat;
diff --git a/static/css/sitewide.css b/static/css/sitewide.css
index dd9163a1..09a56d49 100644
--- a/static/css/sitewide.css
+++ b/static/css/sitewide.css
@@ -160,24 +160,19 @@ a.readon span {
 .js-search .inputbox {
   padding: 0 0 0 15px;
   margin: 0;
-  border: none;
+  border: solid 4px #8ac3d7;
+  -moz-border-radius: 50px 50px 50px 50px;
+  -webkit-border-radius: 50px 50px 50px 50px;
+  border-radius: 50px 50px 50px 50px;
   outline: none;
-  background: url("/static/images/bg.png") -645px -180px;
-  height: 36px;
-  line-height: 36px;
+  height: 28px;
+  line-height: 28px;
+  width: 176px;
   float: left;
   color: #6994a3;
 }
 .js-search .button {
-  background: url("/static/images/bg.png") 100% -144px no-repeat;
-  padding: 0;
-  margin: 0;
-  width: 40px;
-  height: 36px;
-  display: block;
-  border: none;
-  text-indent: -10000px;
-  cursor: pointer;
+  display: none;
 }
 .js-search-inner {
   float: right;
@@ -198,7 +193,7 @@ a.readon span {
   text-decoration: underline;
 }
 #js-leftcol .jsmod-content {
-  border: 1px solid #edf3f4;
+  border: solid 1px #edf3f4;
   margin-left: 10px;
   -moz-border-radius: 0 0 10px 10px;
   -webkit-border-radius: 0 0 10px 10px;
diff --git a/static/js/watermark_change.js b/static/js/watermark_change.js
index a9b93559..c5a4adfc 100644
--- a/static/js/watermark_change.js
+++ b/static/js/watermark_change.js
@@ -1,6 +1,6 @@
-function imgblur(){
+function imgblur(pos){
 	if (document.getElementById('watermark').value == "") {
-		document.getElementById('watermark').style.background="url('/static/images/google_watermark.gif') no-repeat left center";
+		document.getElementById('watermark').style.background="white url('/static/images/google_watermark.gif') no-repeat "+pos+"px center";
 	}
 }
 
diff --git a/static/js/watermark_init.js b/static/js/watermark_init.js
index cfb75bd7..814df5ba 100644
--- a/static/js/watermark_init.js
+++ b/static/js/watermark_init.js
@@ -1,6 +1,6 @@
 var $j = jQuery.noConflict();
 $j(document).ready(function() {
 	if (!$j('#watermark').val()) {
-		$j('#watermark').css({"background": "url('/static/images/google_watermark.gif') no-repeat left center"});
+		$j('#watermark').css({"background": "white url('/static/images/google_watermark.gif') no-repeat left center"});
 	}
 });
diff --git a/static/less/landingpage.less b/static/less/landingpage.less
index 3a5d24cc..ff51ca2d 100644
--- a/static/less/landingpage.less
+++ b/static/less/landingpage.less
@@ -306,6 +306,7 @@ h2.page-heading {
 		padding:0; 
 		margin:5px 0 5px 20px; 
 		width: 175px;
+        outline: none;
 	}
 	
 	&[type=button] { 
diff --git a/static/less/sitewide.less b/static/less/sitewide.less
index bbe49ec7..2723db82 100644
--- a/static/less/sitewide.less
+++ b/static/less/sitewide.less
@@ -173,24 +173,28 @@ a.readon {
     .inputbox {
         padding:0 0 0 15px;
         margin:0;
-        border:none;
+        border: solid 4px #8ac3d7;
+        .border-radius(50px, 50px, 50px, 50px);
         outline: none;
-        background:url(@background-header) -645px -180px;
-        .height(36px);
+        // background:url(@background-header) -645px -180px;
+        .height(28px);
+        width:176px;
         float: left;
         color:@medium-blue;
     }
     
     .button {
-        background:url(@background-header) 100% -144px no-repeat;
-        padding:0;
-        margin:0;
-        width:40px;
-        height:36px;
-        display:block;
-        border:none;
-        text-indent:-10000px;
-        cursor:pointer;
+    	display: none;
+    	// Not presently compatible with Google watermark.
+        // background:url(@background-header) 100% -144px no-repeat;
+        // padding:0;
+        // margin:0;
+        // width:20px;
+        // height:26px;
+        // display:block;
+        // border:none;
+        // text-indent:-10000px;
+        // cursor:pointer;
     }
 }
 
@@ -216,7 +220,7 @@ a.readon {
     }
     
     .jsmod-content {
-        border:1px solid @pale-blue;
+        border: solid 1px @pale-blue;
         margin-left:10px;
         .border-radius(0, 0, 10px, 10px);
     }