@vuetify/nightly 3.9.0-master.2025-07-09 → 3.9.0-next.2025-07-09

package/lib/styles/settings/_utilities.scss

@@ -511,11 +511,6 @@ $utilities: () !default;
           text-transform
         ),
         class: text,
-        unimportant: (
-          font-family,
-          font-weight,
-          line-height
-        ),
         values: variables.$flat-typography
       ),
       "text-transform": (

package/lib/styles/settings/_variables.scss

@@ -5,7 +5,7 @@
 
 $color-pack: true !default;
 $reset: true !default;
-$layers: false !default;
+$layers: true !default;
 
 $body-font-family: 'Roboto', sans-serif !default;
 $font-size-root: 1rem !default;
@@ -291,7 +291,7 @@ $typography: map-deep-merge(
       'line-height': 2.6,
       'letter-spacing': .0892857143em,
       'font-family': $body-font-family,
-      'text-transform': uppercase
+      'text-transform': none
     ),
     'caption': (
       'size': .75rem,
@@ -341,7 +341,6 @@ $decelerated-easing: cubic-bezier(0.0, 0, 0.2, 1) !default; // Entering
 $accelerated-easing: cubic-bezier(0.4, 0, 1, 1) !default; // Leaving
 
 // Elements
-$bootable-transition: 0.2s $decelerated-easing !default;
 $blockquote-font-size: 18px !default;
 $blockquote-font-weight: 300 !default;
 

package/lib/styles/tools/_border.sass

@@ -1,8 +1,8 @@
-@mixin border($color: null, $style: null, $width: null, $thin-width: false, $important: false)
+@mixin border($color: null, $style: null, $width: null, $thin-width: false)
   &
-    border-color: $color if($important, !important, null)
-    border-style: $style if($important, !important, null)
-    border-width: $width if($important, !important, null)
+    border-color: $color
+    border-style: $style
+    border-width: $width
 
   @if $thin-width
     &--border

package/lib/styles/tools/_display.sass

@@ -1,16 +1,6 @@
 @use './functions' as *
 @use '../settings' as *
 
-@mixin visually-hidden
-  &
-    position: absolute !important
-    height: 1px
-    width: 1px
-    overflow: hidden
-    clip: rect(1px, 1px, 1px, 1px)
-    white-space: nowrap
-    display: initial
-
 =media-breakpoint-up($name, $breakpoints: $grid-breakpoints)
   $min: breakpoint-min($name, $breakpoints)
   @if $min

package/lib/styles/tools/_elevation.sass

@@ -1,9 +1,9 @@
 @use 'sass:map'
 @use '../settings'
 
-@mixin elevation($z, $important: false)
+@mixin elevation($z)
   &
-    box-shadow: map.get(settings.$shadow-key-umbra, $z), map.get(settings.$shadow-key-penumbra, $z), map.get(settings.$shadow-key-ambient, $z) if($important, !important, null)
+    box-shadow: map.get(settings.$shadow-key-umbra, $z), map.get(settings.$shadow-key-penumbra, $z), map.get(settings.$shadow-key-ambient, $z)
 
 @mixin elevationTransition($duration: 280ms, $easing: cubic-bezier(0.4, 0, 0.2, 1))
   &

package/lib/styles/tools/_index.sass

@@ -1,12 +1,10 @@
 @forward '_absolute'
 @forward '_functions'
-@forward '_bootable'
 @forward '_border'
 @forward '_density'
 @forward '_elevation'
 @forward '_layer'
 @forward '_position'
-@forward '_radius'
 @forward '_rounded'
 @forward '_rtl'
 @forward '_states'

package/lib/styles/tools/_layer.scss

@@ -2,8 +2,10 @@
 
 @mixin layer ($name) {
   @if (settings.$layers) {
-    @layer vuetify.#{$name} {
-      @content;
+    @at-root (without: layer) {
+      @layer vuetify.#{$name} {
+        @content;
+      }
     }
   } @else {
     @content;

package/lib/styles/tools/_position.sass

@@ -1,4 +1,4 @@
-@mixin position($positions, $important: false)
+@mixin position($positions)
   @each $position in $positions
     &--#{$position}
-      position: #{$position} if($important, !important, null)
+      position: #{$position}

package/lib/styles/tools/_rounded.sass

@@ -1,3 +1,3 @@
-@mixin rounded($radius: null, $important: false)
+@mixin rounded($radius: null)
   &
-    border-radius: $radius if($important, !important, null)
+    border-radius: $radius

package/lib/styles/tools/_utilities.sass

@@ -57,8 +57,4 @@
       @if meta.type-of($value) == 'list' and list.length($properties) == list.length($value)
         $val: list.nth($value, $i)
       @if $val != false
-        // Check if unimportant property exists.
-        // This allows you to conditional skip
-        // defining a property as important.
-        $unimportant: map.get($utility, unimportant)
-        #{$property}: #{meta.inspect($val) if(list.index($unimportant, $property), null, !important)}
+        #{$property}: #{meta.inspect($val)}

package/lib/styles/utilities/_elevation.scss

@@ -7,7 +7,7 @@
     $z: 24;
     @while $z >= 0 {
       .elevation-#{$z} {
-        @include tools.elevation($z, $important: true);
+        @include tools.elevation($z);
       }
 
       $z: $z - 1;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@vuetify/nightly",
   "description": "Vue Material Component Framework",
-  "version": "3.9.0-master.2025-07-09",
+  "version": "3.9.0-next.2025-07-09",
   "author": {
     "name": "John Leider",
     "email": "john@vuetifyjs.com"

package/lib/styles/tools/_bootable.sass

@@ -1,3 +0,0 @@
-@mixin bootable()
-  &:not([data-booted="true"])
-    transition: none !important

package/lib/styles/tools/_radius.sass

@@ -1,10 +0,0 @@
-@use 'sass:map'
-@use '../settings'
-
-@mixin radius($r, $important: false)
-  &
-    // Key exists within the $rounded variable
-    @if (map.has-key(settings.$rounded, $r))
-      border-radius: map.get(settings.$rounded, $r) if($important, !important, null)
-    @else
-      border-radius: $r if($important, !important, null)