Making the navbar styling a bit nicer

Joe Alves · Joe Alves · commit 04d0369580e5 · 2015-07-16T12:04:12.000-04:00
diff --git a/generated/browser/scss/about/main.scss b/generated/browser/scss/about/main.scss
@@ -3,6 +3,7 @@
   width: 1340px;
   margin: 0 auto;
   padding: 50px 100px;
+  @include clearfix;
 
   p {
     width: 400px;
@@ -32,4 +33,4 @@
     }
   }
 
-}
+}
diff --git a/generated/browser/scss/directives/navbar.scss b/generated/browser/scss/directives/navbar.scss
@@ -1,38 +1,47 @@
 navbar {
 
   display: block;
-  background: #a1a1a1;
+  background: white;
+  border-bottom: 1px solid black;
+  box-shadow: 1px 1px 14px -3px black;
+
+  .container {
+    width: 1340px;
+    padding-top: 20px;
+  }
 
   fullstack-logo {
-    padding-top: 10px;
+    margin-top: 5px;
     margin-right: 20px;
-    width: 30px;
+    width: 40px;
   }
 
   a {
-    color: white;
-    &:hover {
-      color: white;
-    }
+    color: black;
+    font-size: 16px;
   }
 
   .nav > li > a {
     cursor: pointer;
+    transition: color 0.2s;
     &.active {
-      color: #f30046;
+      color: darken(#f31214, 10%);
     }
     &:hover {
-      transition: color 0.2s;
+      background: none;
+      color: #f31214;
     }
     &:focus {
-      color: #f30046;
-      background: transparent;
+      background: none;
     }
   }
 
   .login-button {
     float: right;
-    margin-top: 8px;
+    border: 1px solid black;
+    margin-top: 10px;
+    background: none;
+    outline: none !important;
   }
 
   .welcome {
@@ -47,4 +56,4 @@ navbar {
     }
   }
 
-}
+}
diff --git a/generated/browser/scss/main.scss b/generated/browser/scss/main.scss
@@ -2,6 +2,10 @@
   box-sizing: border-box;
 }
 
+body {
+  background: #fdfdfd;
+}
+
 @mixin clearfix {
   &:after {
     content: "";
@@ -10,8 +14,12 @@
   }
 }
 
+#main {
+  padding-top: 60px;
+}
+
 @import 'directives/main';
 @import 'home/main';
 @import 'about/main';
 @import 'tutorial/main';
-@import 'login/main';
+@import 'login/main';
diff --git a/generated/server/app/views/index.html b/generated/server/app/views/index.html
@@ -14,6 +14,6 @@
 </head>
 <body ng-app="FullstackGeneratedApp">
     <navbar></navbar>
-    <div ui-view></div>
+    <div id="main" ui-view></div>
 </body>
-</html>
+</html>

Original file line number	Diff line number	Diff line change
`@@ -3,6 +3,7 @@`
`3`	`3`	`width: 1340px;`
`4`	`4`	`margin: 0 auto;`
`5`	`5`	`padding: 50px 100px;`
	`6`	`+ @include clearfix;`
`6`	`7`
`7`	`8`	`p {`
`8`	`9`	`width: 400px;`
`@@ -32,4 +33,4 @@`
`32`	`33`	`}`
`33`	`34`	`}`
`34`	`35`
`35`		`-}`
	`36`	`+}`