Reorganize variables.

avinashbot · Apr 17, 2017 · e3dc0da · e3dc0da
1 parent e6d6f0c
commit e3dc0da
Showing 7 changed files with 30 additions and 19 deletions.
diff --git a/theme/_variables.scss b/theme/_variables.scss
@@ -1,38 +1,49 @@
+// Whole-page Variables
 $page-top-margin: 20px;
 $page-background-color: #f6f6f6;
-$res-nightmode-color: #262626;
+$page-nightmode-color: #262626;
+$page-accent-color: purple; // #3D9970;
 
+// Shortcut Bar (Top of Header)
 $header-shortcuts-height: 18px;
 $header-shortcuts-opacity: 0.2;
+
+// User-Specific Links
+$userbar-height: 20px;
+
+// Focus's Large Header
 $header-background-color: #eeeeee;
 $header-background-url: url(%%header-background%%);
 $header-height: 200px;
 
+// Round Return-to-Reddit Button
+$snoo-default-color: $page-accent-color;
 $snoo-diameter: 50px;
 $snoo-gutter-size: 5px;
 $snoo-offset: 65px;
 $snoo-hover-size: 0.9;
 
+// Subreddit Logo
 $banner-image-url: url(%%banner%%);
 
+// Subreddit Links (Bottom of Header)
 $tab-menu-separator: "/";
 $tab-menu-text-color: #42668a;
 $tab-menu-separator-color: #cccccc;
 $tab-menu-height: 18px;
 
-$userbar-height: 20px;
-
+// Main Page Contents
 $content-width: 60%;
 $content-left-spacing: 10%;
 $content-right-spacing: 30%; // To make room for the sidebar.
 
-$accent-color: #3D9970;
-
+// Sidebar
 $sidebar-width: 300px;
 $sidebar-padding: 10px;
 $readers-word: "programmers";
 $users-online-word: "";
 
+// Page Footer
 $footer-background-color: #111111;
 $footer-title-color:      #777777;
 $footer-link-color:       #e4e4e4;

diff --git a/theme/flair.scss b/theme/flair.scss
@@ -15,13 +15,13 @@
   color: #ffffff;
   padding: 3px;
   border-radius: 3px;
-}
 
-.link:not(.linkflair) .flairselectbtn::after {
-  content: " (please add one!)"
+  &::after {
+    content: " (please add one!)"
+  }
 }
 
-@each $flair, $color in (red: #ff4136, green: $accent-color, blue: #0f64c8, orange: #ff851b) {
+@each $flair, $color in (red: #ff4136, green: #3D9970, blue: #0f64c8, orange: #ff851b) {
   .flair-#{"" + $flair} { background-color: $color; }
   .linkflair-#{"" + $flair} .linkflairlabel { background-color: $color; }
 }
diff --git a/theme/link.scss b/theme/link.scss
@@ -9,11 +9,11 @@ body.listing-page #siteTable {
   border-right: 2px solid transparent;
 
   &.RES-keyNav-activeThing {
-    border-right: 2px solid $accent-color;
+    border-right: 2px solid $page-accent-color;
   }
 
   body.res &:not(.RES-keyNav-activeThing):hover {
-    border-right: 2px solid transparentize($accent-color, 0.5);
+    border-right: 2px solid transparentize($page-accent-color, 0.5);
   }
 
   .rank {

diff --git a/theme/sidebar.scss b/theme/sidebar.scss
@@ -23,15 +23,15 @@
     border: 0;
     width: 100%;
     background-color: transparent;
-    border-bottom: 1px dashed $accent-color;
+    border-bottom: 1px dashed $page-accent-color;
 
     &:focus {
       outline: none;
     }
   }
 
   .linkinfo {
-    border: 1px dashed #5f99cf;
+    border: 1px dashed $page-accent-color;
     background-color: transparent;
   }
 

diff --git a/theme/snoo.scss b/theme/snoo.scss
@@ -10,8 +10,8 @@
   z-index: 50;
 
   .res-nightmode & {
-    border-color: $res-nightmode-color;
-    background-color: $res-nightmode-color;
+    border-color: $page-nightmode-color;
+    background-color: $page-nightmode-color;
   }
 
   &:hover {
@@ -25,7 +25,7 @@
     height: $snoo-diameter;
     text-indent: 0;
     background-image: none;
-    background-color: $accent-color;
+    background-color: $snoo-default-color;
     font-size: 0;
 
     &:hover {

diff --git a/theme/submit-button.scss b/theme/submit-button.scss
@@ -1,5 +1,5 @@
 .side .morelink {
-  border: 1px dashed $accent-color;
+  border: 1px dashed $page-accent-color;
   border-radius: 0;
   background-image: none;
   background-color: transparent;
@@ -15,7 +15,7 @@
   }
 
   a {
-    color: $accent-color;
+    color: $page-accent-color;
   }
 
   .nub {

diff --git a/theme/tab-menu.scss b/theme/tab-menu.scss
@@ -38,7 +38,7 @@
       }
 
       &:hover {
-        border-bottom: 2px solid #5f99cf;
+        border-bottom: 2px solid $tab-menu-text-color;
       }
     }