@vuetify/nightly 3.8.1-next.2025-04-18 → 3.8.2-dev.2025-04-28

package/lib/components/VTable/VTable.sass

@@ -154,8 +154,7 @@
           z-index: 2
           > tr
             > th
-              @include tools.layer('overrides')
-                border-bottom: 0px
+              border-bottom: 0px !important
 
   .v-table--fixed-footer
     > .v-table__wrapper
@@ -167,5 +166,4 @@
             z-index: 1
             > td,
             > th
-              @include tools.layer('overrides')
-                border-top: 0px
+                border-top: 0px !important

package/lib/components/VTabs/VTab.css

@@ -1,31 +1,30 @@
-@layer vuetify.components {
-  .v-tab.v-tab.v-btn {
-    height: var(--v-tabs-height);
-    border-radius: 0;
-    min-width: 90px;
-  }
-  .v-slide-group--horizontal .v-tab {
-    max-width: 360px;
-  }
-  .v-slide-group--vertical .v-tab {
-    justify-content: start;
-  }
-  .v-tab__slider {
-    position: absolute;
-    bottom: 0;
-    left: 0;
-    height: 2px;
-    width: 100%;
-    background: currentColor;
-    pointer-events: none;
-    opacity: 0;
-  }
-  .v-tab--selected .v-tab__slider {
-    opacity: 1;
-  }
-  .v-slide-group--vertical .v-tab__slider {
-    top: 0;
-    height: 100%;
-    width: 2px;
-  }
+.v-tab.v-tab.v-btn {
+  height: var(--v-tabs-height);
+  border-radius: 0;
+  min-width: 90px;
+}
+.v-slide-group--horizontal .v-tab {
+  max-width: 360px;
+}
+.v-slide-group--vertical .v-tab {
+  justify-content: start;
+}
+
+.v-tab__slider {
+  position: absolute;
+  bottom: 0;
+  left: 0;
+  height: 2px;
+  width: 100%;
+  background: currentColor;
+  pointer-events: none;
+  opacity: 0;
+}
+.v-tab--selected .v-tab__slider {
+  opacity: 1;
+}
+.v-slide-group--vertical .v-tab__slider {
+  top: 0;
+  height: 100%;
+  width: 2px;
 }

package/lib/components/VTabs/VTabs.css

@@ -1,61 +1,67 @@
-@layer vuetify.components {
-  .v-tabs {
-    display: flex;
-    height: var(--v-tabs-height);
-  }
-  .v-tabs--density-default {
-    --v-tabs-height: 48px;
-  }
-  .v-tabs--density-default.v-tabs--stacked {
-    --v-tabs-height: 72px;
-  }
-  .v-tabs--density-comfortable {
-    --v-tabs-height: 44px;
-  }
-  .v-tabs--density-comfortable.v-tabs--stacked {
-    --v-tabs-height: 68px;
-  }
-  .v-tabs--density-compact {
-    --v-tabs-height: 36px;
-  }
-  .v-tabs--density-compact.v-tabs--stacked {
-    --v-tabs-height: 60px;
-  }
-  .v-tabs.v-slide-group--vertical {
-    height: auto;
-    flex: none;
-    --v-tabs-height: 48px;
-  }
-  .v-tabs--align-tabs-title:not(.v-slide-group--has-affixes) .v-tab:first-child {
-    margin-inline-start: 42px;
-  }
-  .v-tabs--fixed-tabs .v-slide-group__content > *:last-child,
-  .v-tabs--align-tabs-center .v-slide-group__content > *:last-child {
-    margin-inline-end: auto;
-  }
-  .v-tabs--fixed-tabs .v-slide-group__content > *:first-child,
-  .v-tabs--align-tabs-center .v-slide-group__content > *:first-child {
-    margin-inline-start: auto;
-  }
-  .v-tabs--grow {
-    flex-grow: 1;
-  }
-  .v-tabs--grow .v-tab {
-    flex: 1 0 auto;
-    max-width: none;
-  }
-  .v-tabs--align-tabs-end .v-tab:first-child {
-    margin-inline-start: auto;
-  }
-  .v-tabs--align-tabs-end .v-tab:last-child {
-    margin-inline-end: 0;
-  }
-  @media (max-width: 1279.98px) {
-    .v-tabs.v-slide-group--is-overflowing.v-slide-group--horizontal:not(.v-slide-group--has-affixes) .v-tab:first-child {
-      margin-inline-start: 52px;
-    }
-    .v-tabs.v-slide-group--is-overflowing.v-slide-group--horizontal:not(.v-slide-group--has-affixes) .v-tab:last-child {
-      margin-inline-end: 52px;
-    }
+.v-tabs {
+  display: flex;
+  height: var(--v-tabs-height);
+}
+.v-tabs--density-default {
+  --v-tabs-height: 48px;
+}
+.v-tabs--density-default.v-tabs--stacked {
+  --v-tabs-height: 72px;
+}
+
+.v-tabs--density-comfortable {
+  --v-tabs-height: 44px;
+}
+.v-tabs--density-comfortable.v-tabs--stacked {
+  --v-tabs-height: 68px;
+}
+
+.v-tabs--density-compact {
+  --v-tabs-height: 36px;
+}
+.v-tabs--density-compact.v-tabs--stacked {
+  --v-tabs-height: 60px;
+}
+
+.v-tabs.v-slide-group--vertical {
+  height: auto;
+  flex: none;
+  --v-tabs-height: 48px;
+}
+
+.v-tabs--align-tabs-title:not(.v-slide-group--has-affixes) .v-tab:first-child {
+  margin-inline-start: 42px;
+}
+
+.v-tabs--fixed-tabs .v-slide-group__content > *:last-child,
+.v-tabs--align-tabs-center .v-slide-group__content > *:last-child {
+  margin-inline-end: auto;
+}
+.v-tabs--fixed-tabs .v-slide-group__content > *:first-child,
+.v-tabs--align-tabs-center .v-slide-group__content > *:first-child {
+  margin-inline-start: auto;
+}
+
+.v-tabs--grow {
+  flex-grow: 1;
+}
+.v-tabs--grow .v-tab {
+  flex: 1 0 auto;
+  max-width: none;
+}
+
+.v-tabs--align-tabs-end .v-tab:first-child {
+  margin-inline-start: auto;
+}
+.v-tabs--align-tabs-end .v-tab:last-child {
+  margin-inline-end: 0;
+}
+
+@media (max-width: 1279.98px) {
+  .v-tabs.v-slide-group--is-overflowing.v-slide-group--horizontal:not(.v-slide-group--has-affixes) .v-tab:first-child {
+    margin-inline-start: 52px;
+  }
+  .v-tabs.v-slide-group--is-overflowing.v-slide-group--horizontal:not(.v-slide-group--has-affixes) .v-tab:last-child {
+    margin-inline-end: 52px;
   }
 }

package/lib/components/VTextField/VTextField.css

@@ -1,77 +1,85 @@
-@layer vuetify.components {
-  /* region BLOCK */
-  .v-text-field input {
-    color: inherit;
-    opacity: 0;
-    flex: 1;
-    transition: 0.15s opacity cubic-bezier(0.4, 0, 0.2, 1);
-    min-width: 0;
-  }
-  .v-text-field input:focus, .v-text-field input:active {
-    outline: none;
-  }
-  .v-text-field input:invalid {
-    box-shadow: none;
-  }
-  .v-text-field .v-field {
-    cursor: text;
-  }
-  .v-text-field--prefixed.v-text-field .v-field:not(.v-field--reverse) .v-field__input {
-    --v-field-padding-start: 6px;
-  }
-  .v-text-field--suffixed.v-text-field .v-field:not(.v-field--reverse) .v-field__input {
-    --v-field-padding-end: 0;
-  }
-  .v-text-field--prefixed.v-text-field .v-field.v-field--reverse .v-field__input {
-    --v-field-padding-end: 6px;
-  }
-  .v-text-field--suffixed.v-text-field .v-field.v-field--reverse .v-field__input {
-    --v-field-padding-start: 0;
-  }
-  .v-text-field .v-input__details {
-    padding-inline: 16px;
-  }
-  .v-input--plain-underlined.v-text-field .v-input__details {
-    padding-inline: 0;
-  }
-  .v-text-field .v-field--no-label input,
-  .v-text-field .v-field--active input {
-    opacity: 1;
-  }
-  .v-text-field .v-field--single-line input {
-    transition: none;
-  }
-  /* endregion */
-  /* region ELEMENTS */
-  .v-text-field__prefix, .v-text-field__suffix {
-    align-items: center;
-    color: rgba(var(--v-theme-on-surface), var(--v-medium-emphasis-opacity));
-    cursor: default;
-    display: flex;
-    opacity: 0;
-    transition: inherit;
-    white-space: nowrap;
-    min-height: max(var(--v-input-control-height, 56px), 1.5rem + var(--v-field-input-padding-top) + var(--v-field-input-padding-bottom));
-    padding-top: calc(var(--v-field-padding-top, 4px) + var(--v-input-padding-top, 0));
-    padding-bottom: var(--v-field-padding-bottom, 6px);
-  }
-  .v-field--active .v-text-field__prefix, .v-field--active .v-text-field__suffix {
-    opacity: 1;
-  }
-  .v-field--disabled .v-text-field__prefix, .v-field--disabled .v-text-field__suffix {
-    color: rgba(var(--v-theme-on-surface), var(--v-disabled-opacity));
-  }
-  .v-field:not(.v-field--reverse) .v-text-field__prefix {
-    padding-inline-start: var(--v-field-padding-start);
-  }
-  .v-field.v-field--reverse .v-text-field__prefix {
-    padding-inline-end: var(--v-field-padding-end);
-  }
-  .v-field:not(.v-field--reverse) .v-text-field__suffix {
-    padding-inline-end: var(--v-field-padding-end);
-  }
-  .v-field.v-field--reverse .v-text-field__suffix {
-    padding-inline-start: var(--v-field-padding-start);
-  }
-  /* endregion */
-}
+/* region BLOCK */
+.v-text-field input {
+  color: inherit;
+  opacity: 0;
+  flex: 1;
+  transition: 0.15s opacity cubic-bezier(0.4, 0, 0.2, 1);
+  min-width: 0;
+}
+.v-text-field input:focus, .v-text-field input:active {
+  outline: none;
+}
+.v-text-field input:invalid {
+  box-shadow: none;
+}
+.v-text-field .v-field {
+  cursor: text;
+}
+.v-text-field--prefixed.v-text-field .v-field:not(.v-field--reverse) .v-field__input {
+  --v-field-padding-start: 6px;
+}
+
+.v-text-field--suffixed.v-text-field .v-field:not(.v-field--reverse) .v-field__input {
+  --v-field-padding-end: 0;
+}
+
+.v-text-field--prefixed.v-text-field .v-field.v-field--reverse .v-field__input {
+  --v-field-padding-end: 6px;
+}
+
+.v-text-field--suffixed.v-text-field .v-field.v-field--reverse .v-field__input {
+  --v-field-padding-start: 0;
+}
+
+.v-text-field .v-input__details {
+  padding-inline: 16px;
+}
+.v-input--plain-underlined.v-text-field .v-input__details {
+  padding-inline: 0;
+}
+
+.v-text-field .v-field--no-label input,
+.v-text-field .v-field--active input {
+  opacity: 1;
+}
+.v-text-field .v-field--single-line input {
+  transition: none;
+}
+
+/* endregion */
+/* region ELEMENTS */
+.v-text-field__prefix, .v-text-field__suffix {
+  align-items: center;
+  color: rgba(var(--v-theme-on-surface), var(--v-medium-emphasis-opacity));
+  cursor: default;
+  display: flex;
+  opacity: 0;
+  transition: inherit;
+  white-space: nowrap;
+  min-height: max(var(--v-input-control-height, 56px), 1.5rem + var(--v-field-input-padding-top) + var(--v-field-input-padding-bottom));
+  padding-top: calc(var(--v-field-padding-top, 4px) + var(--v-input-padding-top, 0));
+  padding-bottom: var(--v-field-padding-bottom, 6px);
+}
+.v-field--active .v-text-field__prefix, .v-field--active .v-text-field__suffix {
+  opacity: 1;
+}
+.v-field--disabled .v-text-field__prefix, .v-field--disabled .v-text-field__suffix {
+  color: rgba(var(--v-theme-on-surface), var(--v-disabled-opacity));
+}
+.v-field:not(.v-field--reverse) .v-text-field__prefix {
+  padding-inline-start: var(--v-field-padding-start);
+}
+
+.v-field.v-field--reverse .v-text-field__prefix {
+  padding-inline-end: var(--v-field-padding-end);
+}
+
+.v-field:not(.v-field--reverse) .v-text-field__suffix {
+  padding-inline-end: var(--v-field-padding-end);
+}
+
+.v-field.v-field--reverse .v-text-field__suffix {
+  padding-inline-start: var(--v-field-padding-start);
+}
+
+/* endregion */

package/lib/components/VTextarea/VTextarea.css

@@ -1,49 +1,41 @@
-@layer vuetify.components {
-  .v-textarea .v-field {
-    --v-textarea-control-height: var(--v-input-control-height);
-  }
-  .v-textarea .v-field__field {
-    --v-input-control-height: var(--v-textarea-control-height);
-  }
-  .v-textarea .v-field__input {
-    flex: 1 1 auto;
-    outline: none;
-    -webkit-mask-image: linear-gradient(to bottom, transparent, transparent calc(var(--v-field-padding-top, 0) + var(--v-input-padding-top, 0) - 6px), black calc(var(--v-field-padding-top, 0) + var(--v-input-padding-top, 0) + 4px));
-    mask-image: linear-gradient(to bottom, transparent, transparent calc(var(--v-field-padding-top, 0) + var(--v-input-padding-top, 0) - 6px), black calc(var(--v-field-padding-top, 0) + var(--v-input-padding-top, 0) + 4px));
-  }
-  .v-textarea .v-field__input.v-textarea__sizer {
-    visibility: hidden;
-    position: absolute;
-    top: 0;
-    left: 0;
-    pointer-events: none;
-  }
-}
-@layer vuetify.overrides {
-  .v-textarea .v-field__input.v-textarea__sizer {
-    height: 0;
-    min-height: 0;
-  }
-}
-@layer vuetify.components {
-  .v-textarea--no-resize .v-field__input {
-    resize: none;
-  }
-  .v-textarea .v-field--no-label textarea,
-  .v-textarea .v-field--active textarea {
-    opacity: 1;
-  }
-  .v-textarea textarea {
-    opacity: 0;
-    flex: 1;
-    min-width: 0;
-    height: 100%;
-    transition: 0.15s opacity cubic-bezier(0.4, 0, 0.2, 1);
-  }
-  .v-textarea textarea:focus, .v-textarea textarea:active {
-    outline: none;
-  }
-  .v-textarea textarea:invalid {
-    box-shadow: none;
-  }
+.v-textarea .v-field {
+  --v-textarea-control-height: var(--v-input-control-height);
+}
+.v-textarea .v-field__field {
+  --v-input-control-height: var(--v-textarea-control-height);
+}
+.v-textarea .v-field__input {
+  flex: 1 1 auto;
+  outline: none;
+  -webkit-mask-image: linear-gradient(to bottom, transparent, transparent calc(var(--v-field-padding-top, 0) + var(--v-input-padding-top, 0) - 6px), black calc(var(--v-field-padding-top, 0) + var(--v-input-padding-top, 0) + 4px));
+  mask-image: linear-gradient(to bottom, transparent, transparent calc(var(--v-field-padding-top, 0) + var(--v-input-padding-top, 0) - 6px), black calc(var(--v-field-padding-top, 0) + var(--v-input-padding-top, 0) + 4px));
+}
+.v-textarea .v-field__input.v-textarea__sizer {
+  visibility: hidden;
+  position: absolute;
+  top: 0;
+  left: 0;
+  height: 0 !important;
+  min-height: 0 !important;
+  pointer-events: none;
+}
+.v-textarea--no-resize .v-field__input {
+  resize: none;
+}
+.v-textarea .v-field--no-label textarea,
+.v-textarea .v-field--active textarea {
+  opacity: 1;
+}
+.v-textarea textarea {
+  opacity: 0;
+  flex: 1;
+  min-width: 0;
+  height: 100%;
+  transition: 0.15s opacity cubic-bezier(0.4, 0, 0.2, 1);
+}
+.v-textarea textarea:focus, .v-textarea textarea:active {
+  outline: none;
+}
+.v-textarea textarea:invalid {
+  box-shadow: none;
 }

package/lib/components/VTextarea/VTextarea.sass

@@ -26,12 +26,10 @@
         position: absolute
         top: 0
         left: 0
+        height: 0 !important
+        min-height: 0 !important
         pointer-events: none
 
-        @include tools.layer('overrides')
-          height: 0
-          min-height: 0
-
     &--no-resize
       .v-field__input
         resize: none

package/lib/components/VThemeProvider/VThemeProvider.css

@@ -1,6 +1,4 @@
-@layer vuetify.components {
-  .v-theme-provider {
-    background: rgb(var(--v-theme-background));
-    color: rgb(var(--v-theme-on-background));
-  }
+.v-theme-provider {
+  background: rgb(var(--v-theme-background));
+  color: rgb(var(--v-theme-on-background));
 }