@vuetify/nightly 3.8.1-master.2025-04-16 → 3.8.1-next.2025-04-18

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 (220) hide show
  1. package/CHANGELOG.md +36 -32
  2. package/dist/json/attributes.json +2908 -2908
  3. package/dist/json/importMap-labs.json +24 -24
  4. package/dist/json/importMap.json +176 -176
  5. package/dist/json/web-types.json +5479 -5439
  6. package/dist/vuetify-labs.cjs +346 -197
  7. package/dist/vuetify-labs.css +26018 -27768
  8. package/dist/vuetify-labs.d.ts +243 -646
  9. package/dist/vuetify-labs.esm.js +347 -198
  10. package/dist/vuetify-labs.esm.js.map +1 -1
  11. package/dist/vuetify-labs.js +346 -197
  12. package/dist/vuetify-labs.min.css +3 -4
  13. package/dist/vuetify.cjs +328 -173
  14. package/dist/vuetify.cjs.map +1 -1
  15. package/dist/vuetify.css +22735 -24481
  16. package/dist/vuetify.d.ts +281 -684
  17. package/dist/vuetify.esm.js +329 -174
  18. package/dist/vuetify.esm.js.map +1 -1
  19. package/dist/vuetify.js +328 -173
  20. package/dist/vuetify.js.map +1 -1
  21. package/dist/vuetify.min.css +3 -4
  22. package/dist/vuetify.min.js +1152 -1161
  23. package/dist/vuetify.min.js.map +1 -1
  24. package/lib/blueprints/md3.js +5 -18
  25. package/lib/blueprints/md3.js.map +1 -1
  26. package/lib/components/VAlert/VAlert.css +207 -215
  27. package/lib/components/VApp/VApp.css +16 -15
  28. package/lib/components/VAppBar/VAppBar.css +14 -12
  29. package/lib/components/VAutocomplete/VAutocomplete.css +85 -84
  30. package/lib/components/VAutocomplete/VAutocomplete.d.ts +18 -9
  31. package/lib/components/VAutocomplete/VAutocomplete.js +6 -3
  32. package/lib/components/VAutocomplete/VAutocomplete.js.map +1 -1
  33. package/lib/components/VAvatar/VAvatar.css +108 -106
  34. package/lib/components/VBadge/VBadge.css +77 -77
  35. package/lib/components/VBanner/VBanner.css +161 -166
  36. package/lib/components/VBottomNavigation/VBottomNavigation.css +65 -64
  37. package/lib/components/VBottomSheet/VBottomSheet.css +34 -31
  38. package/lib/components/VBreadcrumbs/VBreadcrumbs.css +54 -57
  39. package/lib/components/VBtn/VBtn.css +372 -408
  40. package/lib/components/VBtn/VBtn.sass +10 -23
  41. package/lib/components/VBtn/_variables.scss +1 -1
  42. package/lib/components/VBtnGroup/VBtnGroup.css +63 -64
  43. package/lib/components/VBtnToggle/VBtnToggle.css +16 -14
  44. package/lib/components/VCard/VCard.css +294 -302
  45. package/lib/components/VCarousel/VCarousel.css +63 -65
  46. package/lib/components/VCarousel/VCarousel.sass +1 -1
  47. package/lib/components/VCheckbox/VCheckbox.css +7 -5
  48. package/lib/components/VChip/VChip.css +378 -411
  49. package/lib/components/VChipGroup/VChipGroup.css +19 -18
  50. package/lib/components/VCode/VCode.css +10 -11
  51. package/lib/components/VCode/VCode.sass +0 -3
  52. package/lib/components/VColorPicker/VColorPicker.css +23 -23
  53. package/lib/components/VColorPicker/VColorPickerCanvas.css +24 -22
  54. package/lib/components/VColorPicker/VColorPickerEdit.css +29 -28
  55. package/lib/components/VColorPicker/VColorPickerPreview.css +69 -67
  56. package/lib/components/VColorPicker/VColorPickerPreview.sass +4 -2
  57. package/lib/components/VColorPicker/VColorPickerSwatches.css +34 -34
  58. package/lib/components/VCombobox/VCombobox.css +85 -84
  59. package/lib/components/VCombobox/VCombobox.d.ts +18 -9
  60. package/lib/components/VCombobox/VCombobox.js +6 -3
  61. package/lib/components/VCombobox/VCombobox.js.map +1 -1
  62. package/lib/components/VCounter/VCounter.css +7 -5
  63. package/lib/components/VDataTable/VDataTable.css +189 -186
  64. package/lib/components/VDataTable/VDataTable.sass +21 -11
  65. package/lib/components/VDataTable/VDataTableFooter.css +33 -31
  66. package/lib/components/VDatePicker/VDatePicker.css +8 -6
  67. package/lib/components/VDatePicker/VDatePicker.d.ts +7 -7
  68. package/lib/components/VDatePicker/VDatePickerControls.css +55 -57
  69. package/lib/components/VDatePicker/VDatePickerHeader.css +56 -60
  70. package/lib/components/VDatePicker/VDatePickerMonth.css +51 -55
  71. package/lib/components/VDatePicker/VDatePickerMonth.d.ts +7 -7
  72. package/lib/components/VDatePicker/VDatePickerMonths.css +20 -19
  73. package/lib/components/VDatePicker/VDatePickerYears.css +16 -15
  74. package/lib/components/VDialog/VDialog.css +98 -98
  75. package/lib/components/VDivider/VDivider.css +52 -52
  76. package/lib/components/VEmptyState/VEmptyState.css +62 -67
  77. package/lib/components/VExpansionPanel/VExpansionPanel.css +203 -209
  78. package/lib/components/VExpansionPanel/VExpansionPanel.sass +27 -25
  79. package/lib/components/VFab/VFab.css +78 -73
  80. package/lib/components/VFab/VFab.sass +5 -4
  81. package/lib/components/VField/VField.css +541 -589
  82. package/lib/components/VField/VField.sass +4 -11
  83. package/lib/components/VField/_variables.scss +1 -1
  84. package/lib/components/VFileInput/VFileInput.css +30 -28
  85. package/lib/components/VFooter/VFooter.css +38 -36
  86. package/lib/components/VForm/VForm.d.ts +111 -531
  87. package/lib/components/VForm/VForm.js +11 -1
  88. package/lib/components/VForm/VForm.js.map +1 -1
  89. package/lib/components/VGrid/VGrid.css +565 -592
  90. package/lib/components/VIcon/VIcon.css +52 -53
  91. package/lib/components/VImg/VImg.css +50 -51
  92. package/lib/components/VInfiniteScroll/VInfiniteScroll.css +36 -37
  93. package/lib/components/VInput/VInput.css +136 -147
  94. package/lib/components/VItemGroup/VItemGroup.css +7 -5
  95. package/lib/components/VKbd/VKbd.css +13 -11
  96. package/lib/components/VLabel/VLabel.css +16 -15
  97. package/lib/components/VLayout/VLayout.css +10 -8
  98. package/lib/components/VLayout/VLayoutItem.css +8 -7
  99. package/lib/components/VList/VList.css +104 -108
  100. package/lib/components/VList/VList.sass +1 -1
  101. package/lib/components/VList/VListItem.css +440 -452
  102. package/lib/components/VList/VListItem.sass +2 -1
  103. package/lib/components/VLocaleProvider/VLocaleProvider.css +4 -2
  104. package/lib/components/VMain/VMain.css +32 -30
  105. package/lib/components/VMenu/VMenu.css +21 -19
  106. package/lib/components/VMessages/VMessages.css +17 -15
  107. package/lib/components/VNavigationDrawer/VNavigationDrawer.css +102 -104
  108. package/lib/components/VNumberInput/VNumberInput.css +48 -46
  109. package/lib/components/VOtpInput/VOtpInput.css +56 -58
  110. package/lib/components/VOverlay/VOverlay.css +61 -64
  111. package/lib/components/VOverlay/VOverlay.sass +14 -13
  112. package/lib/components/VPagination/VPagination.css +10 -8
  113. package/lib/components/VParallax/VParallax.css +8 -6
  114. package/lib/components/VProgressCircular/VProgressCircular.css +95 -101
  115. package/lib/components/VProgressLinear/VProgressLinear.css +209 -222
  116. package/lib/components/VRadioGroup/VRadioGroup.css +14 -12
  117. package/lib/components/VRating/VRating.css +52 -53
  118. package/lib/components/VResponsive/VResponsive.css +25 -26
  119. package/lib/components/VSelect/VSelect.css +53 -51
  120. package/lib/components/VSelect/VSelect.d.ts +18 -9
  121. package/lib/components/VSelect/VSelect.js +6 -3
  122. package/lib/components/VSelect/VSelect.js.map +1 -1
  123. package/lib/components/VSelectionControl/VSelectionControl.css +98 -100
  124. package/lib/components/VSelectionControlGroup/VSelectionControlGroup.css +10 -8
  125. package/lib/components/VSheet/VSheet.css +38 -36
  126. package/lib/components/VSkeletonLoader/VSkeletonLoader.css +225 -224
  127. package/lib/components/VSlideGroup/VSlideGroup.css +53 -55
  128. package/lib/components/VSlider/VSlider.css +53 -57
  129. package/lib/components/VSlider/VSliderThumb.css +142 -153
  130. package/lib/components/VSlider/VSliderTrack.css +155 -174
  131. package/lib/components/VSnackbar/VSnackbar.css +140 -140
  132. package/lib/components/VSpeedDial/VSpeedDial.css +43 -41
  133. package/lib/components/VStepper/VStepper.css +55 -56
  134. package/lib/components/VStepper/VStepperItem.css +112 -115
  135. package/lib/components/VSwitch/VSwitch.css +129 -139
  136. package/lib/components/VSystemBar/VSystemBar.css +45 -43
  137. package/lib/components/VTable/VTable.css +140 -141
  138. package/lib/components/VTable/VTable.sass +4 -2
  139. package/lib/components/VTabs/VTab.css +30 -29
  140. package/lib/components/VTabs/VTabs.css +59 -65
  141. package/lib/components/VTextField/VTextField.css +77 -85
  142. package/lib/components/VTextarea/VTextarea.css +48 -40
  143. package/lib/components/VTextarea/VTextarea.sass +4 -2
  144. package/lib/components/VThemeProvider/VThemeProvider.css +5 -3
  145. package/lib/components/VTimeline/VTimeline.css +388 -427
  146. package/lib/components/VToolbar/VToolbar.css +137 -144
  147. package/lib/components/VTooltip/VTooltip.css +27 -23
  148. package/lib/components/VTooltip/VTooltip.sass +8 -6
  149. package/lib/components/VVirtualScroll/VVirtualScroll.css +11 -9
  150. package/lib/components/VWindow/VWindow.css +73 -70
  151. package/lib/composables/calendar.d.ts +2 -2
  152. package/lib/composables/calendar.js +7 -5
  153. package/lib/composables/calendar.js.map +1 -1
  154. package/lib/composables/date/DateAdapter.d.ts +0 -1
  155. package/lib/composables/date/DateAdapter.js.map +1 -1
  156. package/lib/composables/date/adapters/vuetify.d.ts +0 -1
  157. package/lib/composables/date/adapters/vuetify.js +160 -101
  158. package/lib/composables/date/adapters/vuetify.js.map +1 -1
  159. package/lib/composables/date/date.d.ts +1 -1
  160. package/lib/composables/date/date.js +20 -0
  161. package/lib/composables/date/date.js.map +1 -1
  162. package/lib/composables/filter.js +1 -2
  163. package/lib/composables/filter.js.map +1 -1
  164. package/lib/composables/theme.d.ts +6 -1
  165. package/lib/composables/theme.js +98 -30
  166. package/lib/composables/theme.js.map +1 -1
  167. package/lib/composables/validation.js +0 -5
  168. package/lib/composables/validation.js.map +1 -1
  169. package/lib/composables/virtual.js +6 -1
  170. package/lib/composables/virtual.js.map +1 -1
  171. package/lib/directives/ripple/VRipple.css +38 -36
  172. package/lib/entry-bundler.d.ts +0 -1
  173. package/lib/entry-bundler.js +1 -1
  174. package/lib/entry-bundler.js.map +1 -1
  175. package/lib/framework.d.ts +70 -68
  176. package/lib/framework.js +1 -1
  177. package/lib/framework.js.map +1 -1
  178. package/lib/labs/VCalendar/VCalendar.css +219 -225
  179. package/lib/labs/VCalendar/VCalendar.d.ts +7 -7
  180. package/lib/labs/VCalendar/VCalendarDay.css +33 -32
  181. package/lib/labs/VCalendar/VCalendarHeader.css +13 -13
  182. package/lib/labs/VCalendar/VCalendarInterval.css +43 -42
  183. package/lib/labs/VCalendar/VCalendarInterval.js +19 -25
  184. package/lib/labs/VCalendar/VCalendarInterval.js.map +1 -1
  185. package/lib/labs/VCalendar/VCalendarIntervalEvent.css +7 -5
  186. package/lib/labs/VCalendar/VCalendarMonthDay.css +61 -58
  187. package/lib/labs/VCalendar/VCalendarMonthDay.sass +3 -2
  188. package/lib/labs/VDateInput/VDateInput.d.ts +7 -7
  189. package/lib/labs/VFileUpload/VFileUpload.css +74 -77
  190. package/lib/labs/VIconBtn/VIconBtn.css +162 -164
  191. package/lib/labs/VPicker/VPicker.css +58 -63
  192. package/lib/labs/VTimePicker/VTimePicker.css +9 -7
  193. package/lib/labs/VTimePicker/VTimePickerClock.css +126 -129
  194. package/lib/labs/VTimePicker/VTimePickerControls.css +102 -103
  195. package/lib/labs/VTreeview/VTreeviewItem.css +30 -28
  196. package/lib/labs/VTreeview/VTreeviewItem.sass +3 -2
  197. package/lib/labs/entry-bundler.d.ts +0 -1
  198. package/lib/styles/elements/_global.sass +1 -1
  199. package/lib/styles/generic/_colors.scss +3 -3
  200. package/lib/styles/generic/_layers.scss +13 -1
  201. package/lib/styles/generic/_reset.scss +0 -1
  202. package/lib/styles/generic/_transitions.scss +32 -32
  203. package/lib/styles/main.css +14668 -16143
  204. package/lib/styles/settings/_utilities.scss +0 -5
  205. package/lib/styles/settings/_variables.scss +2 -3
  206. package/lib/styles/tools/_border.sass +4 -4
  207. package/lib/styles/tools/_display.sass +0 -10
  208. package/lib/styles/tools/_elevation.sass +2 -2
  209. package/lib/styles/tools/_index.sass +0 -2
  210. package/lib/styles/tools/_layer.scss +4 -2
  211. package/lib/styles/tools/_position.sass +2 -2
  212. package/lib/styles/tools/_rounded.sass +2 -2
  213. package/lib/styles/tools/_utilities.sass +1 -5
  214. package/lib/styles/utilities/_elevation.scss +1 -1
  215. package/lib/util/globals.d.ts +1 -0
  216. package/lib/util/globals.js +1 -0
  217. package/lib/util/globals.js.map +1 -1
  218. package/package.json +45 -46
  219. package/lib/styles/tools/_bootable.sass +0 -3
  220. package/lib/styles/tools/_radius.sass +0 -10
@@ -1,216 +1,210 @@
1
- .v-expansion-panel {
2
- background-color: rgb(var(--v-theme-surface));
3
- color: rgba(var(--v-theme-on-surface), var(--v-high-emphasis-opacity));
4
- }
5
- .v-expansion-panel:not(:first-child)::after {
6
- border-color: rgba(var(--v-border-color), var(--v-border-opacity));
7
- }
8
- .v-expansion-panel--disabled .v-expansion-panel-title {
9
- color: rgba(var(--v-theme-on-surface), 0.26);
10
- }
11
- .v-expansion-panel--disabled .v-expansion-panel-title .v-expansion-panel-title__overlay {
12
- opacity: 0.4615384615;
13
- }
14
-
15
- .v-expansion-panels {
16
- display: flex;
17
- flex-wrap: wrap;
18
- justify-content: center;
19
- list-style-type: none;
20
- padding: 0;
21
- width: 100%;
22
- position: relative;
23
- z-index: 1;
24
- }
25
- .v-expansion-panels:not(.v-expansion-panels--variant-accordion) > :not(:first-child):not(:last-child):not(.v-expansion-panel--active):not(.v-expansion-panel--before-active) {
26
- border-bottom-left-radius: 0 !important;
27
- border-bottom-right-radius: 0 !important;
28
- }
29
- .v-expansion-panels:not(.v-expansion-panels--variant-accordion) > :not(:first-child):not(:last-child):not(.v-expansion-panel--active):not(.v-expansion-panel--after-active) {
30
- border-top-left-radius: 0 !important;
31
- border-top-right-radius: 0 !important;
32
- }
33
- .v-expansion-panels:not(.v-expansion-panels--variant-accordion) > :first-child:not(:last-child):not(.v-expansion-panel--active):not(.v-expansion-panel--before-active) {
34
- border-bottom-left-radius: 0 !important;
35
- border-bottom-right-radius: 0 !important;
36
- }
37
- .v-expansion-panels:not(.v-expansion-panels--variant-accordion) > :last-child:not(:first-child):not(.v-expansion-panel--active):not(.v-expansion-panel--after-active) {
38
- border-top-left-radius: 0 !important;
39
- border-top-right-radius: 0 !important;
40
- }
41
- .v-expansion-panels--variant-accordion > :first-child:not(:last-child) {
42
- border-bottom-left-radius: 0 !important;
43
- border-bottom-right-radius: 0 !important;
44
- }
45
- .v-expansion-panels--variant-accordion > :last-child:not(:first-child) {
46
- border-top-left-radius: 0 !important;
47
- border-top-right-radius: 0 !important;
48
- }
49
- .v-expansion-panels--variant-accordion > :last-child:not(:first-child) .v-expansion-panel-title--active {
50
- border-bottom-left-radius: initial;
51
- border-bottom-right-radius: initial;
52
- }
53
- .v-expansion-panels--variant-accordion > :not(:first-child):not(:last-child) {
54
- border-radius: 0 !important;
55
- }
56
- .v-expansion-panels--variant-accordion .v-expansion-panel-title__overlay {
57
- transition: 0.3s border-radius cubic-bezier(0.4, 0, 0.2, 1);
58
- }
59
-
60
- .v-expansion-panel {
61
- flex: 1 0 100%;
62
- max-width: 100%;
63
- position: relative;
64
- transition: 0.3s all cubic-bezier(0.4, 0, 0.2, 1);
65
- transition-property: margin-top, border-radius, border, max-width;
66
- border-radius: 4px;
67
- }
68
- .v-expansion-panel:not(:first-child)::after {
69
- border-top-style: solid;
70
- border-top-width: thin;
71
- content: "";
72
- left: 0;
73
- position: absolute;
74
- right: 0;
75
- top: 0;
76
- transition: 0.3s opacity cubic-bezier(0.4, 0, 0.2, 1);
77
- }
78
- .v-expansion-panel--disabled .v-expansion-panel-title {
79
- pointer-events: none;
80
- }
81
- .v-expansion-panel--active:not(:first-child),
82
- .v-expansion-panel--active + .v-expansion-panel {
83
- margin-top: 16px;
84
- }
85
- .v-expansion-panel--active:not(:first-child)::after,
86
- .v-expansion-panel--active + .v-expansion-panel::after {
87
- opacity: 0;
88
- }
89
- .v-expansion-panel--active > .v-expansion-panel-title {
90
- border-bottom-left-radius: 0;
91
- border-bottom-right-radius: 0;
92
- }
93
- .v-expansion-panel--active > .v-expansion-panel-title:not(.v-expansion-panel-title--static) {
94
- min-height: 64px;
95
- }
96
-
97
- .v-expansion-panel__shadow {
98
- border-radius: inherit;
99
- z-index: -1;
100
- }
101
- .v-expansion-panel__shadow {
102
- position: absolute;
103
- top: 0;
104
- left: 0;
105
- width: 100%;
106
- height: 100%;
107
- }
108
- .v-expansion-panel__shadow {
109
- box-shadow: 0px 3px 1px -2px var(--v-shadow-key-umbra-opacity, rgba(0, 0, 0, 0.2)), 0px 2px 2px 0px var(--v-shadow-key-penumbra-opacity, rgba(0, 0, 0, 0.14)), 0px 1px 5px 0px var(--v-shadow-key-ambient-opacity, rgba(0, 0, 0, 0.12));
110
- }
111
-
112
- .v-expansion-panel-title {
113
- align-items: center;
114
- text-align: start;
115
- border-radius: inherit;
116
- display: flex;
117
- font-size: 0.9375rem;
118
- line-height: 1;
119
- min-height: 48px;
120
- outline: none;
121
- padding: 16px 24px;
122
- position: relative;
123
- transition: 0.3s min-height cubic-bezier(0.4, 0, 0.2, 1);
124
- width: 100%;
125
- justify-content: space-between;
126
- }
127
- .v-expansion-panel-title:hover > .v-expansion-panel-title__overlay {
128
- opacity: calc(var(--v-hover-opacity) * var(--v-theme-overlay-multiplier));
1
+ @layer vuetify.components {
2
+ .v-expansion-panel {
3
+ background-color: rgb(var(--v-theme-surface));
4
+ color: rgba(var(--v-theme-on-surface), var(--v-high-emphasis-opacity));
5
+ }
6
+ .v-expansion-panel:not(:first-child)::after {
7
+ border-color: rgba(var(--v-border-color), var(--v-border-opacity));
8
+ }
9
+ .v-expansion-panel--disabled .v-expansion-panel-title {
10
+ color: rgba(var(--v-theme-on-surface), 0.26);
11
+ }
12
+ .v-expansion-panel--disabled .v-expansion-panel-title .v-expansion-panel-title__overlay {
13
+ opacity: 0.4615384615;
14
+ }
15
+ .v-expansion-panels {
16
+ display: flex;
17
+ flex-wrap: wrap;
18
+ justify-content: center;
19
+ list-style-type: none;
20
+ padding: 0;
21
+ width: 100%;
22
+ position: relative;
23
+ z-index: 1;
24
+ }
129
25
  }
130
- .v-expansion-panel-title:focus-visible > .v-expansion-panel-title__overlay {
131
- opacity: calc(var(--v-focus-opacity) * var(--v-theme-overlay-multiplier));
26
+ @layer vuetify.overrides {
27
+ .v-expansion-panels:not(.v-expansion-panels--variant-accordion) > :not(:first-child):not(:last-child):not(.v-expansion-panel--active):not(.v-expansion-panel--before-active) {
28
+ border-bottom-left-radius: 0;
29
+ border-bottom-right-radius: 0;
30
+ }
31
+ .v-expansion-panels:not(.v-expansion-panels--variant-accordion) > :not(:first-child):not(:last-child):not(.v-expansion-panel--active):not(.v-expansion-panel--after-active) {
32
+ border-top-left-radius: 0;
33
+ border-top-right-radius: 0;
34
+ }
35
+ .v-expansion-panels:not(.v-expansion-panels--variant-accordion) > :first-child:not(:last-child):not(.v-expansion-panel--active):not(.v-expansion-panel--before-active) {
36
+ border-bottom-left-radius: 0;
37
+ border-bottom-right-radius: 0;
38
+ }
39
+ .v-expansion-panels:not(.v-expansion-panels--variant-accordion) > :last-child:not(:first-child):not(.v-expansion-panel--active):not(.v-expansion-panel--after-active) {
40
+ border-top-left-radius: 0;
41
+ border-top-right-radius: 0;
42
+ }
43
+ .v-expansion-panels--variant-accordion > :first-child:not(:last-child) {
44
+ border-bottom-left-radius: 0;
45
+ border-bottom-right-radius: 0;
46
+ }
47
+ .v-expansion-panels--variant-accordion > :last-child:not(:first-child) {
48
+ border-top-left-radius: 0;
49
+ border-top-right-radius: 0;
50
+ }
51
+ .v-expansion-panels--variant-accordion > :last-child:not(:first-child) .v-expansion-panel-title--active {
52
+ border-bottom-left-radius: initial;
53
+ border-bottom-right-radius: initial;
54
+ }
55
+ .v-expansion-panels--variant-accordion > :not(:first-child):not(:last-child) {
56
+ border-radius: 0;
57
+ }
132
58
  }
133
- @supports not selector(:focus-visible) {
134
- .v-expansion-panel-title:focus > .v-expansion-panel-title__overlay {
59
+ @layer vuetify.components {
60
+ .v-expansion-panels--variant-accordion .v-expansion-panel-title__overlay {
61
+ transition: 0.3s border-radius cubic-bezier(0.4, 0, 0.2, 1);
62
+ }
63
+ .v-expansion-panel {
64
+ flex: 1 0 100%;
65
+ max-width: 100%;
66
+ position: relative;
67
+ transition: 0.3s all cubic-bezier(0.4, 0, 0.2, 1);
68
+ transition-property: margin-top, border-radius, border, max-width;
69
+ border-radius: 4px;
70
+ }
71
+ .v-expansion-panel:not(:first-child)::after {
72
+ border-top-style: solid;
73
+ border-top-width: thin;
74
+ content: "";
75
+ left: 0;
76
+ position: absolute;
77
+ right: 0;
78
+ top: 0;
79
+ transition: 0.3s opacity cubic-bezier(0.4, 0, 0.2, 1);
80
+ }
81
+ .v-expansion-panel--disabled .v-expansion-panel-title {
82
+ pointer-events: none;
83
+ }
84
+ .v-expansion-panel--active:not(:first-child),
85
+ .v-expansion-panel--active + .v-expansion-panel {
86
+ margin-top: 16px;
87
+ }
88
+ .v-expansion-panel--active:not(:first-child)::after,
89
+ .v-expansion-panel--active + .v-expansion-panel::after {
90
+ opacity: 0;
91
+ }
92
+ .v-expansion-panel--active > .v-expansion-panel-title {
93
+ border-bottom-left-radius: 0;
94
+ border-bottom-right-radius: 0;
95
+ }
96
+ .v-expansion-panel--active > .v-expansion-panel-title:not(.v-expansion-panel-title--static) {
97
+ min-height: 64px;
98
+ }
99
+ .v-expansion-panel__shadow {
100
+ border-radius: inherit;
101
+ z-index: -1;
102
+ }
103
+ .v-expansion-panel__shadow {
104
+ position: absolute;
105
+ top: 0;
106
+ left: 0;
107
+ width: 100%;
108
+ height: 100%;
109
+ }
110
+ .v-expansion-panel__shadow {
111
+ box-shadow: 0px 3px 1px -2px var(--v-shadow-key-umbra-opacity, rgba(0, 0, 0, 0.2)), 0px 2px 2px 0px var(--v-shadow-key-penumbra-opacity, rgba(0, 0, 0, 0.14)), 0px 1px 5px 0px var(--v-shadow-key-ambient-opacity, rgba(0, 0, 0, 0.12));
112
+ }
113
+ .v-expansion-panel-title {
114
+ align-items: center;
115
+ text-align: start;
116
+ border-radius: inherit;
117
+ display: flex;
118
+ font-size: 0.9375rem;
119
+ line-height: 1;
120
+ min-height: 48px;
121
+ outline: none;
122
+ padding: 16px 24px;
123
+ position: relative;
124
+ transition: 0.3s min-height cubic-bezier(0.4, 0, 0.2, 1);
125
+ width: 100%;
126
+ justify-content: space-between;
127
+ }
128
+ .v-expansion-panel-title:hover > .v-expansion-panel-title__overlay {
129
+ opacity: calc(var(--v-hover-opacity) * var(--v-theme-overlay-multiplier));
130
+ }
131
+ .v-expansion-panel-title:focus-visible > .v-expansion-panel-title__overlay {
135
132
  opacity: calc(var(--v-focus-opacity) * var(--v-theme-overlay-multiplier));
136
133
  }
137
- }
138
- .v-expansion-panel-title--focusable.v-expansion-panel-title--active .v-expansion-panel-title__overlay {
139
- opacity: calc(var(--v-activated-opacity) * var(--v-theme-overlay-multiplier));
140
- }
141
- .v-expansion-panel-title--focusable.v-expansion-panel-title--active:hover .v-expansion-panel-title__overlay {
142
- opacity: calc((var(--v-activated-opacity) + var(--v-hover-opacity)) * var(--v-theme-overlay-multiplier));
143
- }
144
- .v-expansion-panel-title--focusable.v-expansion-panel-title--active:focus-visible .v-expansion-panel-title__overlay {
145
- opacity: calc((var(--v-activated-opacity) + var(--v-focus-opacity)) * var(--v-theme-overlay-multiplier));
146
- }
147
- @supports not selector(:focus-visible) {
148
- .v-expansion-panel-title--focusable.v-expansion-panel-title--active:focus .v-expansion-panel-title__overlay {
134
+ @supports not selector(:focus-visible) {
135
+ .v-expansion-panel-title:focus > .v-expansion-panel-title__overlay {
136
+ opacity: calc(var(--v-focus-opacity) * var(--v-theme-overlay-multiplier));
137
+ }
138
+ }
139
+ .v-expansion-panel-title--focusable.v-expansion-panel-title--active .v-expansion-panel-title__overlay {
140
+ opacity: calc(var(--v-activated-opacity) * var(--v-theme-overlay-multiplier));
141
+ }
142
+ .v-expansion-panel-title--focusable.v-expansion-panel-title--active:hover .v-expansion-panel-title__overlay {
143
+ opacity: calc((var(--v-activated-opacity) + var(--v-hover-opacity)) * var(--v-theme-overlay-multiplier));
144
+ }
145
+ .v-expansion-panel-title--focusable.v-expansion-panel-title--active:focus-visible .v-expansion-panel-title__overlay {
149
146
  opacity: calc((var(--v-activated-opacity) + var(--v-focus-opacity)) * var(--v-theme-overlay-multiplier));
150
147
  }
151
- }
152
-
153
- .v-expansion-panel-title__overlay {
154
- background-color: currentColor;
155
- border-radius: inherit;
156
- opacity: 0;
157
- }
158
- .v-expansion-panel-title__overlay {
159
- position: absolute;
160
- top: 0;
161
- left: 0;
162
- width: 100%;
163
- height: 100%;
164
- }
165
-
166
- .v-expansion-panel-title__icon {
167
- display: inline-flex;
168
- margin-bottom: -4px;
169
- margin-top: -4px;
170
- user-select: none;
171
- margin-inline-start: auto;
172
- }
173
-
174
- .v-expansion-panel-text {
175
- display: flex;
176
- }
177
- .v-expansion-panel-text__wrapper {
178
- padding: 8px 24px 16px;
179
- flex: 1 1 auto;
180
- max-width: 100%;
181
- }
182
-
183
- .v-expansion-panels--variant-accordion > .v-expansion-panel {
184
- margin-top: 0;
185
- }
186
- .v-expansion-panels--variant-accordion > .v-expansion-panel::after {
187
- opacity: 1;
188
- }
189
-
190
- .v-expansion-panels--variant-popout > .v-expansion-panel {
191
- max-width: calc(100% - 32px);
192
- }
193
- .v-expansion-panels--variant-popout > .v-expansion-panel--active {
194
- max-width: calc(100% + 16px);
195
- }
196
-
197
- .v-expansion-panels--variant-inset > .v-expansion-panel {
198
- max-width: 100%;
199
- }
200
- .v-expansion-panels--variant-inset > .v-expansion-panel--active {
201
- max-width: calc(100% - 32px);
202
- }
203
-
204
- .v-expansion-panels--flat > .v-expansion-panel::after {
205
- border-top: none;
206
- }
207
- .v-expansion-panels--flat > .v-expansion-panel .v-expansion-panel__shadow {
208
- display: none;
209
- }
210
-
211
- .v-expansion-panels--tile {
212
- border-radius: 0;
213
- }
214
- .v-expansion-panels--tile > .v-expansion-panel {
215
- border-radius: 0;
148
+ @supports not selector(:focus-visible) {
149
+ .v-expansion-panel-title--focusable.v-expansion-panel-title--active:focus .v-expansion-panel-title__overlay {
150
+ opacity: calc((var(--v-activated-opacity) + var(--v-focus-opacity)) * var(--v-theme-overlay-multiplier));
151
+ }
152
+ }
153
+ .v-expansion-panel-title__overlay {
154
+ background-color: currentColor;
155
+ border-radius: inherit;
156
+ opacity: 0;
157
+ }
158
+ .v-expansion-panel-title__overlay {
159
+ position: absolute;
160
+ top: 0;
161
+ left: 0;
162
+ width: 100%;
163
+ height: 100%;
164
+ }
165
+ .v-expansion-panel-title__icon {
166
+ display: inline-flex;
167
+ margin-bottom: -4px;
168
+ margin-top: -4px;
169
+ user-select: none;
170
+ margin-inline-start: auto;
171
+ }
172
+ .v-expansion-panel-text {
173
+ display: flex;
174
+ }
175
+ .v-expansion-panel-text__wrapper {
176
+ padding: 8px 24px 16px;
177
+ flex: 1 1 auto;
178
+ max-width: 100%;
179
+ }
180
+ .v-expansion-panels--variant-accordion > .v-expansion-panel {
181
+ margin-top: 0;
182
+ }
183
+ .v-expansion-panels--variant-accordion > .v-expansion-panel::after {
184
+ opacity: 1;
185
+ }
186
+ .v-expansion-panels--variant-popout > .v-expansion-panel {
187
+ max-width: calc(100% - 32px);
188
+ }
189
+ .v-expansion-panels--variant-popout > .v-expansion-panel--active {
190
+ max-width: calc(100% + 16px);
191
+ }
192
+ .v-expansion-panels--variant-inset > .v-expansion-panel {
193
+ max-width: 100%;
194
+ }
195
+ .v-expansion-panels--variant-inset > .v-expansion-panel--active {
196
+ max-width: calc(100% - 32px);
197
+ }
198
+ .v-expansion-panels--flat > .v-expansion-panel::after {
199
+ border-top: none;
200
+ }
201
+ .v-expansion-panels--flat > .v-expansion-panel .v-expansion-panel__shadow {
202
+ display: none;
203
+ }
204
+ .v-expansion-panels--tile {
205
+ border-radius: 0;
206
+ }
207
+ .v-expansion-panels--tile > .v-expansion-panel {
208
+ border-radius: 0;
209
+ }
216
210
  }
@@ -33,39 +33,41 @@
33
33
  position: relative
34
34
  z-index: 1
35
35
 
36
- &:not(&--variant-accordion)
37
- > :not(:first-child):not(:last-child):not(.v-expansion-panel--active):not(.v-expansion-panel--before-active)
38
- border-bottom-left-radius: 0 !important
39
- border-bottom-right-radius: 0 !important
36
+ @include tools.layer('overrides')
37
+ &:not(&--variant-accordion)
38
+ > :not(:first-child):not(:last-child):not(.v-expansion-panel--active):not(.v-expansion-panel--before-active)
39
+ border-bottom-left-radius: 0
40
+ border-bottom-right-radius: 0
40
41
 
41
- > :not(:first-child):not(:last-child):not(.v-expansion-panel--active):not(.v-expansion-panel--after-active)
42
- border-top-left-radius: 0 !important
43
- border-top-right-radius: 0 !important
42
+ > :not(:first-child):not(:last-child):not(.v-expansion-panel--active):not(.v-expansion-panel--after-active)
43
+ border-top-left-radius: 0
44
+ border-top-right-radius: 0
44
45
 
45
- > :first-child:not(:last-child):not(.v-expansion-panel--active):not(.v-expansion-panel--before-active)
46
- border-bottom-left-radius: 0 !important
47
- border-bottom-right-radius: 0 !important
46
+ > :first-child:not(:last-child):not(.v-expansion-panel--active):not(.v-expansion-panel--before-active)
47
+ border-bottom-left-radius: 0
48
+ border-bottom-right-radius: 0
48
49
 
49
- > :last-child:not(:first-child):not(.v-expansion-panel--active):not(.v-expansion-panel--after-active)
50
- border-top-left-radius: 0 !important
51
- border-top-right-radius: 0 !important
50
+ > :last-child:not(:first-child):not(.v-expansion-panel--active):not(.v-expansion-panel--after-active)
51
+ border-top-left-radius: 0
52
+ border-top-right-radius: 0
52
53
 
53
- &--variant-accordion
54
- > :first-child:not(:last-child)
55
- border-bottom-left-radius: 0 !important
56
- border-bottom-right-radius: 0 !important
54
+ &--variant-accordion
55
+ > :first-child:not(:last-child)
56
+ border-bottom-left-radius: 0
57
+ border-bottom-right-radius: 0
57
58
 
58
- > :last-child:not(:first-child)
59
- border-top-left-radius: 0 !important
60
- border-top-right-radius: 0 !important
59
+ > :last-child:not(:first-child)
60
+ border-top-left-radius: 0
61
+ border-top-right-radius: 0
61
62
 
62
- .v-expansion-panel-title--active
63
- border-bottom-left-radius: initial
64
- border-bottom-right-radius: initial
63
+ .v-expansion-panel-title--active
64
+ border-bottom-left-radius: initial
65
+ border-bottom-right-radius: initial
65
66
 
66
- > :not(:first-child):not(:last-child)
67
- border-radius: 0 !important
67
+ > :not(:first-child):not(:last-child)
68
+ border-radius: 0
68
69
 
70
+ &--variant-accordion
69
71
  .v-expansion-panel-title__overlay
70
72
  transition: 0.3s border-radius settings.$standard-easing
71
73
 
@@ -1,74 +1,79 @@
1
- .v-fab {
2
- align-items: center;
3
- display: inline-flex;
4
- flex: 1 1 auto;
5
- pointer-events: none;
6
- position: relative;
7
- transition-duration: 0.2s;
8
- transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
9
- vertical-align: middle;
10
- }
11
- .v-fab .v-btn {
12
- pointer-events: auto;
13
- }
14
- .v-fab .v-btn--variant-elevated {
15
- box-shadow: 0px 3px 3px -2px var(--v-shadow-key-umbra-opacity, rgba(0, 0, 0, 0.2)), 0px 3px 4px 0px var(--v-shadow-key-penumbra-opacity, rgba(0, 0, 0, 0.14)), 0px 1px 8px 0px var(--v-shadow-key-ambient-opacity, rgba(0, 0, 0, 0.12));
16
- }
17
- .v-fab--app, .v-fab--absolute {
18
- display: flex;
19
- }
20
- .v-fab--absolute {
21
- position: absolute;
22
- inset: 0;
23
- }
24
- .v-fab--start, .v-fab--left {
25
- justify-content: flex-start;
26
- }
27
- .v-fab--center {
28
- align-items: center;
29
- justify-content: center;
30
- }
31
- .v-fab--end, .v-fab--right {
32
- justify-content: flex-end;
33
- }
34
- .v-fab--bottom {
35
- align-items: flex-end;
36
- }
37
- .v-fab--top {
38
- align-items: flex-start;
39
- }
40
- .v-fab--extended .v-btn {
41
- border-radius: 9999px !important;
42
- }
43
-
44
- .v-fab__container {
45
- align-self: center;
46
- display: inline-flex;
47
- vertical-align: middle;
48
- }
49
- .v-fab--app .v-fab__container {
50
- margin: 12px;
51
- position: fixed;
52
- }
53
- .v-fab--absolute .v-fab__container {
54
- position: absolute;
55
- z-index: 4;
56
- }
57
- .v-fab--offset.v-fab--top .v-fab__container {
58
- transform: translateY(-50%);
59
- }
60
- .v-fab--offset.v-fab--bottom .v-fab__container {
61
- transform: translateY(50%);
62
- }
63
- .v-fab--top .v-fab__container {
64
- top: 0;
65
- }
66
- .v-fab--bottom .v-fab__container {
67
- bottom: 0;
68
- }
69
- .v-fab--left .v-fab__container, .v-fab--start .v-fab__container {
70
- left: 0;
71
- }
72
- .v-fab--right .v-fab__container, .v-fab--end .v-fab__container {
73
- right: 0;
1
+ @layer vuetify.components {
2
+ .v-fab {
3
+ align-items: center;
4
+ display: inline-flex;
5
+ flex: 1 1 auto;
6
+ pointer-events: none;
7
+ position: relative;
8
+ transition-duration: 0.2s;
9
+ transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
10
+ vertical-align: middle;
11
+ }
12
+ .v-fab .v-btn {
13
+ pointer-events: auto;
14
+ }
15
+ .v-fab .v-btn--variant-elevated {
16
+ box-shadow: 0px 3px 3px -2px var(--v-shadow-key-umbra-opacity, rgba(0, 0, 0, 0.2)), 0px 3px 4px 0px var(--v-shadow-key-penumbra-opacity, rgba(0, 0, 0, 0.14)), 0px 1px 8px 0px var(--v-shadow-key-ambient-opacity, rgba(0, 0, 0, 0.12));
17
+ }
18
+ .v-fab--app, .v-fab--absolute {
19
+ display: flex;
20
+ }
21
+ .v-fab--absolute {
22
+ position: absolute;
23
+ inset: 0;
24
+ }
25
+ .v-fab--start, .v-fab--left {
26
+ justify-content: flex-start;
27
+ }
28
+ .v-fab--center {
29
+ align-items: center;
30
+ justify-content: center;
31
+ }
32
+ .v-fab--end, .v-fab--right {
33
+ justify-content: flex-end;
34
+ }
35
+ .v-fab--bottom {
36
+ align-items: flex-end;
37
+ }
38
+ .v-fab--top {
39
+ align-items: flex-start;
40
+ }
41
+ }
42
+ @layer vuetify.overrides {
43
+ .v-fab--extended .v-btn {
44
+ border-radius: 9999px;
45
+ }
46
+ }
47
+ @layer vuetify.components {
48
+ .v-fab__container {
49
+ align-self: center;
50
+ display: inline-flex;
51
+ vertical-align: middle;
52
+ }
53
+ .v-fab--app .v-fab__container {
54
+ margin: 12px;
55
+ position: fixed;
56
+ }
57
+ .v-fab--absolute .v-fab__container {
58
+ position: absolute;
59
+ z-index: 4;
60
+ }
61
+ .v-fab--offset.v-fab--top .v-fab__container {
62
+ transform: translateY(-50%);
63
+ }
64
+ .v-fab--offset.v-fab--bottom .v-fab__container {
65
+ transform: translateY(50%);
66
+ }
67
+ .v-fab--top .v-fab__container {
68
+ top: 0;
69
+ }
70
+ .v-fab--bottom .v-fab__container {
71
+ bottom: 0;
72
+ }
73
+ .v-fab--left .v-fab__container, .v-fab--start .v-fab__container {
74
+ left: 0;
75
+ }
76
+ .v-fab--right .v-fab__container, .v-fab--end .v-fab__container {
77
+ right: 0;
78
+ }
74
79
  }
@@ -49,10 +49,11 @@
49
49
  align-items: flex-start
50
50
 
51
51
  &--extended
52
- .v-btn
53
- // min-height: 56px
54
- // min-width: 80px
55
- border-radius: 9999px !important
52
+ @include tools.layer('overrides')
53
+ .v-btn
54
+ // min-height: 56px
55
+ // min-width: 80px
56
+ border-radius: 9999px
56
57
 
57
58
  .v-fab__container
58
59
  align-self: center