From dcec003d0efa23b3fb09cf797e2ce2bf6515f517 Mon Sep 17 00:00:00 2001
From: decabeza <alberto@decabeza.es>
Date: Fri, 20 Jul 2018 18:50:49 +0200
Subject: [PATCH] Updates header markup and includes new logo

---
 app/assets/images/logo_header.png  | Bin 1959 -> 3655 bytes
 app/assets/stylesheets/layout.scss |  14 ++++++
 app/views/layouts/_header.html.erb |  67 +++++++++++------------------
 3 files changed, 38 insertions(+), 43 deletions(-)

diff --git a/app/assets/images/logo_header.png b/app/assets/images/logo_header.png
index c178ec7811199c2fd1f25f3d4a62d4f9465d74b1..84478da8325603c1e746a619ef49cdf6dc514f56 100644
GIT binary patch
delta 2946
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
BK{NmW

delta 1219
zcmX>uvz%YCGr-TCmrII^fq{Y7)59eQNC$v02OE&=6a2JxqvBV_$s){(910b=1-`yk
zo|BI<nNBWYN>OljwKO($GBB_(H*_;JbTxN$aW-|fbTc+`H8gQGbTOFxgGmOa$PlL@
z6K1D+%bT7a3=Axyo-U3d6}R5Zj`R=>lsLXu&oyO{rz+>oWn!&UJzYJ!MbfNwS#<3}
zws52hI^A&Qe;9p%FEU8v%Y|P;s=7-a2G35I*5<O(b&+nsqKOMH|34t8cc>!$+|P4o
zT=(1miQ8jbS6)~AY>sjIGd7*mT@O~MPZHhWAa;T&vR<K`brXnXsWSo0NNfZ%__$LV
zbqWMjZe95A%Q{m*_6W20yfyp_1Vfs|4pluqm}4NQ!fM*5|3J7xIs3A^%~a(SEe+Q9
zy1&0POn;yuu`*Jhb4o+h>i<`ojV3tO>{-I}`C$6#*er*2Nqb%Sj(qjyz9HMk#O=6!
zY5lZ(h4ZPl8*67L?bR#baB1s45W`z}P&awn;i{JlA~)ZQ-_Yrl;PClui^T^iAGH^K
z^P9dt2=93Nt}&G5>#PG#7v5YqNz=IDt>Ul3uEW3atdUZslIDT~=PMs%Y-p?q+F*R7
z{FYBl{_H(nHG(s=&nu-)Yw|Rk&pUm(OzNbAUb6i4R!r(Aniu)?oxSgVGOyXH+i{IN
z)Bi@fN6nlKI<wF3dMe9Xy6KOQgf9OKtINNBu2XxZdLr8IJnO#+YbRKh-F4dCD0csK
zLW?}p>8EF{e!ks#_I~{-%k-9Z(_StS;fu%R*2~?M@_5}?e?XJHoNvlb?l|5htf7UR
z;!S$}*EC$`@2=<GBGmuKu#Qt?Cs)@KlV&A(=bAX?Pn@b{uXMHr>AsxLxZ1Iqoyk?M
zQFKAmf_V~i_Wjb`P#!XmyX&B}<=X(yy@%hfditnoM}3{*@=&eH)yA^i62BJqS{PO)
zESs~W>)NCj1@}XadS}_qP*;C+Q{n8xy6A(vSM@X=9MqpWDRuwU`WG8aQv~j8y4v)T
zZ`<n$-QsH>7I5C~Ef9~{vag7#^0@3N;gy$UdwjS>UYGlcJ5)ch@mF7T+Tuad@7s0f
znSXazxK$rI`fch0zv93LF)g22FPT}+YG3NGu`FEexBc>+oORmQx|viH8oO)Pz4nRs
z;SwnqI(|S%{CCH+?+%NXRcx!@c>L*|_k1Ux%>Ut8D`K(o!;HfHZfBWVtCk=Bc(#S5
zAnsv;mctsSy%Gfh4`-GvuGuCN#&pzL-CyL%)@Glh<w@%_>_YAf<*hGUbG72^qYaNv
zW(BPY_xf8TcvRsMN1NuGa>+TNH`e<WZV|h@MEQxc+Qpd~MK^`ynl?&(z1F}d{<U7}
z0MDyy?l;+wHEW4~I+k&*yYM3WwMI>~CxQKkUdwFh$__Gf-7CWWUfGU0bJ>$XZjqQx
zmJ{ADh&U&#`TFhVmDf4-nk*)N^5KwCe;#>oC;uj1*#iOrH<!<Q;bk^UEZu8CLiGd-
z!{=RQH3G#?xF?@K$ahHZ&}4BP_SzriO2C|E3CeuPd2Rx0QG^00^G!I+6sf>1!}C-B
b0K-R<lNLvg|C$Lbml!-<{an^LB{Ts5FyIj@

diff --git a/app/assets/stylesheets/layout.scss b/app/assets/stylesheets/layout.scss
index 1ad457b87..2c09ecb84 100644
--- a/app/assets/stylesheets/layout.scss
+++ b/app/assets/stylesheets/layout.scss
@@ -542,6 +542,20 @@ header {
       }
     }
   }
+
+  .top-bar-title {
+    line-height: $line-height;
+
+    a img {
+      height: rem-calc(48);
+      margin: 0;
+      width: auto;
+
+      @include breakpoint(medium up) {
+        height: auto;
+      }
+    }
+  }
 }
 
 .menu-icon {
diff --git a/app/views/layouts/_header.html.erb b/app/views/layouts/_header.html.erb
index 8b4c0a171..8fe3644aa 100644
--- a/app/views/layouts/_header.html.erb
+++ b/app/views/layouts/_header.html.erb
@@ -10,60 +10,41 @@
   </div>
 
   <div class="row">
-    <div class="title-bar" data-responsive-toggle="responsive_menu" data-hide-for="medium">
-      <button class="menu-icon" type="button" data-toggle="responsive_menu"></button>
-      <div class="title-bar-title"><%= t("application.menu")%></div>
-    </div>
-
     <div class="top-bar">
-      <ul class="menu show-for-small-only">
-        <li class="menu-text">
-          <%= link_to root_path, accesskey: "0" do %>
-            <%= image_tag(image_path_for("logo_header.png"),
-                          class: "float-left",
-                          size: "48x48",
-                          alt: t("layouts.header.logo")) %>
-            <%= setting["org_name"] %>
-          <% end %>
-        </li>
-      </ul>
-    </div>
 
-    <div class="top-bar" id="responsive_menu">
-      <div class="top-bar-left">
-        <ul class="menu">
-          <li class="menu-text">
-            <%= link_to root_path, class: "hide-for-small-only", accesskey: "0" do %>
-              <%= image_tag(image_path_for("logo_header.png"),
-                            class: "hide-for-small-only float-left",
-                            size: "80x80",
-                            alt: t("layouts.header.logo")) %>
-              <%= setting["org_name"] %>
-            <% end %>
-          </li>
-        </ul>
+      <span data-responsive-toggle="responsive-menu" data-hide-for="medium" class="float-right">
+        <span class="menu-icon dark" data-toggle></span>
+        <%= t("application.menu")%>
+      </span>
+
+      <div class="top-bar-title">
+        <%= link_to root_path, accesskey: "0" do %>
+          <%= image_tag(image_path_for('logo_header.png'), class: 'float-left', alt: t("layouts.header.logo")) %>
+        <% end %>
       </div>
 
-      <div class="top-bar-right">
-        <ul class="dropdown menu" data-dropdown-menu>
-          <%= render "shared/admin_login_items" %>
-          <%= render "layouts/notification_item" %>
-          <%= render "devise/menu/login_items" %>
-        </ul>
-      </div>
+      <div id="responsive-menu">
+        <div class="top-bar-right">
+          <ul class="menu" data-responsive-menu="medium-dropdown">
+            <%= render "shared/admin_login_items" %>
+            <%= render "layouts/notification_item" %>
+            <%= render "devise/menu/login_items" %>
+          </ul>
 
-      <div class="show-for-small-only">
-        <div class="subnavigation row">
-          <%= render "shared/subnavigation" %>
-          <div class="small-12 column">
-            <%= render "shared/top_links" %>
+          <div class="show-for-small-only">
+            <div class="subnavigation row">
+              <%= render "shared/subnavigation" %>
+              <div class="small-12 column">
+                <%= render "shared/top_links" %>
+              </div>
+            </div>
           </div>
         </div>
       </div>
     </div>
   </div>
 
-  <div class="subnavigation expanded">
+  <div id="navigation_bar" class="subnavigation expanded">
     <div class="row">
       <div class="hide-for-small-only">
         <%= render "shared/subnavigation" %>