Front page, collections, about

assets/css/main.scss

@@ -30,6 +30,7 @@ body {
   -moz-osx-font-smoothing: grayscale;
 
   &.invert {
+      color: $white;
       background-color: $dark-gray;
   }
 }
@@ -52,6 +53,7 @@ hr {
     &::before {
         content: '§';
         display: block;
+        text-align: center;
     }
 
     &.fin::before {
@@ -59,6 +61,7 @@ hr {
         font-variant: small-caps;
         display: block;
         font-style: italic;
+        text-align: center;
     }
 }
 

assets/css/sass/parts/_pagination.scss

@@ -15,5 +15,13 @@
       opacity: .8;
       color: $dark-pink;
     }
+
+    .invert & {
+        color: $light-gray;
+
+        &:hover {
+            color: $light-pink;
+        }
+    }
   }
 }

assets/css/sass/parts/_post-card.scss

@@ -1,5 +1,5 @@
 .post-card-box {
-  margin: 100px 0 100px;
+  margin: 20px 0 20px;
   padding: 0;
 
   li {
@@ -8,6 +8,7 @@
     float: left;
     width: 50%;
     transition: all .3s;
+    padding: 0 10px 10px 0;
     &:hover {
       opacity: 0.9;
     }

assets/css/sass/parts/_tags.scss

@@ -1,5 +1,21 @@
 .blog-tags {
   margin: 100px 0 100px;
+  .invert & {
+      h1 {
+          color: $light-purple;
+      }
+      .tags li a {
+          color: $light-purple;
+      }
+      .tag-list {
+          span a {
+              color: $light-pink;
+          }
+          small {
+              color: $light-purple;
+          }
+      }
+  }
   h1 {
     text-align: center;
     font-family: 'Lato', sans-serif;

assets/css/sass/parts/post-page.scss

@@ -21,7 +21,7 @@
   margin-top: -5px;
   margin-bottom: 100px;
   background-color: $white;
-  padding: 20px;
+  padding: 20px 50px;
   box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.3);
 
   .invert & {

assets/img/flag.svg

@@ -0,0 +1,8 @@
+<svg width="500" height="300" viewbox="0 0 500 300"  xmlns="http://www.w3.org/2000/svg">
+    <!-- The blue symbolizes the sky -->
+    <path fill="blue" d="M 0,0 l 0,175 l 100,-50 l 0,50 l 100,-50 l 0,50 l 100,-50 l 0,50 l 100,-50 l 0,50 l 100,-50 l 0,50 l 0,-175 Z" />
+    <!-- The green symbolizes the earth as well as the fertility of the soil, which grows so many of Sawtooth's crops -->
+    <path fill="green" d="M 0,175 l 100,-50 l 0,50 l 100,-50 l 0,50 l 100,-50 l 0,50 l 100,-50 l 0,50 l 100,-50 l 0,50 l 0,175 l -500,0 Z" />
+    <!-- The yellow symbolizes both the sun rising over the Sawtooth range as well as the stone of the range itself -->
+    <path fill="yellow" d="M 0,150 l 100,-50 l 0,50 l 100,-50 l 0,50 l 100,-50 l 0,50 l 100,-50 l 0,50 l 100,-50 l 0,50 l -100,50 l 0,-50 l -100,50 l 0,-50 l -100,50 l 0,-50 l -100,50 l 0,-50 l -100,50 l 0,-50 Z" />
+</svg>