fixed-vuesax 3.14.1 → 3.14.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (47) hide show
  1. package/LICENSE +21 -21
  2. package/README.md +187 -187
  3. package/dist/style/colors.styl +30 -30
  4. package/dist/style/components/vsAlert.styl +66 -66
  5. package/dist/style/components/vsAvatar.styl +64 -64
  6. package/dist/style/components/vsBreadcrumb.styl +50 -50
  7. package/dist/style/components/vsButton.styl +181 -181
  8. package/dist/style/components/vsCard.styl +64 -64
  9. package/dist/style/components/vsCheckBox.styl +111 -111
  10. package/dist/style/components/vsChip.styl +122 -122
  11. package/dist/style/components/vsCollapse.styl +109 -109
  12. package/dist/style/components/vsDivider.styl +34 -34
  13. package/dist/style/components/vsDropDown.styl +231 -231
  14. package/dist/style/components/vsIcon.styl +47 -47
  15. package/dist/style/components/vsImages.styl +166 -166
  16. package/dist/style/components/vsInput.styl +219 -219
  17. package/dist/style/components/vsInputNumber.styl +170 -170
  18. package/dist/style/components/vsList.styl +49 -49
  19. package/dist/style/components/vsLoading.styl +397 -397
  20. package/dist/style/components/vsNavbar.styl +286 -286
  21. package/dist/style/components/vsNotifications.styl +92 -92
  22. package/dist/style/components/vsPagination.styl +143 -143
  23. package/dist/style/components/vsPopup.styl +159 -159
  24. package/dist/style/components/vsProgress.styl +45 -45
  25. package/dist/style/components/vsRadio.styl +93 -93
  26. package/dist/style/components/vsSelect.styl +219 -219
  27. package/dist/style/components/vsSideBar.styl +267 -267
  28. package/dist/style/components/vsSlider.styl +196 -196
  29. package/dist/style/components/vsSpacer.styl +5 -5
  30. package/dist/style/components/vsSwitch.styl +93 -93
  31. package/dist/style/components/vsTable.styl +408 -408
  32. package/dist/style/components/vsTabs.styl +280 -280
  33. package/dist/style/components/vsTextarea.styl +82 -82
  34. package/dist/style/components/vsTimePicker.styl +42 -42
  35. package/dist/style/components/vsTooltip.styl +85 -85
  36. package/dist/style/components/vsUpload.styl +460 -460
  37. package/dist/style/mixins.styl +133 -133
  38. package/dist/style/root.styl +9 -9
  39. package/dist/style/vars.styl +45 -45
  40. package/dist/style/vuesax.styl +25 -25
  41. package/dist/vuesax.common.js +1 -1
  42. package/dist/vuesax.common.js.map +1 -1
  43. package/dist/vuesax.umd.js +1 -1
  44. package/dist/vuesax.umd.js.map +1 -1
  45. package/dist/vuesax.umd.min.js +1 -1
  46. package/dist/vuesax.umd.min.js.map +1 -1
  47. package/package.json +8 -8
@@ -1,267 +1,267 @@
1
- .parentx-static
2
- .vs-sidebar-background
3
- display none
4
-
5
- .vs-sidebar--background
6
- background rgba(0, 0, 0, .2)
7
- width 100%
8
- height 100%
9
- top 0
10
- position fixed
11
- z-index 39999
12
- transition: all .3s ease
13
- opacity 1
14
-
15
- .vs-sidebar
16
- background: rgb(255, 255, 255)
17
- position: fixed
18
- height 100vh
19
- width: 100%
20
- max-width 260px
21
- top: 0
22
- display: flex
23
- flex-direction: column
24
- box-shadow: 0 0 15px 0 rgba(0, 0, 0, .05)
25
- propWithDir(left, null, 0)
26
- transition: all .25s ease
27
- z-index 40000
28
-
29
- &.vs-sidebar-reduce
30
- max-width 54px
31
- border-radius: 0 10px 10px 0
32
-
33
- h4
34
- display: block
35
- position relative
36
- overflow hidden
37
- white-space: nowrap
38
- text-overflow: ellipsis
39
- width: 100%
40
- font-size: .7rem
41
-
42
- i
43
- opacity 0
44
-
45
- ul
46
- propWithDir(padding, left, 0, !important)
47
-
48
- .con-vs-avatar
49
- width: 40px !important
50
- height 40px !important
51
-
52
- &.vs-sidebar-reduceNotHoverExpand
53
- h4
54
- text-align: center
55
-
56
- &:hover
57
- ~ .vs-sidebar--tooltip
58
- opacity 1
59
- visibility visible
60
- propWithDir(transform, null, (5px -110%))
61
-
62
- &:hover:not(.vs-sidebar-reduceNotRebound):not(.vs-sidebar-reduceNotHoverExpand)
63
- animation: expand .4s ease .15s
64
-
65
- &:hover:not(.vs-sidebar-reduceNotHoverExpand)
66
- max-width 260px
67
-
68
- h4
69
- // display: flex
70
- // align-items: center
71
- // justify-content: space-between
72
-
73
- i
74
- opacity 1
75
-
76
- .vs-sidebar--item
77
- overflow hidden
78
-
79
- i
80
- padding: 10px
81
-
82
- &.vs-sidebar-position-right
83
- propWithDir(left, null, auto);
84
- propWithDir(right, null, 0);
85
-
86
- &.vs-sidebar-reduce
87
- border-radius: 10px 0 0 10px
88
-
89
- .vs-sidebar-tooltip
90
- propWithDir(left, null, auto);
91
- propWithDir(right, null, 70px);
92
-
93
- &:after
94
- propWithDir(left, null, auto);
95
- propWithDir(right, null, 5px);
96
- box-shadow: 4px 0 6px -3px rgba(0, 0, 0, .07)
97
-
98
- &.vs-sidebar-parent
99
- position: absolute
100
- height: 100% !important
101
- top: 0
102
-
103
- &.vs-sidebar-staticPosition
104
- position: relative
105
-
106
- .vs-divider-text
107
- opacity .7
108
-
109
- .vs-sidebar--footer
110
- border-top: 1px solid rgba(0, 0, 0, .06)
111
-
112
- .vs-sidebar--items
113
- padding: 10px 0
114
- background: inherit
115
- overflow-y auto
116
-
117
- .vs-sidebar--item
118
- transition: all .25s ease
119
-
120
- i.material-icons
121
- propWithDir(margin, right, 8px)
122
- transition: border .25s ease
123
- font-size: 1rem
124
-
125
- a
126
- padding: 10px
127
- transition: all .25s ease
128
- display: flex
129
- align-items: center
130
- color: inherit
131
- opacity .8
132
- font-size: .85rem
133
- text-decoration none
134
-
135
- &:hover
136
- opacity 1
137
-
138
- .vs-sidebar--header
139
- border-bottom: 1px solid rgba(0, 0, 0, .06)
140
- padding: 10px 5px
141
-
142
- // vs-sidebar-group
143
-
144
- .vs-sidebar-group
145
- background: inherit
146
- position relative
147
-
148
- > ul
149
- transition: all .2s ease
150
-
151
- // opacity: 0
152
-
153
- h4
154
- padding: 10px
155
- cursor: pointer
156
- display: flex
157
- justify-content: space-between
158
- user-select: none
159
- transition: all .25s ease
160
- border-bottom: 1px solid rgba(0, 0, 0, .0)
161
- background: inherit
162
- font-size: .7rem
163
-
164
- i
165
- position: absolute
166
- propWithDir(right, null, 10px)
167
-
168
- .vs-icon
169
- transition: all .2s ease
170
- user-select: none
171
-
172
- &.vs-sidebar-group-open
173
- > ul
174
- propWithDir(padding, left, 10px)
175
- opacity: 1
176
-
177
- .vs-sidebar--item:last-child
178
- border-bottom: 1px solid rgba(0, 0, 0, .05)
179
-
180
- > h4
181
- // background: rgba(0,0,0,.01)
182
- background: linear-gradient(90deg, rgba(0, 0, 0, .0) 0%, rgba(0, 0, 0, .01) 100%);
183
-
184
- // border-bottom: 1px solid rgba(0,0,0,.01)
185
-
186
- > .vs-icon
187
- transform rotate(180deg)
188
-
189
- .vs-sidebar--tooltip
190
- opacity 0
191
- transition: all .25s ease
192
- background: inherit
193
- box-shadow: 0 0 6px 0 rgba(0, 0, 0, .07)
194
- padding: 4px 8px
195
- border-radius: 4px
196
- position fixed
197
- // top: 5px
198
- propWithDir(left, null, 60px)
199
- pointer-events: none
200
- visibility hidden
201
- propWithDir(transform, null, (15px -110%))
202
-
203
- &:after
204
- content: ''
205
- propWithDir(left, null, -5px)
206
- width: 10px
207
- height 10px
208
- background: inherit
209
- box-shadow: -4px 0 6px -3px rgba(0, 0, 0, .07)
210
- position: absolute
211
- top: 50%
212
- transform: translate(0, -50%) rotate(45deg)
213
-
214
- .vs-sidebar--group-items
215
- padding: 0
216
- transition: all .25s ease
217
- max-height: 0
218
- overflow: hidden
219
- background: inherit
220
-
221
- for colorx, i in $vs-colors
222
- .vs-sidebar-{colorx}
223
- .vs-sidebar--item
224
- a
225
- &:hover
226
- color: getColor(colorx, 1)
227
-
228
- .vs-sidebar-item-active
229
- font-weight: bold
230
- background: linear-gradient(90deg, rgba(0, 0, 0, .0) 0%, rgba(0, 0, 0, .01) 100%);
231
- propWithDir(border, right, 3px solid getColor(colorx, 1), !important)
232
- border-right: 3px solid getColor(colorx, 1) !important
233
-
234
- a
235
- color: getColor(colorx, 1) !important
236
- opacity 1 !important
237
-
238
- // animations
239
-
240
- .vs-sidebar-animate-enter-active, .vs-sidebar-animate-leave-active
241
- transition: all .25s ease
242
-
243
- .vs-sidebar
244
- transition: all .25s ease
245
-
246
- .vs-sidebar-animate-enter:not(.vs-sidebar-position-right), .vs-sidebar-animate-leave-to:not(.vs-sidebar-position-right)
247
- .vs-sidebar
248
- propWithDir(transform, null, (-100%))
249
-
250
- .vs-sidebar-animate-enter, .vs-sidebar-animate-leave-to
251
- .vs-sidebar-background
252
- opacity 0 !important
253
-
254
- .vs-sidebar
255
- &.vs-sidebar-position-right
256
- propWithDir(transform, null, (100%))
257
-
258
-
259
- @keyframes expand
260
- 0%
261
- max-width 275px
262
- 30%
263
- max-width 250px
264
- 60%
265
- max-width 265px
266
- 100%
267
- max-width 260px
1
+ .parentx-static
2
+ .vs-sidebar-background
3
+ display none
4
+
5
+ .vs-sidebar--background
6
+ background rgba(0, 0, 0, .2)
7
+ width 100%
8
+ height 100%
9
+ top 0
10
+ position fixed
11
+ z-index 39999
12
+ transition: all .3s ease
13
+ opacity 1
14
+
15
+ .vs-sidebar
16
+ background: rgb(255, 255, 255)
17
+ position: fixed
18
+ height 100vh
19
+ width: 100%
20
+ max-width 260px
21
+ top: 0
22
+ display: flex
23
+ flex-direction: column
24
+ box-shadow: 0 0 15px 0 rgba(0, 0, 0, .05)
25
+ propWithDir(left, null, 0)
26
+ transition: all .25s ease
27
+ z-index 40000
28
+
29
+ &.vs-sidebar-reduce
30
+ max-width 54px
31
+ border-radius: 0 10px 10px 0
32
+
33
+ h4
34
+ display: block
35
+ position relative
36
+ overflow hidden
37
+ white-space: nowrap
38
+ text-overflow: ellipsis
39
+ width: 100%
40
+ font-size: .7rem
41
+
42
+ i
43
+ opacity 0
44
+
45
+ ul
46
+ propWithDir(padding, left, 0, !important)
47
+
48
+ .con-vs-avatar
49
+ width: 40px !important
50
+ height 40px !important
51
+
52
+ &.vs-sidebar-reduceNotHoverExpand
53
+ h4
54
+ text-align: center
55
+
56
+ &:hover
57
+ ~ .vs-sidebar--tooltip
58
+ opacity 1
59
+ visibility visible
60
+ propWithDir(transform, null, (5px -110%))
61
+
62
+ &:hover:not(.vs-sidebar-reduceNotRebound):not(.vs-sidebar-reduceNotHoverExpand)
63
+ animation: expand .4s ease .15s
64
+
65
+ &:hover:not(.vs-sidebar-reduceNotHoverExpand)
66
+ max-width 260px
67
+
68
+ h4
69
+ // display: flex
70
+ // align-items: center
71
+ // justify-content: space-between
72
+
73
+ i
74
+ opacity 1
75
+
76
+ .vs-sidebar--item
77
+ overflow hidden
78
+
79
+ i
80
+ padding: 10px
81
+
82
+ &.vs-sidebar-position-right
83
+ propWithDir(left, null, auto);
84
+ propWithDir(right, null, 0);
85
+
86
+ &.vs-sidebar-reduce
87
+ border-radius: 10px 0 0 10px
88
+
89
+ .vs-sidebar-tooltip
90
+ propWithDir(left, null, auto);
91
+ propWithDir(right, null, 70px);
92
+
93
+ &:after
94
+ propWithDir(left, null, auto);
95
+ propWithDir(right, null, 5px);
96
+ box-shadow: 4px 0 6px -3px rgba(0, 0, 0, .07)
97
+
98
+ &.vs-sidebar-parent
99
+ position: absolute
100
+ height: 100% !important
101
+ top: 0
102
+
103
+ &.vs-sidebar-staticPosition
104
+ position: relative
105
+
106
+ .vs-divider-text
107
+ opacity .7
108
+
109
+ .vs-sidebar--footer
110
+ border-top: 1px solid rgba(0, 0, 0, .06)
111
+
112
+ .vs-sidebar--items
113
+ padding: 10px 0
114
+ background: inherit
115
+ overflow-y auto
116
+
117
+ .vs-sidebar--item
118
+ transition: all .25s ease
119
+
120
+ i.material-icons
121
+ propWithDir(margin, right, 8px)
122
+ transition: border .25s ease
123
+ font-size: 1rem
124
+
125
+ a
126
+ padding: 10px
127
+ transition: all .25s ease
128
+ display: flex
129
+ align-items: center
130
+ color: inherit
131
+ opacity .8
132
+ font-size: .85rem
133
+ text-decoration none
134
+
135
+ &:hover
136
+ opacity 1
137
+
138
+ .vs-sidebar--header
139
+ border-bottom: 1px solid rgba(0, 0, 0, .06)
140
+ padding: 10px 5px
141
+
142
+ // vs-sidebar-group
143
+
144
+ .vs-sidebar-group
145
+ background: inherit
146
+ position relative
147
+
148
+ > ul
149
+ transition: all .2s ease
150
+
151
+ // opacity: 0
152
+
153
+ h4
154
+ padding: 10px
155
+ cursor: pointer
156
+ display: flex
157
+ justify-content: space-between
158
+ user-select: none
159
+ transition: all .25s ease
160
+ border-bottom: 1px solid rgba(0, 0, 0, .0)
161
+ background: inherit
162
+ font-size: .7rem
163
+
164
+ i
165
+ position: absolute
166
+ propWithDir(right, null, 10px)
167
+
168
+ .vs-icon
169
+ transition: all .2s ease
170
+ user-select: none
171
+
172
+ &.vs-sidebar-group-open
173
+ > ul
174
+ propWithDir(padding, left, 10px)
175
+ opacity: 1
176
+
177
+ .vs-sidebar--item:last-child
178
+ border-bottom: 1px solid rgba(0, 0, 0, .05)
179
+
180
+ > h4
181
+ // background: rgba(0,0,0,.01)
182
+ background: linear-gradient(90deg, rgba(0, 0, 0, .0) 0%, rgba(0, 0, 0, .01) 100%);
183
+
184
+ // border-bottom: 1px solid rgba(0,0,0,.01)
185
+
186
+ > .vs-icon
187
+ transform rotate(180deg)
188
+
189
+ .vs-sidebar--tooltip
190
+ opacity 0
191
+ transition: all .25s ease
192
+ background: inherit
193
+ box-shadow: 0 0 6px 0 rgba(0, 0, 0, .07)
194
+ padding: 4px 8px
195
+ border-radius: 4px
196
+ position fixed
197
+ // top: 5px
198
+ propWithDir(left, null, 60px)
199
+ pointer-events: none
200
+ visibility hidden
201
+ propWithDir(transform, null, (15px -110%))
202
+
203
+ &:after
204
+ content: ''
205
+ propWithDir(left, null, -5px)
206
+ width: 10px
207
+ height 10px
208
+ background: inherit
209
+ box-shadow: -4px 0 6px -3px rgba(0, 0, 0, .07)
210
+ position: absolute
211
+ top: 50%
212
+ transform: translate(0, -50%) rotate(45deg)
213
+
214
+ .vs-sidebar--group-items
215
+ padding: 0
216
+ transition: all .25s ease
217
+ max-height: 0
218
+ overflow: hidden
219
+ background: inherit
220
+
221
+ for colorx, i in $vs-colors
222
+ .vs-sidebar-{colorx}
223
+ .vs-sidebar--item
224
+ a
225
+ &:hover
226
+ color: getColor(colorx, 1)
227
+
228
+ .vs-sidebar-item-active
229
+ font-weight: bold
230
+ background: linear-gradient(90deg, rgba(0, 0, 0, .0) 0%, rgba(0, 0, 0, .01) 100%);
231
+ propWithDir(border, right, 3px solid getColor(colorx, 1), !important)
232
+ border-right: 3px solid getColor(colorx, 1) !important
233
+
234
+ a
235
+ color: getColor(colorx, 1) !important
236
+ opacity 1 !important
237
+
238
+ // animations
239
+
240
+ .vs-sidebar-animate-enter-active, .vs-sidebar-animate-leave-active
241
+ transition: all .25s ease
242
+
243
+ .vs-sidebar
244
+ transition: all .25s ease
245
+
246
+ .vs-sidebar-animate-enter:not(.vs-sidebar-position-right), .vs-sidebar-animate-leave-to:not(.vs-sidebar-position-right)
247
+ .vs-sidebar
248
+ propWithDir(transform, null, (-100%))
249
+
250
+ .vs-sidebar-animate-enter, .vs-sidebar-animate-leave-to
251
+ .vs-sidebar-background
252
+ opacity 0 !important
253
+
254
+ .vs-sidebar
255
+ &.vs-sidebar-position-right
256
+ propWithDir(transform, null, (100%))
257
+
258
+
259
+ @keyframes expand
260
+ 0%
261
+ max-width 275px
262
+ 30%
263
+ max-width 250px
264
+ 60%
265
+ max-width 265px
266
+ 100%
267
+ max-width 260px