-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.js
47 lines (41 loc) · 1.63 KB
/
index.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
const plugin = require("tailwindcss/plugin");
const _ = require("lodash");
module.exports = plugin(function({ theme, addUtilities, variants }) {
let newUtilities;
newUtilities = {
".outline": { outlineWidth: "1px" },
".outline-2": { outlineWidth: "2px" },
".outline-4": { outlineWidth: "4px" },
".outline-8": { outlineWidth: "8px" },
};
addUtilities(newUtilities, variants("outlineWidth", ["responsive"]));
newUtilities = {
".outline-solid": { outlineStyle: "solid" },
".outline-dashed": { outlineStyle: "dashed" },
".outline-dotted": { outlineStyle: "dotted" },
".outline-double": { outlineStyle: "double" },
};
addUtilities(newUtilities, variants("outlineStyle", ["responsive"]));
newUtilities = {
".outline-offset-1": { outlineOffset: "2px" },
".outline-offset-2": { outlineOffset: "4px" },
".outline-offset-3": { outlineOffset: "8px" },
".outline-offset-4": { outlineOffset: "12px" },
".-outline-offset-1": { outlineOffset: "-2px" },
".-outline-offset-2": { outlineOffset: "-4px" },
".-outline-offset-3": { outlineOffset: "-8px" },
".-outline-offset-4": { outlineOffset: "-12px" },
};
addUtilities(newUtilities, variants("outlineOffset", ["responsive"]));
newUtilities = {
".outline-black": { outlineColor: theme("colors.black") },
".outline-white": { outlineColor: theme("colors.white") },
};
const colors = _.omit(theme("colors"), ["transparent", "current", "black", "white"]);
_.map(colors, (values, name) => {
_.map(values, (value, modifier) => {
newUtilities[`.outline-${name}-${modifier}`] = { outlineColor: value };
});
});
addUtilities(newUtilities, variants("outlineColor", ["responsive"]));
});