Merge pull request #1 from mbburch/colors

Colors
Jpease1020 · Oct 30, 2015 · e9fd493 · e9fd493
2 parents b8eeecd + e81a97e
commit e9fd493
Show file tree

Hide file tree

Showing 7 changed files with 80 additions and 56 deletions.
diff --git a/app/assets/javascripts/navbar.scss b/app/assets/javascripts/navbar.scss
diff --git a/app/assets/stylesheets/application.scss b/app/assets/stylesheets/application.scss
@@ -20,18 +20,28 @@
  @import "blogs";
  @import "welcome";
 
+ /* Coolors Exported Palette - coolors.co/27aad8-d3c82b-7cb826-ac1b26-16363d */
+
+ $color1: #27aad8; //rgba(39, 170, 216, 100)
+ $color2: #d3c82b; //rgba(211, 200, 43, 100)
+ $color3: #4c8e2d; //rgba(124, 184, 38, 100)
+ $color4: #ac1b26; //rgba(172, 27, 38, 100)
+ $color5: #16363d; //rgba(22, 54, 61, 100)
+
  body {
    font-size: 100%;
    font-family: "Helvetica", sans-serif;
  }
 
+ body {
+    padding-top: 50px;
+    background-color: $color3;
+ }
+
  h1 {
    font-size: 100px;
    padding-bottom: 30px;
    font-weight: lighter;
    font-family: "Bangers";
-   color: $color5;
+   color: $color2;
  }
-
-
-
diff --git a/app/assets/stylesheets/blogs.scss b/app/assets/stylesheets/blogs.scss
@@ -1,11 +1,10 @@
-// Place all the styles related to the blogs controller here.
-// They will automatically be included in application.css.
-// You can use Sass (SCSS) here: http://sass-lang.com/
-$color1: #57002b; //rgba(87, 0, 43, 100)
-$color2: #e0e5e2; //rgba(224, 229, 226, 100)
-$color3: #c5c096; //rgba(197, 192, 150, 100)
-$color4: #896636; //rgba(137, 102, 54, 100)
-$color5: #517182; //rgba(81, 113, 130, 100)
+/* Coolors Exported Palette - coolors.co/27aad8-d3c82b-7cb826-ac1b26-16363d */
+
+$color1: #27aad8; //rgba(39, 170, 216, 100)
+$color2: #d3c82b; //rgba(211, 200, 43, 100)
+$color3: #4c8e2d; //rgba(124, 184, 38, 100)
+$color4: #ac1b26; //rgba(172, 27, 38, 100)
+$color5: #16363d; //rgba(22, 54, 61, 100)
 
 .dropdown {
   padding: 10px;
@@ -14,6 +13,7 @@ $color5: #517182; //rgba(81, 113, 130, 100)
 
   .dropdown-toggle {
     color: $color5;
+    background-color: $color1;
     font-family: "Bangers";
   }
 }
@@ -26,6 +26,10 @@ $color5: #517182; //rgba(81, 113, 130, 100)
     color: $color4;
     float: right;
     padding-top: 5px;
+
+    h3 {
+      color: $color4;
+    }
   }
 
   h2 {
@@ -38,13 +42,14 @@ $color5: #517182; //rgba(81, 113, 130, 100)
   p {
     font-size: 1.5em;
     padding-top: 5px;
+    color: $color5;
   }
 
   button {
-    background-color: $color2;
+    background-color: $color1;
     padding: 10px;
     a {
-      color: $color4;
+      color: $color5;
     }
   }
 

diff --git a/app/assets/stylesheets/navbar.scss b/app/assets/stylesheets/navbar.scss
@@ -0,0 +1,35 @@
+/* Coolors Exported Palette - coolors.co/27aad8-d3c82b-7cb826-ac1b26-16363d */
+
+$color1: #27aad8; //rgba(39, 170, 216, 100)
+$color2: #d3c82b; //rgba(211, 200, 43, 100)
+$color3: #4c8e2d; //rgba(124, 184, 38, 100)
+$color4: #ac1b26; //rgba(172, 27, 38, 100)
+$color5: #16363d; //rgba(22, 54, 61, 100)
+
+
+.navbar-inverse {
+  background-color: $color1;
+
+  button {
+    background-color: $color5;
+    color: $color1;
+  }
+}
+
+.navbar-brand {
+  a {
+    color: $color4;
+    font-family: "Bangers";
+    font-size: 2.5em;
+  }
+}
+
+#nav-text {
+  li {
+    a {
+      font-size: 1.5em;
+      color: $color5;
+    }
+  }
+
+}
diff --git a/app/assets/stylesheets/welcome.scss b/app/assets/stylesheets/welcome.scss
@@ -1,23 +1,16 @@
-// Place all the styles related to the welcome controller here.
-// They will automatically be included in application.css.
-// You can use Sass (SCSS) here: http://sass-lang.com/
+/* Coolors Exported Palette - coolors.co/27aad8-d3c82b-7cb826-ac1b26-16363d */
 
-$color1: #57002b; //rgba(87, 0, 43, 100)
-$color2: #e0e5e2; //rgba(224, 229, 226, 100)
-$color3: #c5c096; //rgba(197, 192, 150, 100)
-$color4: #896636; //rgba(137, 102, 54, 100)
-$color5: #517182; //rgba(81, 113, 130, 100)
+$color1: #27aad8; //rgba(39, 170, 216, 100)
+$color2: #d3c82b; //rgba(211, 200, 43, 100)
+$color3: #4c8e2d; //rgba(124, 184, 38, 100)
+$color4: #ac1b26; //rgba(172, 27, 38, 100)
+$color5: #16363d; //rgba(22, 54, 61, 100)
 
 html,
 body {
    height: 100%;
 }
 
-body {
-   padding-top: 50px;
-   background-color: $color3;
-}
-
 .img-portfolio {
    margin-bottom: 30px;
 }
@@ -58,6 +51,10 @@ header.carousel h1 {
     color: $color2;
   }
 
+  h4 {
+    color: white;
+  }
+
   img {
     height: 240px;
     width: 360px;
@@ -67,8 +64,8 @@ header.carousel h1 {
   .btn {
     font-weight: lighter;
     font-size: 2em;
-    color: $color1;
-    background-color: $color2;
+    color: $color5;
+    background-color: $color1;
 
     a {
       color: $color5;

diff --git a/app/views/layouts/_navbar.html.erb b/app/views/layouts/_navbar.html.erb
@@ -8,7 +8,7 @@
         <span class="icon-bar"></span>
         <span class="icon-bar"></span>
       </button>
-      <a class="navbar-brand" href="/">EZ Eats!</a>
+      <nav class="navbar-brand"><%= link_to "EZ Eats!", root_path %></nav>
     </div>
 
     <!-- Collect the nav links, forms, and other content for toggling -->

diff --git a/app/views/welcome/index.html.erb b/app/views/welcome/index.html.erb
@@ -48,7 +48,7 @@
   <div id="welcome-boxes" class="row">
 
     <div class="col-md-4">
-      <img src="https://images.unsplash.com/photo-1422207175003-e5b7d45ceb7b?q=80&fm=jpg&s=a853f4ada4f0804231f1324fe0727d14" alt="test" class="img-responsive pickgradient">
+      <img class="pickgradient" src="https://images.unsplash.com/photo-1422207175003-e5b7d45ceb7b?q=80&fm=jpg&s=a853f4ada4f0804231f1324fe0727d14" alt="test" class="img-responsive pickgradient">
       <div class="carousel-caption">
         <h1 class="btn btn-default btn-lg"><%= link_to "Blog", blogs_path %></h1>
         <h4>Highlights from EZ's Denver food adventures.</h4>
@@ -57,15 +57,15 @@
     </div>
 
   <div class="col-md-4">
-    <img src="https://images.unsplash.com/photo-1428515613728-6b4607e44363?q=80&fm=jpg&s=71a40856ab62d1ff1549d58b9b412b5b" alt="test" class="img-responsive pickgradient">
+    <img class="pickgradient" src="https://images.unsplash.com/photo-1428515613728-6b4607e44363?q=80&fm=jpg&s=71a40856ab62d1ff1549d58b9b412b5b" alt="test" class="img-responsive pickgradient">
     <div class="carousel-caption">
       <h1 class="btn btn-default btn-lg"><%= link_to "Reviews", reviews_path %></h1>
       <h4>The best...and worst... Denver restaurants for kids.</h4>
     </div>
   </div>
 
   <div class="col-md-4">
-    <img src="https://snap-photos.s3.amazonaws.com/img-thumbs/960w/GL0X7W9QLC.jpg" alt="test" class="img-responsive pickgradient">
+    <img class="pickgradient" src="https://snap-photos.s3.amazonaws.com/img-thumbs/960w/GL0X7W9QLC.jpg" alt="test" class="img-responsive pickgradient">
     <div class="carousel-caption">
       <h1 class="btn btn-default btn-lg"><%= link_to "Food Challenges", challenges_path %></h1>
       <h4>Test your limits with these monstrous meals.</h4>