From 844c9186524af3e54df691029f002678d32266f6 Mon Sep 17 00:00:00 2001
From: Lauren McCarthy <laurmccarthy@gmail.com>
Date: Mon, 19 Dec 2016 14:52:21 -0800
Subject: [PATCH] styling of nav and toolbar (#237)

* removing avenir, replacing with montserrat

* sidebar tweaks

* sidebar positioning

* resolving merge conflict

* working on sidebar

* removing avenir font, using montserrat instead due to licensing issues

* removing old import statement for typeography scss file

* design formatting for sidebar closes #234

* styling of nav and toolbar
---
 client/components/Nav.jsx              |  4 ++--
 client/styles/components/_nav.scss     | 26 ++++++++++++++++++++++----
 client/styles/components/_toolbar.scss |  2 +-
 3 files changed, 25 insertions(+), 7 deletions(-)

diff --git a/client/components/Nav.jsx b/client/components/Nav.jsx
index e349d062..ea759515 100644
--- a/client/components/Nav.jsx
+++ b/client/components/Nav.jsx
@@ -109,9 +109,9 @@ function Nav(props) {
         {(() => {
           if (!props.user.authenticated) {
             return (
-              <li className="nav__item">
+              <li className="nav__item login__items">
                 <p>
-                  <Link to="/login">Login</Link> or <Link to="/signup">Sign Up</Link>
+                  <Link to="/login">Login</Link> <span className="spacer">or</span> <Link to="/signup">Sign Up</Link>
                 </p>
               </li>
             );
diff --git a/client/styles/components/_nav.scss b/client/styles/components/_nav.scss
index 224fc45d..e84e7598 100644
--- a/client/styles/components/_nav.scss
+++ b/client/styles/components/_nav.scss
@@ -1,7 +1,6 @@
 .nav {
 	width: 100%;
-	padding: #{10 / $base-font-size}rem #{70 / $base-font-size}rem;
-	padding-left: #{33 / $base-font-size}rem;
+	padding: #{10 / $base-font-size}rem #{32 / $base-font-size}rem 0 #{32 / $base-font-size}rem;
 	display: flex;
 	flex-direction: row;
 	justify-content: space-between;
@@ -15,15 +14,24 @@
 	display: flex;
 	flex-direction: row;
 	justify-content: flex-end;
-	padding: #{5 / $base-font-size}rem #{10 / $base-font-size}rem;
+	padding: #{3 / $base-font-size}rem 0;
 }
 
 .nav__item {
 	position: relative;
-	min-width: #{72 / $base-font-size}rem;
+	padding: 0 #{24 / $base-font-size}rem;
 	text-align: center;
 }
 
+.nav__item:first-child {
+	padding-left: #{15 / $base-font-size}rem;
+}
+
+.nav__item:last-child {
+	padding-right: #{15 / $base-font-size}rem;
+}
+
+
 .nav__dropdown {
 	@include themify() {
 		background-color: map-get($theme-map, 'background-color');
@@ -42,4 +50,14 @@
 		left: #{-10 / $base-font-size}rem;
 		height: auto;
 	}
+}
+
+.login__items {
+	@include themify() {
+		color: map-get($theme-map, 'inactive-text-color');
+	}	
+}
+
+.login__items span.spacer {
+	padding: 0 #{15 / $base-font-size}rem;
 }
\ No newline at end of file
diff --git a/client/styles/components/_toolbar.scss b/client/styles/components/_toolbar.scss
index b07a3974..3aa29ff5 100644
--- a/client/styles/components/_toolbar.scss
+++ b/client/styles/components/_toolbar.scss
@@ -60,7 +60,7 @@
 }
 
 .toolbar {
-	padding: #{15 / $base-font-size}rem #{34 / $base-font-size}rem;
+	padding: #{20 / $base-font-size}rem #{34 / $base-font-size}rem;
 	display: flex;
 	align-items: center;
 }