From cf59b4c18e7028f11a8b67ccf55bd33716cc9172 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?benjamin=20melan=C3=A7on?= <ben@agaric.com>
Date: Thu, 1 Aug 2019 07:54:34 -0400
Subject: [PATCH] Move base stuff into elements and align green bar with logo

---
 .../custom/geofresco/src/global/_base.scss    | 52 +++--------------
 .../geofresco/src/global/_elements.scss       | 56 ++++++++++++-------
 2 files changed, 44 insertions(+), 64 deletions(-)

diff --git a/web/themes/custom/geofresco/src/global/_base.scss b/web/themes/custom/geofresco/src/global/_base.scss
index 7ac1716..85a6668 100644
--- a/web/themes/custom/geofresco/src/global/_base.scss
+++ b/web/themes/custom/geofresco/src/global/_base.scss
@@ -13,6 +13,13 @@
   font-family: $family-geo;
 }
 
+// Prevent images from being larger than their Drupal-set size
+.image.no-upscale img {
+  width: intrinsic;           /* Safari/WebKit uses a non-standard name */
+  width: -moz-max-content;    /* Firefox/Gecko */
+  width: -webkit-max-content; /* Chrome */
+}
+
 // Give us some color classes
 .green {
   color: $green;
@@ -22,48 +29,5 @@
   color: $yellow;
 }
 
-.geo-title {
-  display: block;
-  width: 6em;
-  position: relative;
-  bottom: 3.6rem;
-  overflow: visible;
-  height: 1rem;
-}
+// $navbar-item-img-max-height: 3rem;
 
-.block-geofresco-branding {
-  margin-bottom: 0;
-}
-
-// Prevent images from being larger than their Drupal-set size
-.image.no-upscale img {
-  width: intrinsic;           /* Safari/WebKit uses a non-standard name */
-  width: -moz-max-content;    /* Firefox/Gecko */
-  width: -webkit-max-content; /* Chrome */
-}
-
-// Add a gradient across only a portion of the vertical width of the navbar.
-.navbar {
-  background: linear-gradient(
-    $body-background-color,
-    $body-background-color 20px,
-    $light-green 20px,
-    $green 40px,
-    $green 60px,
-    $body-background-color 60px,
-    $body-background-color
-  );
-}
-
-
-// Style the wordmark (logo)
-.navbar-item .wordmark {
-  max-height: 3rem; // 4rem
-}
-
-$navbar-item-img-max-height: 3rem;
-
-.navbar-item .wordmark img {
-  height: 100%;
-  width: auto;
-}
diff --git a/web/themes/custom/geofresco/src/global/_elements.scss b/web/themes/custom/geofresco/src/global/_elements.scss
index bfb4a34..1b2f555 100644
--- a/web/themes/custom/geofresco/src/global/_elements.scss
+++ b/web/themes/custom/geofresco/src/global/_elements.scss
@@ -1,27 +1,43 @@
 @charset "UTF-8";
 // Extend or override Bulma's elements ../../node_modules/bulma/sass/elements
 
-// Style the slogan shown at the top of each page
-/*
-.slogan.title {
-  color: $red;
-  font-style: italic;
-  font-weight: normal;
+
+.geo-title {
   display: inline-block;
-  margin-top: 0.8rem; // 1.2rem
-  margin-left: 0.6rem; // 0.8rem
+  width: 6em;
 }
 
-.hero.is-primary .family-home-branding__front {
-  padding: .5rem .75rem;
-  background-color: white;
-  .column {
-    display: flex;
-    justify-content: center;
-  }
-  .slogan.title {
-    margin-top: 0;
-    color: $red;
-  }
+.user-account-menu li {
+  display: inline-block;
+  padding: .1rem .6rem;
+  float: right;
+}
+
+.search-bar form {
+  float: right;
+}
+
+#block-geofresco-branding {
+  figure {
+    display: inline-block;
+  }
+  margin-bottom: 0;
+}
+
+.navbar-brand {
+  position: relative;
+  top: -36px;
+}
+
+// Add a gradient across only a portion of the vertical width of the navbar.
+.navbar {
+  background: linear-gradient(
+    $body-background-color,
+    $body-background-color 38px,
+    $light-green 38px,
+    $green 60px,
+    $green 84px,
+    $body-background-color 84px,
+    $body-background-color
+  );
 }
-*/