wrapper/tailwindcss
1
0
Fork 0
Code Issues Pull requests Projects Releases 1 Packages Wiki Activity Actions

Define all border colors at once

Browse source
This commit is contained in:
Adam Wathan 2017-08-03 22:00:55 -04:00
parent 9e2f8186b6
commit e74d29f34e
2 changed files with 16 additions and 18 deletions
Download patch file Download diff file Expand all files Collapse all files

14
src/generators/border-colors.less
View file

@ -1,16 +1,16 @@
.define-border-color(@color-name; @variants) {
.generate-utility-variants(~"border-@{color-name}"; @variants; {
.define-border-colors(@variants) {
.generate-utility-variants('border'; @variants; {
border-color: extract(@__variant-value, 2);
});
}
.define-border-color(@color-name; @variants; none) {
.define-border-color(@color-name; @variants);
.define-border-colors(@variants; none) {
.define-border-colors(@variants);
}
.define-border-color(@color-name; @variants; @screens) when not (@screens = none) {
.define-border-color(@color-name; @variants);
.generate-responsive-utility-variants(~"border-@{color-name}"; @variants; @screens; {
.define-border-colors(@variants; @screens) when not (@screens = none) {
.define-border-colors(@variants);
.generate-responsive-utility-variants('border'; @variants; @screens; {
border-color: extract(@__variant-value, 2);
});
}

20
src/utilities/borders.less
View file

@ -54,18 +54,16 @@
.border-r-0 { border-right-style: none; }
// Colors
@border-dark-scale:
default @border-dark,
'soft' @border-dark-soft,
'softer' @border-dark-softer;
@border-colors:
'dark' @border-dark,
'dark-soft' @border-dark-soft,
'dark-softer' @border-dark-softer,
@border-light-scale:
default @border-light,
'soft' @border-light-soft,
'softer' @border-light-softer;
.define-border-color('dark'; @border-dark-scale; @screens);
.define-border-color('light'; @border-light-scale; @screens);
'light' @border-light,
'light-soft' @border-light-soft,
'light-softer' @border-light-softer,
;
.define-border-colors(@border-colors; @screens);
// Radius
.rounded-sm { border-radius: @border-radius-1; }