@vuetify/nightly 3.7.3-next.2024-11-01 → 3.7.4-dev.2024-11-06

package/lib/components/VSelect/VSelect.css

@@ -1,55 +1,53 @@
-@layer vuetify.components {
-  .v-select .v-field .v-text-field__prefix,
-  .v-select .v-field .v-text-field__suffix,
-  .v-select .v-field .v-field__input, .v-select .v-field.v-field {
-    cursor: pointer;
-  }
-  .v-select .v-field .v-field__input > input {
-    align-self: flex-start;
-    opacity: 1;
-    flex: 0 0;
-    position: absolute;
-    width: 100%;
-    transition: none;
-    pointer-events: none;
-    caret-color: transparent;
-  }
-  .v-select .v-field--dirty .v-select__selection {
-    margin-inline-end: 2px;
-  }
-  .v-select .v-select__selection-text {
-    overflow: hidden;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-  }
-  .v-select__content {
-    overflow: hidden;
-  }
-  .v-select__content {
-    box-shadow: 0px 2px 4px -1px var(--v-shadow-key-umbra-opacity, rgba(0, 0, 0, 0.2)), 0px 4px 5px 0px var(--v-shadow-key-penumbra-opacity, rgba(0, 0, 0, 0.14)), 0px 1px 10px 0px var(--v-shadow-key-ambient-opacity, rgba(0, 0, 0, 0.12));
-  }
-  .v-select__content {
-    border-radius: 4px;
-  }
-  .v-select__selection {
-    display: inline-flex;
-    align-items: center;
-    letter-spacing: inherit;
-    line-height: inherit;
-    max-width: 100%;
-  }
-  .v-select .v-select__selection:first-child {
-    margin-inline-start: 0;
-  }
-  .v-select--selected .v-field .v-field__input > input {
-    opacity: 0;
-  }
-  .v-select__menu-icon {
-    margin-inline-start: 4px;
-    transition: 0.2s cubic-bezier(0.4, 0, 0.2, 1);
-  }
-  .v-select--active-menu .v-select__menu-icon {
-    opacity: var(--v-high-emphasis-opacity);
-    transform: rotate(180deg);
-  }
+.v-select .v-field .v-text-field__prefix,
+.v-select .v-field .v-text-field__suffix,
+.v-select .v-field .v-field__input, .v-select .v-field.v-field {
+  cursor: pointer;
+}
+.v-select .v-field .v-field__input > input {
+  align-self: flex-start;
+  opacity: 1;
+  flex: 0 0;
+  position: absolute;
+  width: 100%;
+  transition: none;
+  pointer-events: none;
+  caret-color: transparent;
+}
+.v-select .v-field--dirty .v-select__selection {
+  margin-inline-end: 2px;
+}
+.v-select .v-select__selection-text {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.v-select__content {
+  overflow: hidden;
+}
+.v-select__content {
+  box-shadow: 0px 2px 4px -1px var(--v-shadow-key-umbra-opacity, rgba(0, 0, 0, 0.2)), 0px 4px 5px 0px var(--v-shadow-key-penumbra-opacity, rgba(0, 0, 0, 0.14)), 0px 1px 10px 0px var(--v-shadow-key-ambient-opacity, rgba(0, 0, 0, 0.12));
+}
+.v-select__content {
+  border-radius: 4px;
+}
+.v-select__selection {
+  display: inline-flex;
+  align-items: center;
+  letter-spacing: inherit;
+  line-height: inherit;
+  max-width: 100%;
+}
+.v-select .v-select__selection:first-child {
+  margin-inline-start: 0;
+}
+.v-select--selected .v-field .v-field__input > input {
+  opacity: 0;
+}
+.v-select__menu-icon {
+  margin-inline-start: 4px;
+  transition: 0.2s cubic-bezier(0.4, 0, 0.2, 1);
+}
+.v-select--active-menu .v-select__menu-icon {
+  opacity: var(--v-high-emphasis-opacity);
+  transform: rotate(180deg);
 }

package/lib/components/VSelectionControl/VSelectionControl.css

@@ -1,101 +1,103 @@
-@layer vuetify.components {
-  .v-selection-control {
-    align-items: center;
-    contain: layout;
-    display: flex;
-    flex: 1 0;
-    grid-area: control;
-    position: relative;
-    user-select: none;
-  }
-  .v-selection-control .v-label {
-    white-space: normal;
-    word-break: break-word;
-    height: 100%;
-  }
-  .v-selection-control--disabled {
-    opacity: var(--v-disabled-opacity);
-    pointer-events: none;
-  }
-  .v-selection-control--error .v-label, .v-selection-control--disabled .v-label {
-    opacity: 1;
-  }
-  .v-selection-control--error:not(.v-selection-control--disabled) .v-label {
-    color: rgb(var(--v-theme-error));
-  }
-  .v-selection-control--inline {
-    display: inline-flex;
-    flex: 0 0 auto;
-    min-width: 0;
-    max-width: 100%;
-  }
-  .v-selection-control--inline .v-label {
-    width: auto;
-  }
-  .v-selection-control--density-default {
-    --v-selection-control-size: 40px;
-  }
-  .v-selection-control--density-comfortable {
-    --v-selection-control-size: 36px;
-  }
-  .v-selection-control--density-compact {
-    --v-selection-control-size: 28px;
-  }
-  .v-selection-control__wrapper {
-    width: var(--v-selection-control-size);
-    height: var(--v-selection-control-size);
-    display: inline-flex;
-    align-items: center;
-    position: relative;
-    justify-content: center;
-    flex: none;
-  }
-  .v-selection-control__input {
-    width: var(--v-selection-control-size);
-    height: var(--v-selection-control-size);
-    align-items: center;
-    display: flex;
-    flex: none;
-    justify-content: center;
-    position: relative;
-    border-radius: 50%;
-  }
-  .v-selection-control__input input {
-    cursor: pointer;
-    position: absolute;
-    left: 0;
-    top: 0;
-    width: 100%;
-    height: 100%;
-    opacity: 0;
-  }
-  .v-selection-control__input::before {
-    border-radius: 100%;
-    background-color: currentColor;
-    opacity: 0;
-    pointer-events: none;
-  }
-  .v-selection-control__input::before {
-    content: "";
-    position: absolute;
-    top: 0;
-    left: 0;
-    width: 100%;
-    height: 100%;
-  }
-  .v-selection-control__input:hover::before {
-    opacity: calc(var(--v-hover-opacity) * var(--v-theme-overlay-multiplier));
-  }
-  .v-selection-control__input > .v-icon {
-    opacity: var(--v-medium-emphasis-opacity);
-  }
-  .v-selection-control--disabled .v-selection-control__input > .v-icon, .v-selection-control--dirty .v-selection-control__input > .v-icon, .v-selection-control--error .v-selection-control__input > .v-icon {
-    opacity: 1;
-  }
-  .v-selection-control--error:not(.v-selection-control--disabled) .v-selection-control__input > .v-icon {
-    color: rgb(var(--v-theme-error));
-  }
-  .v-selection-control--focus-visible .v-selection-control__input::before {
-    opacity: calc(var(--v-focus-opacity) * var(--v-theme-overlay-multiplier));
-  }
+.v-selection-control {
+  align-items: center;
+  contain: layout;
+  display: flex;
+  flex: 1 0;
+  grid-area: control;
+  position: relative;
+  user-select: none;
+}
+.v-selection-control .v-label {
+  white-space: normal;
+  word-break: break-word;
+  height: 100%;
+}
+.v-selection-control--disabled {
+  opacity: var(--v-disabled-opacity);
+  pointer-events: none;
+}
+.v-selection-control--error .v-label, .v-selection-control--disabled .v-label {
+  opacity: 1;
+}
+.v-selection-control--error:not(.v-selection-control--disabled) .v-label {
+  color: rgb(var(--v-theme-error));
+}
+.v-selection-control--inline {
+  display: inline-flex;
+  flex: 0 0 auto;
+  min-width: 0;
+  max-width: 100%;
+}
+.v-selection-control--inline .v-label {
+  width: auto;
+}
+.v-selection-control--density-default {
+  --v-selection-control-size: 40px;
+}
+
+.v-selection-control--density-comfortable {
+  --v-selection-control-size: 36px;
+}
+
+.v-selection-control--density-compact {
+  --v-selection-control-size: 28px;
+}
+
+.v-selection-control__wrapper {
+  width: var(--v-selection-control-size);
+  height: var(--v-selection-control-size);
+  display: inline-flex;
+  align-items: center;
+  position: relative;
+  justify-content: center;
+  flex: none;
+}
+
+.v-selection-control__input {
+  width: var(--v-selection-control-size);
+  height: var(--v-selection-control-size);
+  align-items: center;
+  display: flex;
+  flex: none;
+  justify-content: center;
+  position: relative;
+  border-radius: 50%;
+}
+.v-selection-control__input input {
+  cursor: pointer;
+  position: absolute;
+  left: 0;
+  top: 0;
+  width: 100%;
+  height: 100%;
+  opacity: 0;
+}
+.v-selection-control__input::before {
+  border-radius: 100%;
+  background-color: currentColor;
+  opacity: 0;
+  pointer-events: none;
+}
+.v-selection-control__input::before {
+  content: "";
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+}
+.v-selection-control__input:hover::before {
+  opacity: calc(var(--v-hover-opacity) * var(--v-theme-overlay-multiplier));
+}
+.v-selection-control__input > .v-icon {
+  opacity: var(--v-medium-emphasis-opacity);
+}
+.v-selection-control--disabled .v-selection-control__input > .v-icon, .v-selection-control--dirty .v-selection-control__input > .v-icon, .v-selection-control--error .v-selection-control__input > .v-icon {
+  opacity: 1;
+}
+.v-selection-control--error:not(.v-selection-control--disabled) .v-selection-control__input > .v-icon {
+  color: rgb(var(--v-theme-error));
+}
+.v-selection-control--focus-visible .v-selection-control__input::before {
+  opacity: calc(var(--v-focus-opacity) * var(--v-theme-overlay-multiplier));
 }

package/lib/components/VSelectionControlGroup/VSelectionControlGroup.css

@@ -1,11 +1,9 @@
-@layer vuetify.components {
-  .v-selection-control-group {
-    grid-area: control;
-    display: flex;
-    flex-direction: column;
-  }
-  .v-selection-control-group--inline {
-    flex-direction: row;
-    flex-wrap: wrap;
-  }
+.v-selection-control-group {
+  grid-area: control;
+  display: flex;
+  flex-direction: column;
+}
+.v-selection-control-group--inline {
+  flex-direction: row;
+  flex-wrap: wrap;
 }

package/lib/components/VSheet/VSheet.css

@@ -1,39 +1,37 @@
-@layer vuetify.components {
-  .v-sheet {
-    display: block;
-  }
-  .v-sheet {
-    border-color: rgba(var(--v-border-color), var(--v-border-opacity));
-    border-style: solid;
-    border-width: 0;
-  }
-  .v-sheet--border {
-    border-width: thin;
-    box-shadow: none;
-  }
-  .v-sheet {
-    box-shadow: 0px 0px 0px 0px var(--v-shadow-key-umbra-opacity, rgba(0, 0, 0, 0.2)), 0px 0px 0px 0px var(--v-shadow-key-penumbra-opacity, rgba(0, 0, 0, 0.14)), 0px 0px 0px 0px var(--v-shadow-key-ambient-opacity, rgba(0, 0, 0, 0.12));
-  }
-  .v-sheet--absolute {
-    position: absolute;
-  }
-  .v-sheet--fixed {
-    position: fixed;
-  }
-  .v-sheet--relative {
-    position: relative;
-  }
-  .v-sheet--sticky {
-    position: sticky;
-  }
-  .v-sheet {
-    border-radius: 0;
-  }
-  .v-sheet {
-    background: rgb(var(--v-theme-surface));
-    color: rgba(var(--v-theme-on-surface), var(--v-high-emphasis-opacity));
-  }
-  .v-sheet--rounded {
-    border-radius: 4px;
-  }
+.v-sheet {
+  display: block;
+}
+.v-sheet {
+  border-color: rgba(var(--v-border-color), var(--v-border-opacity));
+  border-style: solid;
+  border-width: 0;
+}
+.v-sheet--border {
+  border-width: thin;
+  box-shadow: none;
+}
+.v-sheet {
+  box-shadow: 0px 0px 0px 0px var(--v-shadow-key-umbra-opacity, rgba(0, 0, 0, 0.2)), 0px 0px 0px 0px var(--v-shadow-key-penumbra-opacity, rgba(0, 0, 0, 0.14)), 0px 0px 0px 0px var(--v-shadow-key-ambient-opacity, rgba(0, 0, 0, 0.12));
+}
+.v-sheet--absolute {
+  position: absolute;
+}
+.v-sheet--fixed {
+  position: fixed;
+}
+.v-sheet--relative {
+  position: relative;
+}
+.v-sheet--sticky {
+  position: sticky;
+}
+.v-sheet {
+  border-radius: 0;
+}
+.v-sheet {
+  background: rgb(var(--v-theme-surface));
+  color: rgba(var(--v-theme-on-surface), var(--v-high-emphasis-opacity));
+}
+.v-sheet--rounded {
+  border-radius: 4px;
 }