1
1
# tailwindcss-textShadow
2
- A Utility Plugins for controlling Text Shadow of an element.
2
+ A Utility Plugins for controlling Text Shadow of an text element.
3
3
4
4
5
5
6
6
| Class | Properties |
7
7
| ----------| -------------|
8
- | ` .text-shadow ` | ` text-shadow: 1px 0px 0px rgb(0 0 0 / 20%), 0px 1px 0px rgb(1 0 5 / 10%); ` |
8
+ | ` .text-shadow ` | ` text-shadow: 0px 0px 1px rgb(0 0 0 / 20%), 0px 0px 1px rgb(1 0 5 / 10%); ` |
9
9
| ` .text-shadow-sm ` | ` text-shadow: 1px 1px 3px rgb(36 37 47 / 25%); ` |
10
10
| ` .text-shadow-md ` | ` text-shadow: 0px 1px 2px rgb(30 29 39 / 19%), 1px 2px 4px rgb(54 64 147 / 18%) ` |
11
11
| ` .text-shadow-lg ` | ` text-shadow: 3px 3px 6px rgb(0 0 0 / 26%), 0 0 5px rgb(15 3 86 / 22%) ` |
@@ -90,10 +90,10 @@ If a `default` text shadow is provided, it will be used for the *non-suffixed* `
90
90
module .exports = {
91
91
theme: {
92
92
textShadow: {
93
- default: ' 0 2px 0 #000' ,
94
- md : ' 0 2px 2px #000' ,
95
- h2 : ' 0 0 3px #FF0000, 0 0 5px #0000FF' ,
96
- h1 : ' 0 0 3px rgba(0, 0, 0, .8), 0 0 5px rgba(0, 0, 0, .9)' ,
93
+ ' default' : ' 0 2px 0 #000' ,
94
+ ' md ' : ' 0 2px 2px #000' ,
95
+ ' h2 ' : ' 0 0 3px #FF0000, 0 0 5px #0000FF' ,
96
+ ' h1 ' : ' 0 0 3px rgba(0, 0, 0, .8), 0 0 5px rgba(0, 0, 0, .9)' ,
97
97
}
98
98
}
99
99
}
@@ -112,7 +112,7 @@ module.exports = {
112
112
// ...
113
113
textShadow: {
114
114
' 2xl' : ' 1px 1px 5px rgb(33 34 43 / 20%)' ,
115
- ' 3xl' : ' 0 0 3px rgba(0, 0, 0, .8), 0 0 5px rgba(0, 0, 0, .9)' ,
115
+ ' 3xl' : ' 0 0 3px rgba(0, 0, 0, .8), 0 0 5px rgba(0, 0, 0, .9)' ,
116
116
},
117
117
},
118
118
},
@@ -128,7 +128,7 @@ You can control which variants are generated for the text shadow utilities by mo
128
128
129
129
For example, this config will also generate active and group-hover variants:
130
130
131
- > The variant name is ** ` textShadow ` ** .
131
+ > Use the name ** ` textShadow ` ** under variants object .
132
132
133
133
``` javascript
134
134
// tailwind.config.js
0 commit comments