Rename index to homepage so it's more unique

static/src/scss/homepage.scss

@@ -0,0 +1,24 @@
+.homepage-jumbotron {
+  @extend .valign-wrapper, .center-align;
+
+  justify-content: center;
+  flex-direction: column;
+
+  color: white;
+
+  @media #{$large-and-up} {
+    height: calc(70vh - #{$navbar-height});
+  }
+
+  @media #{$medium-and-down} {
+    height: calc(100vh - #{$navbar-height});
+  }
+}
+
+.homepage-recent-content {
+  h2 {
+    @extend .center-align;
+
+    margin-bottom: $element-bottom-margin * 2;
+  }
+}

static/src/scss/index.scss

@@ -1,6 +1,6 @@
 @import "materialize-css/sass/materialize";
 
-$navbar-height: 50px;
+@import "homepage";
 
 body {
   display: flex;
@@ -15,28 +15,3 @@ main {
 footer.page-footer {
   padding-top: 0;
 }
-
-.index-jumbotron {
-  @extend .valign-wrapper, .center-align;
-
-  justify-content: center;
-  flex-direction: column;
-
-  color: white;
-
-  @media #{$large-and-up} {
-    height: calc(70vh - #{$navbar-height});
-  }
-
-  @media #{$medium-and-down} {
-    height: calc(100vh - #{$navbar-height});
-  }
-}
-
-.index-recent-content {
-  h2 {
-    @extend .center-align;
-
-    margin-bottom: $element-bottom-margin * 2;
-  }
-}

templates/homepage.html

@@ -6,7 +6,7 @@
 {% block title %}Homepage{% endblock %}
 
 {% block main %}
-  <div class="index-jumbotron parallax-container">
+  <div class="homepage-jumbotron parallax-container">
     <div class="parallax">
       <img src="{% static 'img/header.jpg' %}" />
     </div>
@@ -15,7 +15,7 @@
     <p class="flow-text">Part Developer. Part SysAdmin. Part InfoSec. All Nerd!</p>
   </div>
 
-  <div class="container index-recent-content">
+  <div class="container homepage-recent-content">
     <h2>Recent Content</h2>
 
     {% include "card-list-item.html" %}

website/common/views.py

@@ -2,4 +2,4 @@ from django.views.generic import TemplateView
 
 
 class HomepageView(TemplateView):
-    template_name = "index.html"
+    template_name = "homepage.html"