From 2948a2ebe4dfe8383e79c137a4315e2ccc3ca066 Mon Sep 17 00:00:00 2001
From: Alberto Garcia Cabeza <alberto@decabeza.es>
Date: Thu, 7 Jan 2016 12:05:05 +0100
Subject: [PATCH] Improves search form of header

---
 app/assets/stylesheets/layout.scss | 48 +++++++++++-------------------
 app/assets/stylesheets/mixins.scss |  7 +++--
 config/locales/en.yml              |  2 +-
 config/locales/es.yml              |  2 +-
 4 files changed, 23 insertions(+), 36 deletions(-)

diff --git a/app/assets/stylesheets/layout.scss b/app/assets/stylesheets/layout.scss
index d47189d18..95dd958f6 100644
--- a/app/assets/stylesheets/layout.scss
+++ b/app/assets/stylesheets/layout.scss
@@ -232,14 +232,13 @@ header {
   }
 
   .selected {
-    border-bottom: 2px solid white;
-    padding-bottom: $line-height/12;
+    border-bottom: 1px solid white;
     position: relative;
   }
 
   .locale {
     float: none;
-    font-family: $font-sans;
+    height: $line-height*1.5;
 
     @media (min-width: $small-breakpoint) {
       float: left;
@@ -264,7 +263,20 @@ header {
     }
 
     .postfix {
+      background: $border;
+      border: 1px solid #ccc;
+      border-left: 0;
+      color: $text;
       height: rem-calc(37);
+
+      &:hover {
+        background: $brand;
+        color: white;
+      }
+    }
+
+    input {
+      border-right: 0;
     }
 
     input, .button {
@@ -456,11 +468,6 @@ header {
 
   @media (min-width: $small-breakpoint) {
     background: white;
-    padding-left: 0;
-
-    & > .column {
-      padding-left: 0;
-    }
   }
 
   a {
@@ -475,7 +482,6 @@ header {
     @media (min-width: $small-breakpoint) {
       color: $text;
       font-weight: bold;
-      margin-left: $line-height/2;
       margin-right: $line-height*1.5;
       margin-right: 12px\9;
       width: auto;
@@ -1201,34 +1207,14 @@ table {
 }
 
 .social {
-  margin-top: $line-height;
-  padding-top: $line-height/4;
-  text-align: center;
-  vertical-align: middle;
-
-  @media (min-width: $small-breakpoint) {
-    margin-top: 0;
-    text-align: right;
-  }
 
   a {
-    font-size: rem-calc(24);
-    line-height: $line-height;
+    font-size: $h3-font-size;
     margin: 0 $line-height/2;
     text-decoration: none;
-    vertical-align: middle;
 
     &:hover {
-      opacity: .5;
-      text-decoration: none;
-    }
-
-    @media (min-width: $small-breakpoint) {
-      font-size: rem-calc(18);
-    }
-
-    &:last-child {
-      margin-right: 0;
+      color: $brand;
     }
   }
 }
diff --git a/app/assets/stylesheets/mixins.scss b/app/assets/stylesheets/mixins.scss
index f913ed464..3b2bde372 100644
--- a/app/assets/stylesheets/mixins.scss
+++ b/app/assets/stylesheets/mixins.scss
@@ -18,8 +18,9 @@
   font-weight: lighter;
 
   @media (min-width: $small-breakpoint) {
-    font-size: rem-calc(24);
-    line-height: rem-calc(48);
+    font-size: $h3-font-size;
+    line-height: $line-height*2;
+    margin-top: 0;
   }
 
   img {
@@ -28,7 +29,7 @@
 
     @media (min-width: $small-breakpoint) {
       height: 80px;
-      margin-right: rem-calc(12);
+      margin-right: $line-height/2;
       margin-top: 0;
       width: 80px;
     }
diff --git a/config/locales/en.yml b/config/locales/en.yml
index 3ee698c91..7c17e5b46 100755
--- a/config/locales/en.yml
+++ b/config/locales/en.yml
@@ -173,7 +173,7 @@ en:
       search_form:
         title: "Search"
         button: "Search"
-        placeholder: "Search citizen proposals..."
+        placeholder: "Search proposals..."
       search_results:
         one: " containing the term '%{search_term}'"
         other: " containing the term '%{search_term}'"
diff --git a/config/locales/es.yml b/config/locales/es.yml
index 46bb3b88b..1778ebd46 100644
--- a/config/locales/es.yml
+++ b/config/locales/es.yml
@@ -173,7 +173,7 @@ es:
       search_form:
         title: "Buscar"
         button: "Buscar"
-        placeholder: "Buscar propuestas ciudadanas..."
+        placeholder: "Buscar propuestas..."
       search_results:
         one: " que contiene '%{search_term}'"
         other: " que contienen '%{search_term}'"