Amélioration de la présentation de la recherche

2 files changed, 17 insertions, 6 deletions

diff --git a/static/saclay/css/styles.css b/static/saclay/css/styles.css
index 4abae53..e55b385 100644
--- a/static/saclay/css/styles.css
+++ b/static/saclay/css/styles.css
@@ -1619,20 +1619,21 @@ ul#roadmap_toolbar, ul#roadmap_toolbar ul, ul#roadmap_toolbar li{
 
 #search-box,
 #search-nav{
-    background-color:#fff;
+    background-color: transparent;
 }
 
 #search-form{
     background-color: #eaeaea;
     margin: 20px 0;
-    padding: 5px 0 5px 15px;
+    padding: 5px 0 5px 10px;
     border-bottom: 0 solid transparent;
 }
 
 #search-form input{
     border: 0;
     background-color: #eaeaea;
-    width: 210px;
+    width: 235px;
+    font-size: 0.85em;
 }
 
 #haystack-search-page .action-label,
@@ -1642,13 +1643,19 @@ ul#roadmap_toolbar, ul#roadmap_toolbar ul, ul#roadmap_toolbar li{
 
 
 #haystack-search{
-    width:35px;
+    width: 20px;
     height:28px;
     vertical-align:top;
     border: 0;
     background-color: #eaeaea;
     border-radius: 0;
     box-shadow: none;
+    padding: 0;
+    margin: 0;
+}
+
+#haystack-search:hover{
+    color: #999;
 }
 
 #edit-panel {
diff --git a/templates/search/search.html b/templates/search/search.html
index 8aab1eb..e6f37fc 100644
--- a/templates/search/search.html
+++ b/templates/search/search.html
@@ -29,8 +29,12 @@ var end_do_you_mean = "{% trans '?' %}";
 
 {% else %}
 <form id='search-form' class='autocomplete-me'>
-    <input type="text" id="id_q" name="q" autocomplete="off"/>
-    <button name='haystack-search' id='haystack-search' type='button' class="btn btn-default"><span class='action-label'>{% trans "Search" %} </span><span class="glyphicon glyphicon-search"></span></button>
+    <input type="text" id="id_q" name="q" autocomplete="off"
+           placeholder="TROUVEZ un concert, du poulet fermier..."/>
+    <button name='haystack-search' id='haystack-search' type='button'
+            class="btn btn-default"><span class='action-label'>{% trans "Search" %} </span>
+        <i class="fa fa-search" aria-hidden="true"></i>
+    </button>
 </form>
 <div id='spelling'></div>
 <div id='search-result'></div>