@@ -8,10 +8,10 @@ A lightweight Multiple/Single Select Pure functional component for react using R
8
8
<a href =" https://www.npmjs.com/package/react-multiple-select-dropdown-lite " >
9
9
<img alt="npm" src="https://img.shields.io/npm/v/react-multiple-select-dropdown-lite">
10
10
</a >
11
- <
a href =
" https://bundlephobia.com/[email protected] .1 " >
11
+ <
a href =
" https://bundlephobia.com/[email protected] .4 " >
12
12
<img alt="npm bundle size" src="https://img.shields.io/bundlephobia/min/react-multiple-select-dropdown-lite">
13
13
</a >
14
- <
a href =
" https://bundlephobia.com/[email protected] .1 " >
14
+ <
a href =
" https://bundlephobia.com/[email protected] .4 " >
15
15
<img alt="npm bundle size" src="https://img.shields.io/bundlephobia/minzip/react-multiple-select-dropdown-lite">
16
16
</a >
17
17
<a href =" https://github.com/Arif-un/react-multiple-select-dropdown-lite/pulls " >
@@ -73,8 +73,8 @@ export default App
73
73
- [x] Group <br >
74
74
- [x] Searchable <br >
75
75
- [x] Custom Creatable Value <br >
76
- - [ ] Sublist <br >
77
- - [ ] Themeable (using css var) <br >
76
+ - [x] Themeable (using css var) <br >
77
+ <!-- - [ ] Sublist <br> -- >
78
78
79
79
## Props Options
80
80
|Props| type | default | description
@@ -109,9 +109,25 @@ downArrow |bool | true| show / hide down icon in dropdown
109
109
|onMenuOpen|null| Trigger when menu open
110
110
|onMenuClose|null| Trigger when menu close
111
111
112
+ ### CSS Variables
113
+ CSS variable applied in ` .msl-vars ` class name.
114
+ |Variable|Default Value| Details
115
+ |----------|--------------|-----------
116
+ |--menu-max-height| 400px| Dropdown menu <br > maximum height.
117
+ |--input-width| 300px| Dropdown input width.
118
+ |--font-size| 16px| Dropdown font size.
119
+ |--border-radius| 8px 8px 8px 8px| Dropdown Border Radius.
120
+ |--active-menu-shadow| 1px 1px 5px 0px gray| Menu Shadow <br > when active.
121
+ |--line-height| 1.4| fonts line height.
122
+ |--active-menu-background| white| Dropdown menu <br > background color when active.
123
+ |--active-menu-radius| var(--border-radius)| Dropdown menu border <br > radius when active.
124
+
112
125
<br >
113
126
114
127
### Change Log
128
+ ###### v-2.0.4
129
+ - CSS variables updated
130
+
115
131
###### v-2.0.1
116
132
- Provide component width in css vars intead of props
117
133
- Menu rise up at page bottom
0 commit comments