refactor(variables): change variable names to dashed instead of camel…

… case and prefix them BREAKING CHANGE: All sass variable names has changed. See variables.scss for new names.
w11k · Aug 27, 2014 · 45c6444 · 45c6444
1 parent b899c78
commit 45c6444
Show file tree

Hide file tree

Showing 5 changed files with 41 additions and 39 deletions.
diff --git a/src/prettyprint/_prettyprint.scss b/src/prettyprint/_prettyprint.scss
@@ -27,7 +27,7 @@
 
     padding: 0;
     background-color: #fff;
-    border: 0.1em solid darken($lineColor, 5%);
+    border: 0.1em solid darken($w11k-prettyprint-line-color, 5%);
     border-radius: 0.2em;
 
     &.linenums ol.linenums {
@@ -50,9 +50,9 @@
           padding: .2em $codePadding;
           margin: 0;
           margin-left: $lineNumWidth;
-          background-color: $lineColor;
+          background-color: $w11k-prettyprint-line-color;
           border-radius: 0;
-          border-left: 0.1em solid darken($lineColor, 5%);
+          border-left: 0.1em solid darken($w11k-prettyprint-line-color, 5%);
           min-height: 1.4em;
         }
 
@@ -63,20 +63,20 @@
           left: $lineNumWidth * -1;
           width: 1.5em;
           text-align: right;
-          color: darken($lineColor, 5%);
+          color: darken($w11k-prettyprint-line-color, 5%);
           margin: 0;
         }
 
         &:nth-child(even) {
-          background-color: darken($lineColor, 5%);
+          background-color: $w11k-prettyprint-line-color-alternate;
         }
 
         &:hover, &:nth-child(even):hover  {
-          background-color: darken($lineColor, 20%);
+          background-color: $w11k-prettyprint-line-color-highlight;
         }
 
         &:hover:before, &:nth-child(even):hover:before  {
-          color: darken($lineColor, 30%);
+          color: $w11k-prettyprint-line-color-highlight;
         }
       }
 

diff --git a/src/slides/_basic.scss b/src/slides/_basic.scss
@@ -11,8 +11,8 @@ html, body {
 
   .header {
     position: relative;
-    background: $headerBackground;
-    border-bottom: 0.2em solid $headerBorderColor;
+    background: $w11k-slides-slide-regular-header-background;
+    border-bottom: 0.2em solid $w11k-slides-slide-regular-header-border-color;
     padding: 0.25em 0;
     margin-bottom: 1em;
     margin-left: -1.5em;
@@ -26,7 +26,7 @@ html, body {
   }
 
   h1 {
-    color: $titleTopTextColor;
+    color: $w11k-slides-title-top-text-color;
     font-size: 2.5em;
     position: relative;
     top: auto;
@@ -39,7 +39,7 @@ html, body {
   }
 
   h2 {
-    color: $headerTextColor;
+    color: $w11k-slides-slide-regular-header-text-color;
     font-size: 2em;
     padding: 0;
     margin: 0;
@@ -59,7 +59,7 @@ html, body {
     width: 1.5em;
     height: 1.2em;
     content: " ";
-    background-image: $headerLogo;
+    background-image: $w11k-slides-slide-regular-header-logo;
     background-repeat: no-repeat;
     background-position: 100% 50%;
     background-size: 1.1em;
@@ -71,7 +71,7 @@ html, body {
   }
 
   h3 {
-    color: $primaryColor;
+    color: $w11k-slides-color-1;
     font-size: 1.3em;
   }
 
@@ -88,7 +88,7 @@ html, body {
 
   code {
     color: #888;
-    background-color: $lineColor;
+    background-color: $w11k-prettyprint-line-color;
   }
 
   blockquote {
@@ -97,7 +97,7 @@ html, body {
     padding: 0.5em;
     padding-left: 1em;
     color: #000;
-    border-left: 5px solid $blockquoteBorderColor;
+    border-left: 5px solid $w11k-slides-blockquote-border-color;
 
     p {
       font-size: inherit;
@@ -112,7 +112,7 @@ html, body {
     font-size: .5em;
     font-style: normal;
     font-weight: bold;
-    color: $blockquoteCizeTextColor;
+    color: $w11k-slides-blockquote-cize-text-color;
   }
 
   ::-moz-selection {
@@ -124,7 +124,7 @@ html, body {
     color: #fff;
   }
   a, a:hover, a:focus, a:active, a:visited {
-    color: $secondaryColor;
+    color: $w11k-slides-color-2;
     text-decoration: none;
   }
   a:hover, a:focus {

diff --git a/src/slides/_screen.scss b/src/slides/_screen.scss
@@ -37,22 +37,22 @@
 
         li:before {
           content: "▸";
-          color: $primaryColor;
+          color: $w11k-slides-color-1;
           margin-right: 0.5em;
           margin-left: -1em;
         }
       }
 
       ul, ol {
         li {
-          color: $secondaryColor;
+          color: $w11k-slides-color-2;
           margin-bottom: 0.3em;
         }
       }
 
       li ul li:before {
         content: "▪";
-        color: $secondaryColor;
+        color: $w11k-slides-color-2;
       }
     }
   }

diff --git a/src/slides/_types.scss b/src/slides/_types.scss
@@ -6,8 +6,8 @@
     position: relative;
     height: 38.2%;
     text-align: center;
-    color: $titleTopTextColor;
-    background-color: $titleTopBackgroundColor;
+    color: $w11k-slides-title-top-text-color;
+    background-color: $w11k-slides-title-top-background-color;
     padding: 0 2em;
 
     .content {
@@ -21,8 +21,8 @@
   .bottom {
     position: relative;
     height: 61.8%;
-    border-top: 0.3em solid $titleSeparatorColor;
-    background-color: $titleBottomBackgroundColor;
+    border-top: 0.3em solid $w11k-slides-title-separator-color;
+    background-color: $w11k-slides-title-bottom-background-color;
     padding: 0 2em;
 
     .content {
@@ -53,7 +53,7 @@
 
       h2 {
         text-align: center;
-        color: $primaryColor;
+        color: $w11k-slides-color-1;
         text-transform: uppercase;
       }
 

diff --git a/src/slides/_variables.scss b/src/slides/_variables.scss
@@ -1,20 +1,22 @@
 $w11k_red: #9a0510;
 
-$primaryColor: $w11k_red !default;
-$secondaryColor: #111 !default;
+$w11k-slides-color-1: $w11k_red !default;
+$w11k-slides-color-2: #111 !default;
 
-$titleTopTextColor: $primaryColor !default;
-$titleTopBackgroundColor: transparent !default;
-$titleSeparatorColor: transparent !default;
-$titleBottomTextColor: $secondaryColor !default;
-$titleBottomBackgroundColor: transparent !default;
+$w11k-slides-title-top-text-color: $w11k-slides-color-1 !default;
+$w11k-slides-title-top-background-color: transparent !default;
+$w11k-slides-title-separator-color: transparent !default;
+$w11k-slides-title-bottom-text-color: $w11k-slides-color-2 !default;
+$w11k-slides-title-bottom-background-color: transparent !default;
 
-$headerBackground: $primaryColor !default;
-$headerTextColor: white !default;
-$headerBorderColor: $secondaryColor !default;
-$headerLogo: none !default;
+$w11k-slides-slide-regular-header-background: $w11k-slides-color-1 !default;
+$w11k-slides-slide-regular-header-text-color: white !default;
+$w11k-slides-slide-regular-header-border-color: $w11k-slides-color-2 !default;
+$w11k-slides-slide-regular-header-logo: none !default;
 
-$blockquoteBorderColor: #999 !default;
-$blockquoteCizeTextColor: #999 !default;
+$w11k-slides-blockquote-border-color: #999 !default;
+$w11k-slides-blockquote-cize-text-color: #999 !default;
 
-$lineColor: #EAEAEA !default;
+$w11k-prettyprint-line-color: #EAEAEA !default;
+$w11k-prettyprint-line-color-alternate: darken($w11k-prettyprint-line-color, 5%) !default;
+$w11k-prettyprint-line-color-highlight: darken($w11k-prettyprint-line-color, 20%) !default;