Created
July 30, 2015 13:08
-
-
Save richardhealy/754c8320eaa3b75a5247 to your computer and use it in GitHub Desktop.
LESS Variables for BaseKit stylesheet.less
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// Don't want to use metadata.json file to define | |
// variables? Then just add these variables to | |
// the top of your stylesheet.less and you're | |
// good to go!!! | |
// Colors | |
@color-swatch1:#ffffff; // Background | |
@color-swatch2:#3295e1; // Contrast color | |
@color-swatch3:#444444; // Button color | |
@color-swatch4:#333333; // Title colour | |
@color-swatch5:#333333; // Paragraph colour | |
@color-swatch6:#333333; // Nav text colour | |
@color-swatch7:#000000; // Header BG colour | |
// Site background variables | |
@siteBackgroundColor:transparent; | |
@siteBackgroundGradientType:vertical; | |
@siteBackgroundGradientFrom:transparent; | |
@siteBackgroundGradientTo:transparent; | |
@siteBackgroundImageScale:original; | |
@siteBackgroundImage:none; | |
@siteBackgroundPositionX:center; | |
@siteBackgroundPositionY:middle; | |
@siteBackgroundRepeat:no-repeat; | |
// Heading 1 | |
@font-swatch1-font-family:Helvetica, Arial, sans-serif; | |
@font-swatch1-font-size:28px; | |
@font-swatch1-font-weight:700; | |
@font-swatch1-line-height:inherit; | |
@font-swatch1-letter-spacing:inherit; | |
@font-swatch1-color:@color-swatch4; | |
// Heading 2 | |
@font-swatch2-font-family:Helvetica, Arial, sans-serif; | |
@font-swatch2-font-size:22px; | |
@font-swatch2-font-weight:700; | |
@font-swatch2-line-height:inherit; | |
@font-swatch2-color:@color-swatch4; | |
@font-swatch2-letter-spacing:inherit; | |
// Heading 3 | |
@font-swatch3-font-family:Helvetica, Arial, sans-serif; | |
@font-swatch3-font-size:20px; | |
@font-swatch3-font-weight:700; | |
@font-swatch3-line-height:inherit; | |
@font-swatch3-letter-spacing:inherit; | |
@font-swatch3-color:@color-swatch4; | |
// Heading 4 | |
@font-swatch4-font-family:Helvetica, Arial, sans-serif; | |
@font-swatch4-font-size:18px; | |
@font-swatch4-font-weight:700; | |
@font-swatch4-line-height:inherit; | |
@font-swatch4-letter-spacing:inherit; | |
@font-swatch4-color:@color-swatch4; | |
// Paragraph | |
@font-swatch5-font-family:Helvetica, Arial, sans-serif; | |
@font-swatch5-font-size:15px; | |
@font-swatch5-font-weight:inherit; | |
@font-swatch5-line-height:28px; | |
@font-swatch5-letter-spacing:inherit; | |
@font-swatch5-color:@color-swatch5; | |
// Navigation Text | |
@font-swatch6-font-family:Helvetica, Arial, sans-serif; | |
@font-swatch6-font-size:16px; | |
@font-swatch6-font-weight:inherit; | |
@font-swatch6-line-height:inherit; | |
@font-swatch6-letter-spacing:inherit; | |
@font-swatch6-color:@color-swatch6; | |
@font-swatch6-color-hover:@color-swatch7; | |
@font-swatch6-background-color:@color-swatch1; | |
@font-swatch6-background-color-hover:@color-swatch1; | |
// Buttons | |
@font-swatch7-font-family:Helvetica, Arial, sans-serif; | |
@font-swatch7-font-size:16px; | |
@font-swatch7-font-weight:inherit; | |
@font-swatch7-line-height:inherit; | |
@font-swatch7-letter-spacing:inherit; | |
@font-swatch7-color:@color-swatch1; | |
@font-swatch7-background-color:@color-swatch3; | |
@font-swatch7-background-color-hover:darken(@color-swatch3,10%); | |
// Feature Title | |
@font-swatch8-font-family:Helvetica, Arial, sans-serif; | |
@font-swatch8-font-size:34px; | |
@font-swatch8-font-weight:700; | |
@font-swatch8-line-height:inherit; | |
@font-swatch8-letter-spacing:inherit; | |
@font-swatch8-color:@color-swatch4; | |
// Feature Subtitle | |
@font-swatch9-font-family:Helvetica, Arial, sans-serif; | |
@font-swatch9-font-size:20px; | |
@font-swatch9-font-weight:inherit; | |
@font-swatch9-line-height:inherit; | |
@font-swatch9-letter-spacing:inherit; | |
@font-swatch9-color:@color-swatch5; | |
// Company Name | |
@font-swatch10-font-family:Helvetica, Arial, sans-serif; | |
@font-swatch10-font-size:28px; | |
@font-swatch10-font-weight:700; | |
@font-swatch10-line-height:inherit; | |
@font-swatch10-letter-spacing:inherit; | |
@font-swatch10-color:@color-swatch4; |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment