fix(VListSubheader): background color with fixed subheader

vuetifyjs · Jun 11, 2021 · b431222 · b431222
1 parent ea0aecc
commit b431222
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 3 deletions.
diff --git a/packages/vuetify/src/components/VList/VList.sass b/packages/vuetify/src/components/VList/VList.sass
@@ -41,16 +41,19 @@
   $root: &
 
   align-items: center
+  background: inherit
   display: flex
   font-size: $list-subheader-font-size
   font-weight: $list-subheader-font-weight
   line-height: $list-subheader-line-height
-  opacity: $list-subheader-opacity
   padding-inline-end: $list-subheader-padding-end
   padding-inline-start: $list-subheader-padding-start
   min-height: $list-subheader-min-height
   transition: $list-subheader-transition
 
+  &__text
+    opacity: $list-subheader-opacity
+
   @at-root
     @include density('v-list', $list-density) using ($modifier)
       #{$root}

diff --git a/packages/vuetify/src/components/VList/VListSubheader.tsx b/packages/vuetify/src/components/VList/VListSubheader.tsx
@@ -28,8 +28,13 @@ export default defineComponent({
           textColorClasses.value,
         ]}
         style={{ textColorStyles }}
-        v-slots={ slots }
-      />
+      >
+        { slots.default && (
+          <div class="v-list-subheader__text">
+            { slots.default() }
+          </div>
+        ) }
+      </props.tag>
     )
   },
 })