Implement Sass color palette

src/sass/nord.scss

@@ -0,0 +1,269 @@
+// 
+// ++++++++++++++++++++++++++++++++++++++++++++++++++++
+// title      Nord                                    +
+// project    nord                                    +
+// version                                            +
+// repository https://github.com/arcticicestudio/nord +
+// author     Arctic Ice Studio                       +
+// email      [email protected]         +
+// copyright  Copyright (C) 2016                      +
+// ++++++++++++++++++++++++++++++++++++++++++++++++++++
+// 
+// [References]
+// Sass
+//   (http://sass-lang.com)
+// SassDoc
+//   (http://sassdoc.com)
+
+////
+/// A arctic, north-bluish color palette.
+/// Created for the clean- and minimal design pattern to achieve a optimal focus and readability for code syntax
+/// highlighting and UI.  
+/// It consists of a total of sixteen, carefully selected, dimmed pastel colors for a eye-comfortable, but yet colorful
+/// ambiance.
+///
+/// @author Arctic Ice Studio <[email protected]>
+////
+
+/// Base component color of "Polar Night".
+///
+/// Used for texts, backgrounds, carets and structuring characters like curly- and square brackets.
+///
+/// @access public
+/// @example scss - SCSS
+///   /* For dark ambiance themes */
+///   .background {
+///     background-color: $nord0;
+///   }
+///   /* For light ambiance themes */
+///   .text {
+///     color: $nord0;
+///   }
+/// @group polarnight
+/// @since 0.1.0
+$nord0: #2E3440;
+
+/// Lighter shade color of the base component color.
+///
+/// Used as a lighter background color for UI elements like status bars.
+///
+/// @access public
+/// @group polarnight
+/// @see $nord0
+/// @since 0.1.0
+$nord1: #3B4252;
+
+/// Lighter shade color of the base component color.
+///
+/// Used as line highlighting in the editor.  
+/// In the UI scope it may be used as selection- and hightlight color.
+///
+/// @access public
+/// @example scss - SCSS
+///   /* Code Syntax Highlighting scope */
+///   .editor {
+///     &.line {
+///       background-color: $nord2;
+///     }
+///   }
+///
+///   /* UI scope */
+///   button {
+///     &:selected {
+///       background-color: $nord2;
+///     }
+///   }
+/// @group polarnight
+/// @see $nord0
+/// @since 0.1.0
+$nord2: #434C5E;
+
+/// Lighter shade color of the base component color.
+///
+/// Used for comments, invisibles, indent- and wrap guide marker.  
+/// In the UI scope it may be used as pseudeoclass color for disabled elements.
+///
+/// @access public
+/// @example scss - SCSS
+///   /* Code Syntax Highlighting scope */
+///   .editor {
+///     &.indent-guide,
+///     &.wrap-guide {
+///       &.marker {
+///         color: $nord3;
+///       }
+///     }
+///   }
+///   .comment,
+///   .invisible {
+///     color: $nord3;
+///   }
+///
+///   /* UI scope */
+///   button {
+///     &:disabled {
+///       background-color: $nord3;
+///     }
+///   }
+/// @group polarnight
+/// @see $nord0
+/// @since 0.1.0
+$nord3: #4C566A;
+
+/// Base component color of "Snow Storm".
+///
+/// Used for texts, carets and structuring characters like curly- and square brackets.  
+/// In the UI scope it may be used as semi-light background depending on the theme shading design.
+///
+///
+/// @access public
+/// @example scss - SCSS
+///   /* For light ambiance themes */
+///   .background {
+///     background-color: $nord4;
+///   }
+///   /* For dark ambiance themes */
+///   .text {
+///     color: $nord4;
+///   }
+/// @group snowstorm
+/// @since 0.1.0
+$nord4: #D8DEE9;
+
+/// Lighter shade color of the base component color.
+///
+/// Used as a lighter background color for UI elements like status bars.  
+/// It may also be used as semi-light background depending on the theme shading design.
+///
+/// @access public
+/// @group snowstorm
+/// @see $nord4
+/// @since 0.1.0
+$nord5: #E5E9F0;
+
+/// Lighter shade color of the base component color.
+///
+/// Usually be used as background depending on the theme shading design.  
+/// In the UI scope it may be used as selection- and hightlight color.
+///
+/// @access public
+/// @example scss - SCSS
+///   /* Code Syntax Highlighting scope */
+///   .editor {
+///     &.line {
+///       background-color: $nord2;
+///     }
+///   }
+///
+///   /* UI scope */
+///   button {
+///     &:selected {
+///       background-color: $nord2;
+///     }
+///   }
+/// @group snowstorm
+/// @see $nord4
+/// @since 0.1.0
+$nord6: #ECEFF4;
+
+/// Bluish core color.
+///
+/// Most commonly used for
+///   - classes/types
+///   - attributes
+///   - constants
+///
+/// @access public
+/// @group frost
+/// @since 0.1.0
+$nord7:  #8FBCBB;
+
+/// Bluish core color.
+///
+/// Represents the accent color of the color palette.  
+/// Can be used as main color for primary UI elements.  
+/// Optionally used for methods/functions instead of `$nord14`.
+///
+/// Also commonly used for
+///   - documentation/annotation tags
+///   - attribute values
+///   - Markup quotes
+///   - Markup link URLs
+///
+/// @access public
+/// @group frost
+/// @since 0.1.0
+$nord8:  #88C0D0;
+
+/// Bluish core color.
+///
+/// Most commonly used for
+///   - language-specific syntactic/reserved keywords
+///   - operators
+///   - tags
+///   - punctuations like colon/semicolon, comma and braces
+///
+/// Can optionally be used for units and language-specific reserved special support characters (`px`/`em`, `$`, `%`).
+///
+/// @access public
+/// @group frost
+/// @since 0.1.0
+$nord9:  #81A1C1;
+
+/// Bluish core color.
+///
+/// Most commonly used for
+///   - Markup doctypes
+///   - import/include/require statements
+///   - pre-processor statements
+///   - at-rules (`@`)
+///
+/// @access public
+/// @group frost
+/// @since 0.1.0
+$nord10: #5E81AC;
+
+/// Colorful component color.
+///
+/// Most commonly used for errors, git/diff deletion and linter marker.
+///
+/// @access public
+/// @group aurora
+/// @since 0.1.0
+$nord11: #BF616A;
+
+/// Colorful component color.
+///
+/// Most commonly used for annotations and regular expressions.
+///
+/// @access public
+/// @group aurora
+/// @since 0.1.0
+$nord12: #D08770;
+
+/// Colorful component color.
+///
+/// Most commonly used for escape characters, warnings, git/diff renamings and Markup entities.
+///
+/// @access public
+/// @group aurora
+/// @since 0.1.0
+$nord13: #EBCB8B;
+
+/// Colorful component color.
+///
+/// Most commonly used for methods/functions, git/diff additions and success visualizations.
+///
+/// @access public
+/// @group aurora
+/// @since 0.1.0
+$nord14: #A3BE8C;
+
+/// Colorful component color.
+///
+/// Most commonly used for numbers.
+///
+/// @access public
+/// @group aurora
+/// @since 0.1.0
+$nord15: #B48EAD;