solar-flair 0.1.10 → 0.2.0

data/_sass/solar-flair/_links.scss

@@ -1,81 +1,89 @@
+a.quote{
+  color: $color-one;
+  &:hover{
+    color: darken($color-one, 25%);
+    text-decoration: underline;
+  }  
+}
 
-// Sitewide Links
 
-.blue * > a{
-  color: $blue-color;
+.one * > a{
+  color: $color-one;
   &:hover{
-    color: darken($blue-color, 15%);
+    color: darken($color-one, 15%);
     text-decoration: none;
   }  
 }
-.green * > a{
-  color: $green-color;
+.two * > a{
+  color: $color-two;
   &:hover{
-    color: darken($green-color, 15%);
+    color: darken($color-two, 15%);
     text-decoration: none;
   }  
 }
-.orange * > a{
-  color: $orange-color;
+.three * > a{
+  color: $color-three;
   &:hover{
-    color: darken($orange-color, 15%);
+    color: darken($color-three, 15%);
     text-decoration: none;
   }  
 }
-.purple * > a{
-  color: $purple-color;
+.four * > a{
+  color: $color-four;
   &:hover{
-    color: darken($purple-color, 15%);
+    color: darken($color-four, 15%);
     text-decoration: none;
   }  
 }
 .grey * > a{
-  color: darken($grey-color, 10%);
+  color: darken($color-grey, 10%);
   &:hover{
-    color: darken($grey-color, 25%);
+    color: darken($color-grey, 25%);
     text-decoration: none;
   }  
 }
 
 // Explicit Links
-a.blue{
-  color: $blue-color;
+
+
+a.one{
+  color: $color-one;
   &:hover{
-    color: darken($blue-color, 15%);
+    color: darken($color-one, 15%);
     text-decoration: none;
   }  
 }
-a.green{
-  color: $green-color;
+a.two{
+  color: $color-two;
   &:hover{
-    color: darken($green-color, 15%);
+    color: darken($color-two, 15%);
     text-decoration: none;
   }  
 }
-a.orange{
-  color: $orange-color;
+a.three{
+  color: $color-three;
   &:hover{
-    color: darken($orange-color, 15%);
+    color: darken($color-three, 15%);
     text-decoration: none;
   }  
 }
-a.purple{
-  color: $purple-color;
+a.four{
+  color: $color-four;
   &:hover{
-    color: darken($purple-color, 15%);
+    color: darken($color-four, 15%);
     text-decoration: none;
   }  
 }
 a.grey{
-  color: $grey-color;
+  color: $color-grey;
   &:hover{
-    color: darken($grey-color, 15%);
+    color: darken($color-grey, 15%);
     text-decoration: none;
   }  
 }
 
 
-
+// Button Modifiers
 .btn-primary{
   background:$blue-color;
   background:

data/_sass/solar-flair/_typeography.scss

@@ -1,115 +1,241 @@
 span.grey{
-  color:$grey-color;
+  color:$color-grey;
 }
 
-.text-blue{
-  color: $blue-color;
-}
-.text-green{
-  color: $green-color;
-}
-.text-orange{
-  color: $orange-color;
-}
-.text-purple{
-  color: $purple-color;
+
+
+.text-one{
+  color: $color-one;
+  code.output:before{
+    content: "#{$color-one}";
+  }
+}
+.text-two{
+  color: $color-two;
+  code.output:before{
+    content: "#{$color-two}";
+  }
+}
+.text-three{
+  color: $color-three;
+  code.output:before{
+    content: "#{$color-three}";
+  }
+}
+.text-four{
+  color: $color-four;
+  code.output:before{
+    content: "#{$color-four}";
+  }
 }
 .text-grey{
-  color: $grey-color;
+  color: $color-grey;
+  code.output:before{
+    content: "#{$color-grey}";
+  }
 }
 
-.text-d10-blue{
-  color: darken($blue-color, 10%);
-}
-.text-d10-green{
-  color: darken($green-color, 10%);
-}
-.text-d10-orange{
-  color: darken($orange-color, 10%);
-}
-.text-d10-purple{
-  color: darken($purple-color, 10%);
+.text-d10-one{
+  color: darken($color-one, 10%);
+  code.output:before{
+    content: "#{darken($color-one, 10%) }";
+  }
+}
+.text-d10-two{
+  color: darken($color-two, 10%);
+  code.output:before{
+    content: "#{darken($color-two, 10%) }";
+  }
+}
+.text-d10-three{
+  color: darken($color-three, 10%);
+  code.output:before{
+    content: "#{darken($color-three, 10%) }";
+  }
+}
+.text-d10-four{
+  color: darken($color-four, 10%);
+  code.output:before{
+    content: "#{darken($color-four, 10%) }";
+  }
 }
 .text-d10-grey{
-  color: darken($grey-color, 10%);
+  color: darken($color-grey, 10%);
+  code.output:before{
+    content: "#{darken($color-grey, 10%) }";
+  }
 }
 
-.text-d20-blue{
-  color: darken($blue-color, 20%);
-}
-.text-d20-green{
-  color: darken($green-color, 20%);
-}
-.text-d20-orange{
-  color: darken($orange-color, 20%);
-}
-.text-d20-purple{
-  color: darken($purple-color, 20%);
+
+
+
+
+.text-d20-one{
+  color: darken($color-one, 20%);
+  code.output:before{
+    content: "#{darken($color-one, 20%) }";
+  }
+}
+.text-d20-two{
+  color: darken($color-two, 20%);
+  code.output:before{
+    content: "#{darken($color-two, 20%) }";
+  }
+}
+.text-d20-three{
+  color: darken($color-three, 20%);
+  code.output:before{
+    content: "#{darken($color-three, 20%) }";
+  }
+}
+.text-d20-four{
+  color: darken($color-four, 20%);
+  code.output:before{
+    content: "#{darken($color-four, 20%) }";
+  }
 }
 .text-d20-grey{
-  color: darken($grey-color, 20%);
+  color: darken($color-grey, 20%);
+  code.output:before{
+    content: "#{darken($color-grey, 20%) }";
+  }
 }
 
-.text-d30-blue{
-  color: darken($blue-color, 30%);
-}
-.text-d30-green{
-  color: darken($green-color, 30%);
-}
-.text-d30-orange{
-  color: darken($orange-color, 30%);
-}
-.text-d30-purple{
-  color: darken($purple-color, 30%);
+
+
+
+.text-d30-one{
+  color: darken($color-one, 30%);
+  code.output:before{
+    content: "#{darken($color-one, 30%) }";
+  }
+}
+.text-d30-two{
+  color: darken($color-two, 30%);
+  code.output:before{
+    content: "#{darken($color-two, 30%) }";
+  }
+}
+.text-d30-three{
+  color: darken($color-three, 30%);
+  code.output:before{
+    content: "#{darken($color-three, 30%) }";
+  }
+}
+.text-d30-four{
+  color: darken($color-four, 30%);
+  code.output:before{
+    content: "#{darken($color-four, 30%) }";
+  }
 }
 .text-d30-grey{
-  color: darken($grey-color, 30%);
+  color: darken($color-grey, 30%);
+  code.output:before{
+    content: "#{darken($color-grey, 30%) }";
+  }
 }
 
-.text-l10-blue{
-  color: lighten($blue-color, 10%);
-}
-.text-l10-green{
-  color: lighten($green-color, 10%);
-}
-.text-l10-orange{
-  color: lighten($orange-color, 10%);
-}
-.text-l10-purple{
-  color: lighten($purple-color, 10%);
+
+
+
+
+.text-l10-one{
+  color: lighten($color-one, 10%);
+  code.output:before{
+    content: "#{lighten($color-one, 10%) }";
+  }
+}
+.text-l10-two{
+  color: lighten($color-two, 10%);
+  code.output:before{
+    content: "#{lighten($color-two, 10%) }";
+  }
+}
+.text-l10-three{
+  color: lighten($color-three, 10%);
+  code.output:before{
+    content: "#{lighten($color-three, 10%) }";
+  }
+}
+.text-l10-four{
+  color: lighten($color-four, 10%);
+  code.output:before{
+    content: "#{lighten($color-four, 10%) }";
+  }
 }
 .text-l10-grey{
-  color: lighten($grey-color, 10%);
+  color: lighten($color-grey, 10%);
+  code.output:before{
+    content: "#{lighten($color-grey, 10%) }";
+  }
 }
 
-.text-l20-blue{
-  color: lighten($blue-color, 20%);
-}
-.text-l20-green{
-  color: lighten($green-color, 20%);
-}
-.text-l20-orange{
-  color: lighten($orange-color, 20%);
-}
-.text-l20-purple{
-  color: lighten($purple-color, 20%);
+
+
+
+
+.text-l20-one{
+  color: lighten($color-one, 20%);
+  code.output:before{
+    content: "#{lighten($color-one, 20%) }";
+  }
+}
+.text-l20-two{
+  color: lighten($color-two, 20%);
+  code.output:before{
+    content: "#{lighten($color-two, 20%) }";
+  }
+}
+.text-l20-three{
+  color: lighten($color-three, 20%);
+  code.output:before{
+    content: "#{lighten($color-three, 20%) }";
+  }
+}
+.text-l20-four{
+  color: lighten($color-four, 20%);
+  code.output:before{
+    content: "#{lighten($color-four, 20%) }";
+  }
 }
 .text-l20-grey{
-  color: lighten($grey-color, 20%);
+  color: lighten($color-grey, 20%);
+  code.output:before{
+    content: "#{lighten($color-grey, 20%) }";
+  }
 }
 
-.text-l30-blue{
-  color: lighten($blue-color, 30%);
-}
-.text-l30-green{
-  color: lighten($green-color, 30%);
-}
-.text-l30-orange{
-  color: lighten($orange-color, 30%);
-}
-.text-l30-purple{
-  color: lighten($purple-color, 30%);
+
+
+
+.text-l30-one{
+  color: lighten($color-one, 30%);
+  code.output:before{
+    content: "#{lighten($color-one, 30%) }";
+  }
+}
+.text-l30-two{
+  color: lighten($color-two, 30%);
+  code.output:before{
+    content: "#{lighten($color-two, 30%) }";
+  }
+}
+.text-l30-three{
+  color: lighten($color-three, 30%);
+  code.output:before{
+    content: "#{lighten($color-three, 30%) }";
+  }
+}
+.text-l30-four{
+  color: lighten($color-four, 30%);
+  code.output:before{
+    content: "#{lighten($color-four, 30%) }";
+  }
 }
 .text-l30-grey{
-  color: lighten($grey-color, 30%);
+  color: lighten($color-grey, 30%);
+  code.output:before{
+    content: "#{lighten($color-grey, 30%) }";
+  }
 }
+

data/assets/main.scss

@@ -2,5 +2,35 @@
 
 ---
 
+// Solar Innovations' Colors
+// $color-one:      #000 !default;
+// $color-two:      #F47B28 !default;
+// $color-three:    #14A1AF !default;
+// $color-four:     #9E1D58 !default;
+// $color-grey:     #828282 !default;
+
+
+{% if site.data.theme['one'] %}
+    $color-one:     {{ site.data.theme['one'].color }};
+{% endif %}
+
+{% if site.data.theme['two'] %}
+    $color-two:     {{ site.data.theme['two'].color }};
+{% endif %}
+
+{% if site.data.theme['three'] %}
+    $color-three:   {{ site.data.theme['three'].color }};
+{% endif %}
+
+{% if site.data.theme['four'] %}
+    $color-four:    {{ site.data.theme['four'].color }};
+{% endif %}
+
+{% if site.data.theme['grey'] %}
+    $color-grey:    {{ site.data.theme['grey'].color }};
+{% endif %}
+
+
 @import 'solar-flair';
 
+