shadcn-vue/apps/www/src/lib/registry/default/ui/sidebar/SidebarInset.vue
zernonia e0d4980e31
feat: Sidebar (1/2) (#827)
* feat: add default sidebar

* chore: add images, docs item

* refactor: rename and fix styling`

* feat: add new-york style

* chore: move typescript to catalog

* docs: fix block preview

* chore: build registry, add sidebar block

* docs: update sidebar demo

* chore: bump radix-vue

* chore: fix build
2024-10-28 01:05:55 +08:00

21 lines
620 B
Vue

<script setup lang="ts">
import type { HTMLAttributes } from 'vue'
import { cn } from '@/lib/utils'
const props = defineProps<{
class?: HTMLAttributes['class']
}>()
</script>
<template>
<main
:class="cn(
'relative flex min-h-svh flex-1 flex-col bg-background',
'peer-data-[variant=inset]:min-h-[calc(100svh-theme(spacing.4))] md:peer-data-[variant=inset]:m-2 md:peer-data-[state=collapsed]:peer-data-[variant=inset]:ml-2 md:peer-data-[variant=inset]:ml-0 md:peer-data-[variant=inset]:rounded-xl md:peer-data-[variant=inset]:shadow',
props.class,
)"
>
<slot />
</main>
</template>