1.2.21 ā¢ Published 9 days ago
@jill64/tailwind-reactions v1.2.21
@jill64/tailwind-reactions
š UI effect set for Tailwind CSS
Demo
Setup
// tailwind.config.js
module.exports = {
theme: {
// ...
},
plugins: [
require('@jill64/tailwind-reactions')
// ...
]
}
Usage
<button class="pop-effect bg-blue-500 text-white px-4 py-2 rounded-full">
pop-effect
</button>
<input type="text" class="focus-under border-zinc-400 focus:border-blue-600" />
<input
type="text"
class="focus-under-2 border-zinc-400 focus:border-blue-600"
/>
<input
type="text"
class="focus-under-bold border-zinc-400 focus:border-blue-600"
/>
<input
type="text"
class="focus-under-bold-2 border-zinc-400 focus:border-blue-600"
/>
Additional Configuration
You can configure which values are available for this plugin under the focusUnderWidth
key in your tailwind.config.js
file:
// tailwind.config.js
module.exports = {
theme: {
extend: {
focusUnderWidth: {
5: '5'
6: '6'
7: '7'
}
}
}
}
Alternatively, you can use square bracket notation.
Name | CSS |
---|---|
focus-under-[n] | border-bottom: [n]px |
focus-under-bold-[n] | border-bottom: [n]px |
License
1.2.21
9 days ago
1.2.20
20 days ago
1.2.19
29 days ago
1.2.18
1 month ago
1.2.17
1 month ago
1.2.16
2 months ago
1.2.15
2 months ago
1.2.14
3 months ago
1.2.13
3 months ago
1.2.12
3 months ago
1.2.11
3 months ago
1.2.10
4 months ago
1.2.9
4 months ago
1.2.8
4 months ago
1.2.7
4 months ago
1.2.6
5 months ago
1.2.5
5 months ago
1.2.1
5 months ago
1.2.0
5 months ago
1.1.0
6 months ago
1.0.1
7 months ago
1.0.0
7 months ago
0.1.15
7 months ago
0.1.14
7 months ago
0.1.13
7 months ago
0.1.12
7 months ago
0.1.11
7 months ago
0.1.10
7 months ago
0.1.9
7 months ago
0.1.8
7 months ago
0.1.7
7 months ago
0.1.5
7 months ago
0.1.4
7 months ago
0.1.3
7 months ago
0.1.2
8 months ago
0.1.1
8 months ago
0.1.0
8 months ago