Use jquery hint for text inputs

This allow simples hints for inputs in Noosfero. Later a search input will receive use this plugin for hints.

Use jquery hint for text inputs
This allow simples hints for inputs in Noosfero. Later a search input will receive use this plugin for hints.
Braulio Bhavamitra
1 parent 81eb23f2
Showing 3 changed files with 6 additions and 11 deletions Show diff stats
app/views/layouts/application-ng.rhtml
public/designs/themes/base/style.css
public/stylesheets/application.css
@@ -66,15 +66,9 @@
               </div>
           </span>
           <form action="/search" class="search_form" method="get" class="clean">
-            <input name="query" size="15" value="<%=_('Search...')%>"
-                onfocus="this.form.className='focused';
-                         if(this.value=='<%=_('Search...')%>'){this.value=''}"
-                onblur="this.form.className='';
-                        if(/^\s*$/.test(this.value)){
-                          this.value='<%=_('Search...')%>';
-                          this.form.className='clean'
-                        }" />
+            <input name="query" size="15" title="<%=_('Search...')%>" />
             <div><%=_('Press <strong>Enter</strong> to send the search query.')%></div>
+            <%= javascript_tag 'jQuery("#user form input").hint();' %>
           </form>
         </div><!-- end id="user" -->
@@ -108,14 +108,14 @@ body, th, td, input {
   margin-left: 20px;
 }
-#user form input {
+#user form input .blur {
   width: 160px;
   border: 1px solid #BBB;
   -moz-border-radius: 3px;
   -webkit-border-radius: 3px;
   color: #CCC;
 }
-#user form.focused input {
+#user form input {
   border: 1px solid #888;
   color: #555;
 }
@@ -6281,7 +6281,8 @@ li.product-item {
   overflow: visible;
   color:#fff;
   text-align: left;
-  padding:0;
+  font-weight: bold;
+  padding-left: 10px;
   border: none;
   height:34px;
   display:inline-block;
	@@ -108,14 +108,14 @@ body, th, td, input {		@@ -108,14 +108,14 @@ body, th, td, input {
108	margin-left: 20px;	108	margin-left: 20px;
109	}	109	}
110		110
111	-#user form input {	111	+#user form input .blur {
112	width: 160px;	112	width: 160px;
113	border: 1px solid #BBB;	113	border: 1px solid #BBB;
114	-moz-border-radius: 3px;	114	-moz-border-radius: 3px;
115	-webkit-border-radius: 3px;	115	-webkit-border-radius: 3px;
116	color: #CCC;	116	color: #CCC;
117	}	117	}
118	-#user form.focused input {	118	+#user form input {
119	border: 1px solid #888;	119	border: 1px solid #888;
120	color: #555;	120	color: #555;
121	}	121	}