fix(VListItem): fix avatar-badge spacing

fixes #20573
vuetifyjs · Oct 12, 2024 · f7f316f · f7f316f
1 parent ae33530
commit f7f316f
Showing 1 changed file with 16 additions and 10 deletions.
diff --git a/packages/vuetify/src/components/VList/VListItem.sass b/packages/vuetify/src/components/VList/VListItem.sass
@@ -80,11 +80,11 @@
  ~ .v-list-item__spacer
  width: $list-item-icon-margin-start
 
- > .v-avatar ~ .v-list-item__spacer
- width: $list-item-avatar-margin-start
+ > .v-avatar,
+ > .v-badge:has(.v-avatar)
+ ~ .v-list-item__spacer
+ width: $list-item-avatar-margin-start
 
- > .v-list-item-action ~ .v-list-item__spacer
- width: $list-item-action-spacer-width
 
  .v-list-item--slim &
  > .v-badge,
@@ -93,8 +93,10 @@
  ~ .v-list-item__spacer
  width: $list-item-slim-spacer-width
 
- > .v-avatar ~ .v-list-item__spacer
- width: $list-item-slim-avatar-spacer-width
+ > .v-avatar,
+ > .v-badge:has(.v-avatar)
+ ~ .v-list-item__spacer
+ width: $list-item-slim-avatar-spacer-width
 
  > .v-list-item-action ~ .v-list-item__spacer
  width: $list-item-slim-action-spacer-width
@@ -118,8 +120,10 @@
  ~ .v-list-item__spacer
  width: $list-item-icon-margin-end
 
- > .v-avatar ~ .v-list-item__spacer
- width: $list-item-avatar-margin-end
+ > .v-avatar,
+ > .v-badge:has(.v-avatar)
+ ~ .v-list-item__spacer
+ width: $list-item-avatar-margin-end
 
  > .v-list-item-action ~ .v-list-item__spacer
  width: $list-item-action-spacer-width
@@ -131,8 +135,10 @@
  ~ .v-list-item__spacer
  width: $list-item-slim-spacer-width
 
- > .v-avatar ~ .v-list-item__spacer
- width: $list-item-slim-avatar-spacer-width
+ > .v-avatar,
+ > .v-badge:has(.v-avatar)
+ ~ .v-list-item__spacer
+ width: $list-item-slim-avatar-spacer-width
 
  > .v-list-item-action ~ .v-list-item__spacer
  width: $list-item-slim-action-spacer-width