Menu, styling

assets/css/main.scss

@@ -30,7 +30,7 @@ body {
   -moz-osx-font-smoothing: grayscale;
 
   &.invert {
-      background-color: $light-gray;
+      background-color: $dark-gray;
   }
 }
 
@@ -69,6 +69,10 @@ img {
 
 a {
   color: $dark-pink;
+
+  .invert & {
+    color: $light-pink;
+  }
 }
 
 blockquote {
@@ -130,11 +134,19 @@ pre {
 ::-moz-selection {
   background: rgba(49, 30, 62, 0.7);
   color: #ffffff;
+
+  .invert & {
+    background: rgba(149, 130, 162, 0.7);
+  }
 }
 
 ::selection {
   background: rgba(49, 30, 62, 0.7);
   color: #ffffff;
+
+  .invert & {
+    background: rgba(149, 130, 162, 0.7);
+  }
 }
 
 .clearfix::before, .clearfix::after {

assets/css/sass/_variables.scss

@@ -4,6 +4,7 @@ $blue: #2d89ec;
 $dark-purple: #311e3e;
 $light-purple: lighten($dark-purple, 60%);
 $dark-pink: #87314e;
+$light-pink: lighten($dark-pink, 40%);
 $gray: #efefef;
 $light-gray: #999999;
 $lighten-gray: #d9d9d9;

assets/css/sass/parts/_header.scss

@@ -33,14 +33,17 @@
   padding: 25px 30px;
   transform: translate3d(-300px, 0, 0);
   ul {
+    background-color: $white;
     padding: 15px 0 0;
-    margin: 0;
+    margin: 0 -30px 0 -30px;
     list-style: none;
 
     li {
       border-bottom: 1px solid $lighten-gray;
+      background-color: $white;
       a {
         display: block;
+        margin: 0 30px;
         padding: 15px 0;
         text-decoration: none;
         text-transform: uppercase;

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

@@ -88,6 +88,8 @@
     }
   }
   .page-share {
+    margin: 0 auto;
+    text-align: center;
     a {
       text-decoration: none;
       color: $light-gray;