From 564d71285e2952619e874868955588fd193fd88b Mon Sep 17 00:00:00 2001
From: Lorin Werthen <werthenlorin@gmail.com>
Date: Tue, 30 Aug 2016 22:48:58 +0200
Subject: [PATCH] degeneralize box

---
 .../assets/stylesheets/includes/tiles.scss    |  18 +--
 content/index.erb                             | 134 +++++++++---------
 2 files changed, 78 insertions(+), 74 deletions(-)

diff --git a/content/assets/stylesheets/includes/tiles.scss b/content/assets/stylesheets/includes/tiles.scss
index e65d302..4e95000 100644
--- a/content/assets/stylesheets/includes/tiles.scss
+++ b/content/assets/stylesheets/includes/tiles.scss
@@ -2,16 +2,18 @@ a.box {
   color: #000;
 }
 
-.box {
-  background-color: $box-colour;
+#homepage {
+  .box {
+    background-color: $box-colour;
 
-  &.highlighted {
-    background-color: $highlighted-box-colour;
-    color: $highlighted-text-colour;
+    &.highlighted {
+      background-color: $highlighted-box-colour;
+      color: $highlighted-text-colour;
 
-    .content {
-      h1 {
-        color: white;
+      .content {
+        h1 {
+          color: white;
+        }
       }
     }
   }
diff --git a/content/index.erb b/content/index.erb
index b1bea41..3b4d8c5 100644
--- a/content/index.erb
+++ b/content/index.erb
@@ -1,76 +1,78 @@
-<div class="tile is-vertical is-ancestor">
-  <div class="tile is-parent is-12">
-    <%= render '/partials/_tile.*', article: all_events[0] %>
-  </div>
-  <div class="tile">
-    <div class="tile is-parent is-4">
-      <%= render '/partials/_tile.*', article: all_events[1], htmlclass: "highlighted" %>
+<div id="homepage">
+  <div class="tile is-vertical is-ancestor">
+    <div class="tile is-parent is-12">
+      <%= render '/partials/_tile.*', article: all_events[0] %>
     </div>
-    <div class="tile is-parent is-4">
-      <div class="tile is-child box highlighted">
-        IDK LOL
+    <div class="tile">
+      <div class="tile is-parent is-4">
+        <%= render '/partials/_tile.*', article: all_events[1], htmlclass: "highlighted" %>
       </div>
-    </div>
-    <div class="tile is-vertical is-2">
-      <div class="tile is-parent">
-        <div class="tile is-child box has-text-centered">
-          <%= fa 'wikipedia-w' %>
+      <div class="tile is-parent is-4">
+        <div class="tile is-child box highlighted">
+          IDK LOL
         </div>
       </div>
-      <div class="tile is-parent">
-        <div class="tile is-child box has-text-centered">
-          <%= fa 'video-camera' %>
-        </div>
-      </div>
-    </div>
-    <div class="tile is-vertical is-2">
-      <div class="tile is-parent">
-        <div class="tile is-child box has-text-centered">
-          <%= fa 'github' %>
-        </div>
-      </div>
-      <div class="tile is-parent">
-        <div class="tile is-child box has-text-centered">
-          <%= fa 'facebook-official' %>
-        </div>
-      </div>
-    </div>
-  </div>
-  <div class="tile">
-    <div class="tile is-4 is-parent">
-      <div class="tile is-child box">
-        <div class="content">
-          <h1><%= sorted_articles.first[:title] %></h1>
-          <%= sorted_articles.first[:description] %>
-        </div>
-      </div>
-    </div>
-    <div class="tile is-vertical">
-      <div class="tile is-parent">
-        <div class="tile is-child box">
-          <p>
-            Numero uno: @werthen
-          </p>
-          <p>
-            Numero dos: @myncke
-          </p>
-          <p>
-            Numero tres: @iepoev
-          </p>
-          <p>
-            Numero quatro: @becousae
-          </p>
-        </div>
-      </div>
-      <div class="tile">
-        <div class="tile is-6 is-parent">
-          <div class="tile is-child box">
-            GITHUB
+      <div class="tile is-vertical is-2">
+        <div class="tile is-parent">
+          <div class="tile is-child box has-text-centered">
+            <%= fa 'wikipedia-w' %>
           </div>
         </div>
-        <div class="tile is-6 is-parent">
+        <div class="tile is-parent">
+          <div class="tile is-child box has-text-centered">
+            <%= fa 'video-camera' %>
+          </div>
+        </div>
+      </div>
+      <div class="tile is-vertical is-2">
+        <div class="tile is-parent">
+          <div class="tile is-child box has-text-centered">
+            <%= fa 'github' %>
+          </div>
+        </div>
+        <div class="tile is-parent">
+          <div class="tile is-child box has-text-centered">
+            <%= fa 'facebook-official' %>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div class="tile">
+      <div class="tile is-4 is-parent">
+        <div class="tile is-child box">
+          <div class="content">
+            <h1><%= sorted_articles.first[:title] %></h1>
+            <%= sorted_articles.first[:description] %>
+          </div>
+        </div>
+      </div>
+      <div class="tile is-vertical">
+        <div class="tile is-parent">
           <div class="tile is-child box">
-            GITHUB
+            <p>
+              Numero uno: @werthen
+            </p>
+            <p>
+              Numero dos: @myncke
+            </p>
+            <p>
+              Numero tres: @iepoev
+            </p>
+            <p>
+              Numero quatro: @becousae
+            </p>
+          </div>
+        </div>
+        <div class="tile">
+          <div class="tile is-6 is-parent">
+            <div class="tile is-child box">
+              GITHUB
+            </div>
+          </div>
+          <div class="tile is-6 is-parent">
+            <div class="tile is-child box">
+              GITHUB
+            </div>
           </div>
         </div>
       </div>