fix(VListGroup): missing hover overlay

[nekosaur]

Description

not at all sure this is the way to fix it

closes #16830

Markup:

<template>
  <v-card
    class="mx-auto"
    width="300"
  >
    <v-list v-model:opened="open">
      <v-list-item prepend-icon="mdi-home" title="Home"></v-list-item>

      <v-list-group value="Users">
        <template v-slot:activator="{ props }">
          <v-list-item
            v-bind="props"
            prepend-icon="mdi-account-circle"
            title="Users"
          ></v-list-item>
        </template>

        <v-list-group value="Admin">
          <template v-slot:activator="{ props }">
            <v-list-item
              v-bind="props"
              title="Admin"
            ></v-list-item>
          </template>

          <v-list-item
            v-for="([title, icon], i) in admins"
            :key="i"
            :title="title"
            :prepend-icon="icon"
            :value="title"
          ></v-list-item>
        </v-list-group>
      </v-list-group>
    </v-list>
  </v-card>
</template>

<script setup>
 	import { ref } from 'vue';
	const open = ref(['Users']);
 	const admins = [
    ['Management', 'mdi-account-multiple-outline'],
    ['Settings', 'mdi-cog-outline'],
  ];
  </script>

[KaelWD]

Another option would be to just add :not(:hover) if we're ok with it being darker

[KaelWD]

I think active-variant might fix this too

[johnleider]

I cannot tell the difference from master and the PR.

[nekosaur]

When hovering over group item

Before

After

Not sure what you mean by active-variant @KaelWD

[johnleider]

active-variant is a concept I proposed where you can have a variant applied at default and when the item is active.

[johnleider]

Another option would be to just add :not(:hover) if we're ok with it being darker

Following up on the status of this.