@avalanche/setting-colors
v4.0.0-alpha.5
Published
Colors
Downloads
29
Readme
@avalanche/setting-colors
Colors.
- [Documentation](https://avalanche.oberlehner.net/documentation/#setting: colors)
Install
npm install @avalanche/setting-colors --save-dev
Basic usage
// Import the main file.
@import 'node_modules/@avalanche/setting-colors/scss/index.scss';
// Import just the settings file.
@import 'node_modules/@avalanche/setting-colors/scss/settings';
Usage with node-sass-magic-importer
Using node-sass (or a plugin for Grunt, gulp or webpack which is using node-sass) in combination with the node-sass-magic-importer custom importer, can make importing CSS dependencies from node_modules
a much nicer experience.
// Import the main file.
@import '~@avalanche/setting-colors';
Usage
// Function.
.selector {
color: setting-color(a);
}
// Map.
.selector {
color: map-get($colors, a);
}
Settings
/// Default colors.
/// @type Map
$colors: (
a: #2196f3,
b: #2364aa,
c: #73bfb8,
d: #fec601,
e: #ea7317,
) !default;
/// Contrast colors.
/// @type Map
$colors-contrast: (
a: #fff,
b: #fff,
c: #fff,
d: #fff,
e: #fff,
) !default;
/// Alert colors.
/// @type Map
$colors-alert: (
positive: #468847,
neutral: #3a87ad,
cautious: #c09853,
negative: #b94a48,
) !default;
/// Gray colors.
/// @type Map
$colors-gray: (
a: #f5f5f5,
b: #e0e0e0,
c: #9e9e9e,
) !default;
About
Author
Markus Oberlehner
Website: https://markus.oberlehner.net
Twitter: https://twitter.com/MaOberlehner
PayPal.me: https://paypal.me/maoberlehner
License
MIT