@vuetify/nightly 3.7.3-master.2024-10-31 → 3.7.3-next.2024-11-01

package/lib/components/VSkeletonLoader/VSkeletonLoader.css

@@ -1,226 +1,227 @@
-.v-skeleton-loader {
-  align-items: center;
-  background: rgb(var(--v-theme-surface));
-  border-radius: 4px;
-  display: flex;
-  flex-wrap: wrap;
-  position: relative;
-  vertical-align: top;
-}
-.v-skeleton-loader__actions {
-  justify-content: end;
-}
-.v-skeleton-loader .v-skeleton-loader__ossein {
-  height: 100%;
-}
-.v-skeleton-loader .v-skeleton-loader__avatar,
-.v-skeleton-loader .v-skeleton-loader__button,
-.v-skeleton-loader .v-skeleton-loader__chip,
-.v-skeleton-loader .v-skeleton-loader__divider,
-.v-skeleton-loader .v-skeleton-loader__heading,
-.v-skeleton-loader .v-skeleton-loader__image,
-.v-skeleton-loader .v-skeleton-loader__ossein,
-.v-skeleton-loader .v-skeleton-loader__text {
-  background: rgba(var(--v-theme-on-surface), var(--v-border-opacity));
-}
-.v-skeleton-loader .v-skeleton-loader__list-item,
-.v-skeleton-loader .v-skeleton-loader__list-item-avatar,
-.v-skeleton-loader .v-skeleton-loader__list-item-text,
-.v-skeleton-loader .v-skeleton-loader__list-item-two-line,
-.v-skeleton-loader .v-skeleton-loader__list-item-avatar-two-line,
-.v-skeleton-loader .v-skeleton-loader__list-item-three-line,
-.v-skeleton-loader .v-skeleton-loader__list-item-avatar-three-line {
-  border-radius: 4px;
-}
-.v-skeleton-loader__bone {
-  align-items: center;
-  border-radius: inherit;
-  display: flex;
-  flex: 1 1 100%;
-  flex-wrap: wrap;
-  overflow: hidden;
-  position: relative;
-}
-.v-skeleton-loader__bone::after {
-  animation: loading 1.5s infinite;
-  background: linear-gradient(90deg, rgba(var(--v-theme-surface), 0), rgba(var(--v-theme-surface), 0.3), rgba(var(--v-theme-surface), 0));
-  transform: translateX(-100%);
-  z-index: 1;
-}
-.v-skeleton-loader__bone::after {
-  content: "";
-  position: absolute;
-  top: 0;
-  left: 0;
-  width: 100%;
-  height: 100%;
-}
-.v-skeleton-loader__avatar {
-  border-radius: 50%;
-  flex: 0 1 auto;
-  margin: 8px 16px;
-  max-height: 48px;
-  min-height: 48px;
-  height: 48px;
-  max-width: 48px;
-  min-width: 48px;
-  width: 48px;
-}
-.v-skeleton-loader__avatar + .v-skeleton-loader__bone {
-  flex: 1 1 auto;
-  margin-inline-start: 0;
-}
-.v-skeleton-loader__avatar + .v-skeleton-loader__sentences > .v-skeleton-loader__text,
-.v-skeleton-loader__avatar + .v-skeleton-loader__paragraph > .v-skeleton-loader__text {
-  margin-inline-start: 0;
-}
-.v-skeleton-loader__button {
-  border-radius: 4px;
-  height: 36px;
-  margin: 16px;
-  max-width: 64px;
-}
-.v-skeleton-loader__button + .v-skeleton-loader__bone {
-  flex: 1 1 auto;
-  margin-inline-start: 0;
-}
-.v-skeleton-loader__button + .v-skeleton-loader__sentences > .v-skeleton-loader__text,
-.v-skeleton-loader__button + .v-skeleton-loader__paragraph > .v-skeleton-loader__text {
-  margin-inline-start: 0;
-}
-.v-skeleton-loader__chip {
-  border-radius: 16px;
-  margin: 16px;
-  height: 32px;
-  max-width: 96px;
-}
-.v-skeleton-loader__chip + .v-skeleton-loader__bone {
-  flex: 1 1 auto;
-  margin-inline-start: 0;
-}
-.v-skeleton-loader__chip + .v-skeleton-loader__sentences > .v-skeleton-loader__text,
-.v-skeleton-loader__chip + .v-skeleton-loader__paragraph > .v-skeleton-loader__text {
-  margin-inline-start: 0;
-}
-.v-skeleton-loader__date-picker {
-  border-radius: inherit;
-}
-.v-skeleton-loader__date-picker .v-skeleton-loader__list-item:first-child .v-skeleton-loader__text {
-  max-width: 88px;
-  width: 20%;
-}
-.v-skeleton-loader__date-picker .v-skeleton-loader__heading {
-  max-width: 256px;
-  width: 40%;
-}
-.v-skeleton-loader__date-picker-days {
-  flex-wrap: wrap;
-  margin: 16px;
-}
-.v-skeleton-loader__date-picker-days .v-skeleton-loader__avatar {
-  border-radius: 4px;
-  margin: 4px;
-  max-width: 100%;
-}
-.v-skeleton-loader__date-picker-options {
-  flex-wrap: nowrap;
-}
-.v-skeleton-loader__date-picker-options .v-skeleton-loader__text {
-  flex: 1 1 auto;
-}
-.v-skeleton-loader__divider {
-  border-radius: 1px;
-  height: 2px;
-}
-.v-skeleton-loader__heading {
-  border-radius: 12px;
-  margin: 16px;
-  height: 24px;
-}
-.v-skeleton-loader__heading + .v-skeleton-loader__subtitle {
-  margin-top: -16px;
-}
-.v-skeleton-loader__image {
-  height: 150px;
-  border-radius: 0;
-}
-.v-skeleton-loader__card .v-skeleton-loader__image {
-  border-radius: 0;
-}
-.v-skeleton-loader__list-item {
-  margin: 16px;
-}
-.v-skeleton-loader__list-item .v-skeleton-loader__text {
-  margin: 0;
-}
-.v-skeleton-loader__table-thead {
-  justify-content: space-between;
-}
-.v-skeleton-loader__table-thead .v-skeleton-loader__heading {
-  margin-top: 16px;
-  max-width: 16px;
-}
-.v-skeleton-loader__table-tfoot {
-  flex-wrap: nowrap;
-}
-.v-skeleton-loader__table-tfoot > .v-skeleton-loader__text.v-skeleton-loader__bone {
-  margin-top: 16px;
-}
-.v-skeleton-loader__table-row {
-  align-items: baseline;
-  margin: 0 8px;
-  justify-content: space-evenly;
-  flex-wrap: nowrap;
-}
-.v-skeleton-loader__table-row > .v-skeleton-loader__text.v-skeleton-loader__bone {
-  margin-inline: 8px;
-}
-.v-skeleton-loader__table-row + .v-skeleton-loader__divider {
-  margin: 0 16px;
-}
-.v-skeleton-loader__table-cell {
-  align-items: center;
-  display: flex;
-  height: 48px;
-  width: 88px;
-}
-.v-skeleton-loader__table-cell .v-skeleton-loader__text {
-  margin-bottom: 0;
-}
-.v-skeleton-loader__subtitle {
-  max-width: 70%;
-}
-.v-skeleton-loader__subtitle > .v-skeleton-loader__text {
-  height: 16px;
-  border-radius: 8px;
-}
-.v-skeleton-loader__text {
-  border-radius: 6px;
-  margin: 16px;
-  height: 12px;
-}
-.v-skeleton-loader__text + .v-skeleton-loader__text {
-  margin-top: -8px;
-  max-width: 50%;
-}
-.v-skeleton-loader__text + .v-skeleton-loader__text + .v-skeleton-loader__text {
-  max-width: 70%;
-}
-.v-skeleton-loader--boilerplate .v-skeleton-loader__bone:after {
-  display: none;
-}
-.v-skeleton-loader--is-loading {
-  overflow: hidden;
-}
-.v-skeleton-loader--tile {
-  border-radius: 0;
-}
-.v-skeleton-loader--tile .v-skeleton-loader__bone {
-  border-radius: 0;
-}
-
-@keyframes loading {
-  100% {
-    transform: translateX(100%);
+@layer vuetify.components {
+  .v-skeleton-loader {
+    align-items: center;
+    background: rgb(var(--v-theme-surface));
+    border-radius: 4px;
+    display: flex;
+    flex-wrap: wrap;
+    position: relative;
+    vertical-align: top;
+  }
+  .v-skeleton-loader__actions {
+    justify-content: end;
+  }
+  .v-skeleton-loader .v-skeleton-loader__ossein {
+    height: 100%;
+  }
+  .v-skeleton-loader .v-skeleton-loader__avatar,
+  .v-skeleton-loader .v-skeleton-loader__button,
+  .v-skeleton-loader .v-skeleton-loader__chip,
+  .v-skeleton-loader .v-skeleton-loader__divider,
+  .v-skeleton-loader .v-skeleton-loader__heading,
+  .v-skeleton-loader .v-skeleton-loader__image,
+  .v-skeleton-loader .v-skeleton-loader__ossein,
+  .v-skeleton-loader .v-skeleton-loader__text {
+    background: rgba(var(--v-theme-on-surface), var(--v-border-opacity));
+  }
+  .v-skeleton-loader .v-skeleton-loader__list-item,
+  .v-skeleton-loader .v-skeleton-loader__list-item-avatar,
+  .v-skeleton-loader .v-skeleton-loader__list-item-text,
+  .v-skeleton-loader .v-skeleton-loader__list-item-two-line,
+  .v-skeleton-loader .v-skeleton-loader__list-item-avatar-two-line,
+  .v-skeleton-loader .v-skeleton-loader__list-item-three-line,
+  .v-skeleton-loader .v-skeleton-loader__list-item-avatar-three-line {
+    border-radius: 4px;
+  }
+  .v-skeleton-loader__bone {
+    align-items: center;
+    border-radius: inherit;
+    display: flex;
+    flex: 1 1 100%;
+    flex-wrap: wrap;
+    overflow: hidden;
+    position: relative;
+  }
+  .v-skeleton-loader__bone::after {
+    animation: loading 1.5s infinite;
+    background: linear-gradient(90deg, rgba(var(--v-theme-surface), 0), rgba(var(--v-theme-surface), 0.3), rgba(var(--v-theme-surface), 0));
+    transform: translateX(-100%);
+    z-index: 1;
+  }
+  .v-skeleton-loader__bone::after {
+    content: "";
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+  }
+  .v-skeleton-loader__avatar {
+    border-radius: 50%;
+    flex: 0 1 auto;
+    margin: 8px 16px;
+    max-height: 48px;
+    min-height: 48px;
+    height: 48px;
+    max-width: 48px;
+    min-width: 48px;
+    width: 48px;
+  }
+  .v-skeleton-loader__avatar + .v-skeleton-loader__bone {
+    flex: 1 1 auto;
+    margin-inline-start: 0;
+  }
+  .v-skeleton-loader__avatar + .v-skeleton-loader__sentences > .v-skeleton-loader__text,
+  .v-skeleton-loader__avatar + .v-skeleton-loader__paragraph > .v-skeleton-loader__text {
+    margin-inline-start: 0;
+  }
+  .v-skeleton-loader__button {
+    border-radius: 4px;
+    height: 36px;
+    margin: 16px;
+    max-width: 64px;
+  }
+  .v-skeleton-loader__button + .v-skeleton-loader__bone {
+    flex: 1 1 auto;
+    margin-inline-start: 0;
+  }
+  .v-skeleton-loader__button + .v-skeleton-loader__sentences > .v-skeleton-loader__text,
+  .v-skeleton-loader__button + .v-skeleton-loader__paragraph > .v-skeleton-loader__text {
+    margin-inline-start: 0;
+  }
+  .v-skeleton-loader__chip {
+    border-radius: 16px;
+    margin: 16px;
+    height: 32px;
+    max-width: 96px;
+  }
+  .v-skeleton-loader__chip + .v-skeleton-loader__bone {
+    flex: 1 1 auto;
+    margin-inline-start: 0;
+  }
+  .v-skeleton-loader__chip + .v-skeleton-loader__sentences > .v-skeleton-loader__text,
+  .v-skeleton-loader__chip + .v-skeleton-loader__paragraph > .v-skeleton-loader__text {
+    margin-inline-start: 0;
+  }
+  .v-skeleton-loader__date-picker {
+    border-radius: inherit;
+  }
+  .v-skeleton-loader__date-picker .v-skeleton-loader__list-item:first-child .v-skeleton-loader__text {
+    max-width: 88px;
+    width: 20%;
+  }
+  .v-skeleton-loader__date-picker .v-skeleton-loader__heading {
+    max-width: 256px;
+    width: 40%;
+  }
+  .v-skeleton-loader__date-picker-days {
+    flex-wrap: wrap;
+    margin: 16px;
+  }
+  .v-skeleton-loader__date-picker-days .v-skeleton-loader__avatar {
+    border-radius: 4px;
+    margin: 4px;
+    max-width: 100%;
+  }
+  .v-skeleton-loader__date-picker-options {
+    flex-wrap: nowrap;
+  }
+  .v-skeleton-loader__date-picker-options .v-skeleton-loader__text {
+    flex: 1 1 auto;
+  }
+  .v-skeleton-loader__divider {
+    border-radius: 1px;
+    height: 2px;
+  }
+  .v-skeleton-loader__heading {
+    border-radius: 12px;
+    margin: 16px;
+    height: 24px;
+  }
+  .v-skeleton-loader__heading + .v-skeleton-loader__subtitle {
+    margin-top: -16px;
+  }
+  .v-skeleton-loader__image {
+    height: 150px;
+    border-radius: 0;
+  }
+  .v-skeleton-loader__card .v-skeleton-loader__image {
+    border-radius: 0;
+  }
+  .v-skeleton-loader__list-item {
+    margin: 16px;
+  }
+  .v-skeleton-loader__list-item .v-skeleton-loader__text {
+    margin: 0;
+  }
+  .v-skeleton-loader__table-thead {
+    justify-content: space-between;
+  }
+  .v-skeleton-loader__table-thead .v-skeleton-loader__heading {
+    margin-top: 16px;
+    max-width: 16px;
+  }
+  .v-skeleton-loader__table-tfoot {
+    flex-wrap: nowrap;
+  }
+  .v-skeleton-loader__table-tfoot > .v-skeleton-loader__text.v-skeleton-loader__bone {
+    margin-top: 16px;
+  }
+  .v-skeleton-loader__table-row {
+    align-items: baseline;
+    margin: 0 8px;
+    justify-content: space-evenly;
+    flex-wrap: nowrap;
+  }
+  .v-skeleton-loader__table-row > .v-skeleton-loader__text.v-skeleton-loader__bone {
+    margin-inline: 8px;
+  }
+  .v-skeleton-loader__table-row + .v-skeleton-loader__divider {
+    margin: 0 16px;
+  }
+  .v-skeleton-loader__table-cell {
+    align-items: center;
+    display: flex;
+    height: 48px;
+    width: 88px;
+  }
+  .v-skeleton-loader__table-cell .v-skeleton-loader__text {
+    margin-bottom: 0;
+  }
+  .v-skeleton-loader__subtitle {
+    max-width: 70%;
+  }
+  .v-skeleton-loader__subtitle > .v-skeleton-loader__text {
+    height: 16px;
+    border-radius: 8px;
+  }
+  .v-skeleton-loader__text {
+    border-radius: 6px;
+    margin: 16px;
+    height: 12px;
+  }
+  .v-skeleton-loader__text + .v-skeleton-loader__text {
+    margin-top: -8px;
+    max-width: 50%;
+  }
+  .v-skeleton-loader__text + .v-skeleton-loader__text + .v-skeleton-loader__text {
+    max-width: 70%;
+  }
+  .v-skeleton-loader--boilerplate .v-skeleton-loader__bone:after {
+    display: none;
+  }
+  .v-skeleton-loader--is-loading {
+    overflow: hidden;
+  }
+  .v-skeleton-loader--tile {
+    border-radius: 0;
+  }
+  .v-skeleton-loader--tile .v-skeleton-loader__bone {
+    border-radius: 0;
+  }
+  @keyframes loading {
+    100% {
+      transform: translateX(100%);
+    }
   }
 }

package/lib/components/VSkeletonLoader/VSkeletonLoader.mjs

@@ -1,4 +1,4 @@
-import { mergeProps as _mergeProps, createVNode as _createVNode } from "vue";
+import { createVNode as _createVNode, mergeProps as _mergeProps } from "vue";
 // Styles
 import "./VSkeletonLoader.css";
 

package/lib/components/VSkeletonLoader/index.d.mts

@@ -40,7 +40,7 @@ declare const rootTypes: {
     readonly text: "text";
 };
 declare const VSkeletonLoader: {
-    new (...args: any[]): vue.CreateComponentPublicInstance<{
+    new (...args: any[]): vue.CreateComponentPublicInstanceWithMixins<{
         type: "button" | "article" | "table" | "image" | "text" | (string & {}) | "table-row" | "list-item" | "sentences" | "heading" | "divider" | "subtitle" | "chip" | "avatar" | "actions" | "paragraph" | "ossein" | "card" | "card-avatar" | "date-picker" | "date-picker-options" | "date-picker-days" | "list-item-avatar" | "list-item-two-line" | "list-item-avatar-two-line" | "list-item-three-line" | "list-item-avatar-three-line" | "table-heading" | "table-thead" | "table-tbody" | "table-row-divider" | "table-tfoot" | readonly ("button" | "article" | "table" | "image" | "text" | (string & {}) | "table-row" | "list-item" | "sentences" | "heading" | "divider" | "subtitle" | "chip" | "avatar" | "actions" | "paragraph" | "ossein" | "card" | "card-avatar" | "date-picker" | "date-picker-options" | "date-picker-days" | "list-item-avatar" | "list-item-two-line" | "list-item-avatar-two-line" | "list-item-three-line" | "list-item-avatar-three-line" | "table-heading" | "table-thead" | "table-tbody" | "table-row-divider" | "table-tfoot")[];
         loading: boolean;
         loadingText: string;
@@ -64,38 +64,14 @@ declare const VSkeletonLoader: {
         } | undefined;
     } & {
         "v-slot:default"?: false | (() => vue.VNodeChild) | undefined;
-    }, {}, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, Record<string, any>, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & {
-        type: "button" | "article" | "table" | "image" | "text" | (string & {}) | "table-row" | "list-item" | "sentences" | "heading" | "divider" | "subtitle" | "chip" | "avatar" | "actions" | "paragraph" | "ossein" | "card" | "card-avatar" | "date-picker" | "date-picker-options" | "date-picker-days" | "list-item-avatar" | "list-item-two-line" | "list-item-avatar-two-line" | "list-item-three-line" | "list-item-avatar-three-line" | "table-heading" | "table-thead" | "table-tbody" | "table-row-divider" | "table-tfoot" | readonly ("button" | "article" | "table" | "image" | "text" | (string & {}) | "table-row" | "list-item" | "sentences" | "heading" | "divider" | "subtitle" | "chip" | "avatar" | "actions" | "paragraph" | "ossein" | "card" | "card-avatar" | "date-picker" | "date-picker-options" | "date-picker-days" | "list-item-avatar" | "list-item-two-line" | "list-item-avatar-two-line" | "list-item-three-line" | "list-item-avatar-three-line" | "table-heading" | "table-thead" | "table-tbody" | "table-row-divider" | "table-tfoot")[];
-        loading: boolean;
-        loadingText: string;
-        boilerplate: boolean;
-    } & {
-        height?: string | number | undefined;
-        width?: string | number | undefined;
-        color?: string | undefined;
-        maxHeight?: string | number | undefined;
-        maxWidth?: string | number | undefined;
-        minHeight?: string | number | undefined;
-        minWidth?: string | number | undefined;
-        theme?: string | undefined;
-        elevation?: string | number | undefined;
-    } & {
-        $children?: vue.VNodeChild | {
-            default?: (() => vue.VNodeChild) | undefined;
-        } | (() => vue.VNodeChild);
-        'v-slots'?: {
-            default?: false | (() => vue.VNodeChild) | undefined;
-        } | undefined;
-    } & {
-        "v-slot:default"?: false | (() => vue.VNodeChild) | undefined;
-    }, {
+    }, {}, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, Record<string, any>, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, {
         type: "button" | "article" | "table" | "image" | "text" | (string & {}) | "table-row" | "list-item" | "sentences" | "heading" | "divider" | "subtitle" | "chip" | "avatar" | "actions" | "paragraph" | "ossein" | "card" | "card-avatar" | "date-picker" | "date-picker-options" | "date-picker-days" | "list-item-avatar" | "list-item-two-line" | "list-item-avatar-two-line" | "list-item-three-line" | "list-item-avatar-three-line" | "table-heading" | "table-thead" | "table-tbody" | "table-row-divider" | "table-tfoot" | readonly ("button" | "article" | "table" | "image" | "text" | (string & {}) | "table-row" | "list-item" | "sentences" | "heading" | "divider" | "subtitle" | "chip" | "avatar" | "actions" | "paragraph" | "ossein" | "card" | "card-avatar" | "date-picker" | "date-picker-options" | "date-picker-days" | "list-item-avatar" | "list-item-two-line" | "list-item-avatar-two-line" | "list-item-three-line" | "list-item-avatar-three-line" | "table-heading" | "table-thead" | "table-tbody" | "table-row-divider" | "table-tfoot")[];
         loading: boolean;
         loadingText: string;
         boilerplate: boolean;
     }, true, {}, vue.SlotsType<Partial<{
         default: () => VNode[];
-    }>>, {
+    }>>, vue.GlobalComponents, vue.GlobalDirectives, string, {}, any, vue.ComponentProvideOptions, {
         P: {};
         B: {};
         D: {};
@@ -166,7 +142,7 @@ declare const VSkeletonLoader: {
     boilerplate: boolean;
 }, {}, string, vue.SlotsType<Partial<{
     default: () => VNode[];
-}>>> & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & FilterPropsOptions<{
+}>>, vue.GlobalComponents, vue.GlobalDirectives, string, vue.ComponentProvideOptions> & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & FilterPropsOptions<{
     theme: StringConstructor;
     elevation: {
         type: (StringConstructor | NumberConstructor)[];

package/lib/components/VSlideGroup/VSlideGroup.css

@@ -1,56 +1,54 @@
-.v-slide-group {
-  display: flex;
-  overflow: hidden;
-}
-
-.v-slide-group__next,
-.v-slide-group__prev {
-  align-items: center;
-  display: flex;
-  flex: 0 1 52px;
-  justify-content: center;
-  min-width: 52px;
-  cursor: pointer;
-}
-.v-slide-group__next--disabled,
-.v-slide-group__prev--disabled {
-  pointer-events: none;
-  opacity: var(--v-disabled-opacity);
-}
-
-.v-slide-group__content {
-  display: flex;
-  flex: 1 0 auto;
-  position: relative;
-  transition: 0.2s all cubic-bezier(0.4, 0, 0.2, 1);
-  white-space: nowrap;
-}
-.v-slide-group__content > * {
-  white-space: initial;
-}
-
-.v-slide-group__container {
-  contain: content;
-  display: flex;
-  flex: 1 1 auto;
-  overflow-x: auto;
-  overflow-y: hidden;
-  scrollbar-width: none;
-  scrollbar-color: rgba(0, 0, 0, 0);
-}
-.v-slide-group__container::-webkit-scrollbar {
-  display: none;
-}
-
-.v-slide-group--vertical {
-  max-height: inherit;
-}
-.v-slide-group--vertical,
-.v-slide-group--vertical .v-slide-group__container,
-.v-slide-group--vertical .v-slide-group__content {
-  flex-direction: column;
-}
-.v-slide-group--vertical .v-slide-group__container {
-  overflow-x: hidden;
-  overflow-y: auto;
+@layer vuetify.components {
+  .v-slide-group {
+    display: flex;
+    overflow: hidden;
+  }
+  .v-slide-group__next,
+  .v-slide-group__prev {
+    align-items: center;
+    display: flex;
+    flex: 0 1 52px;
+    justify-content: center;
+    min-width: 52px;
+    cursor: pointer;
+  }
+  .v-slide-group__next--disabled,
+  .v-slide-group__prev--disabled {
+    pointer-events: none;
+    opacity: var(--v-disabled-opacity);
+  }
+  .v-slide-group__content {
+    display: flex;
+    flex: 1 0 auto;
+    position: relative;
+    transition: 0.2s all cubic-bezier(0.4, 0, 0.2, 1);
+    white-space: nowrap;
+  }
+  .v-slide-group__content > * {
+    white-space: initial;
+  }
+  .v-slide-group__container {
+    contain: content;
+    display: flex;
+    flex: 1 1 auto;
+    overflow-x: auto;
+    overflow-y: hidden;
+    scrollbar-width: none;
+    scrollbar-color: rgba(0, 0, 0, 0);
+  }
+  .v-slide-group__container::-webkit-scrollbar {
+    display: none;
+  }
+  .v-slide-group--vertical {
+    max-height: inherit;
+  }
+  .v-slide-group--vertical,
+  .v-slide-group--vertical .v-slide-group__container,
+  .v-slide-group--vertical .v-slide-group__content {
+    flex-direction: column;
+  }
+  .v-slide-group--vertical .v-slide-group__container {
+    overflow-x: hidden;
+    overflow-y: auto;
+  }
 }