1.0.1 • Published 5 years ago
tailwindcss-border-styles v1.0.1
Tailwind CSS Border Styles Plugin
Requirements
- Tailwind CSS >= v1.0.0
Installation
Install via Yarn:
$ yarn add tailwindcss-border-styles
Usage
// tailwind.config.js
{
theme: {
borderStyles: {
styles: true, // defaults to false
colors: true, // defaults to false
}
}
plugins: [
require('tailwindcss-border-styles')(),
],
}
The following utilities are generated when styles
is set to true
:
.border-t-solid {
border-top-style: solid;
}
.border-t-dashed {
border-top-style: dashed;
}
.border-t-dotted {
border-top-style: dotted;
}
.border-t-double {
border-top-style: double;
}
.border-t-none {
border-top-style: none;
}
.border-r-solid {
border-right-style: solid;
}
.border-r-dashed {
border-right-style: dashed;
}
.border-r-dotted {
border-right-style: dotted;
}
.border-r-double {
border-right-style: double;
}
.border-r-none {
border-right-style: none;
}
.border-b-solid {
border-bottom-style: solid;
}
.border-b-dashed {
border-bottom-style: dashed;
}
.border-b-dotted {
border-bottom-style: dotted;
}
.border-b-double {
border-bottom-style: double;
}
.border-b-none {
border-bottom-style: none;
}
.border-l-solid {
border-left-style: solid;
}
.border-l-dashed {
border-left-style: dashed;
}
.border-l-dotted {
border-left-style: dotted;
}
.border-l-double {
border-left-style: double;
}
.border-l-none {
border-left-style: none;
}
The following utilities are generated when colors
is set to true
(based on your theme colors):
.border-t-white {
border-top-color: #fff;
}
.border-r-white {
border-right-color: #fff;
}
.border-b-white {
border-bottom-color: #fff;
}
.border-l-white {
border-left-color: #fff;
}
as well as the appropriate variants set on borderStyle
& borderColor
.
Testing
Tests are handled with Jest and can be ran using:
$ yarn run test
Bug Reports
If you discover a bug in Tailwind CSS Border Styles, please open an issue.
Contributing
Contributing whether it be through PRs, reporting an issue, or suggesting an idea is encouraged and appreciated.
License
Tailwind CSS Border Styles provided under the MIT License.