Skip to content

Commit ea5a429

Browse files
committed
docs: add scrim integration section to use-stack
1 parent 456f393 commit ea5a429

File tree

1 file changed

+16
-0
lines changed

1 file changed

+16
-0
lines changed

apps/docs/src/pages/composables/plugins/use-stack.md

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -41,6 +41,22 @@ app.mount('#app')
4141
> [!TIP]
4242
> For client-side only apps, you can skip plugin installation and use the default `stack` singleton directly. The plugin is required for SSR to ensure each request gets its own stack instance.
4343
44+
## Scrim Integration
45+
46+
Use the [Scrim](/components/providers/scrim) component alongside `useStack` to provide a backdrop for your overlays. The Scrim automatically positions itself below the topmost overlay:
47+
48+
```vue
49+
<script setup lang="ts">
50+
import { Scrim } from '@vuetify/v0'
51+
</script>
52+
53+
<template>
54+
<Scrim class="fixed inset-0 bg-black/50" />
55+
</template>
56+
```
57+
58+
The Scrim reads from the same stack context, so its z-index is always coordinated with your registered overlays.
59+
4460
## Usage
4561

4662
Use the `useStack` composable to register an overlay and receive its z-index and position in the stack:

0 commit comments

Comments
 (0)