|
|
|
/**
|
|
|
|
* colors
|
|
|
|
*
|
|
|
|
*
|
|
|
|
* @author Björn Hase, me@herr-hase.wtf
|
|
|
|
* @license http://opensource.org/licenses/MIT The MIT License
|
|
|
|
* @link https://gitea.node001.net/tiny-components/plain-ui.git
|
|
|
|
*
|
|
|
|
*/
|
|
|
|
|
|
|
|
@each $name, $color in $colors {
|
|
|
|
$class: str-replace($name, '--', '');
|
|
|
|
|
|
|
|
.color-#{$class} {
|
|
|
|
color: var(#{$name});
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
@each $name, $color in $colors {
|
|
|
|
$class: str-replace($name, '--', '');
|
|
|
|
|
|
|
|
.fill-#{$class} {
|
|
|
|
fill: var(#{$name});
|
|
|
|
|
|
|
|
svg {
|
|
|
|
fill: var(#{$name});
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
// @TODO ?
|
|
|
|
@each $name, $color in $colors {
|
|
|
|
$class: str-replace($name, '--', '');
|
|
|
|
|
|
|
|
.fill-#{$class}-hover {
|
|
|
|
&:hover {
|
|
|
|
fill: var(#{$name});
|
|
|
|
|
|
|
|
svg {
|
|
|
|
fill: var(#{$name});
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
@each $name, $color in $colors {
|
|
|
|
$class: str-replace($name, '--', '');
|
|
|
|
|
|
|
|
.border-color-#{$class} {
|
|
|
|
border-color: var(#{$name});
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
@each $name, $color in $colors {
|
|
|
|
$class: str-replace($name, '--', '');
|
|
|
|
|
|
|
|
.background-color-#{$class} {
|
|
|
|
background-color: var(#{$name});
|
|
|
|
}
|
|
|
|
}
|