fix: remove bg-white in separator in dark mode (#634)

This commit is contained in:
yali 2024-06-27 08:21:07 +03:00 committed by GitHub
parent f597d258b0
commit cdfbd51190
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
4 changed files with 4 additions and 4 deletions

View File

@ -27,7 +27,7 @@ const delegatedProps = computed(() => {
> >
<span <span
v-if="props.label" v-if="props.label"
:class="cn('text-xs text-muted-foreground bg-background absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 bg-white flex justify-center items-center', :class="cn('text-xs text-muted-foreground bg-background absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 flex justify-center items-center',
props.orientation === 'vertical' ? 'w-[1px] px-1 py-2' : 'h-[1px] py-1 px-2', props.orientation === 'vertical' ? 'w-[1px] px-1 py-2' : 'h-[1px] py-1 px-2',
)" )"
>{{ props.label }}</span> >{{ props.label }}</span>

View File

@ -29,7 +29,7 @@ const delegatedProps = computed(() => {
v-if="props.label" v-if="props.label"
:class=" :class="
cn( cn(
'text-xs text-muted-foreground bg-background absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 bg-white flex justify-center items-center', 'text-xs text-muted-foreground bg-background absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 flex justify-center items-center',
props.orientation === 'vertical' ? 'w-[1px] px-1 py-2' : 'h-[1px] py-1 px-2', props.orientation === 'vertical' ? 'w-[1px] px-1 py-2' : 'h-[1px] py-1 px-2',
) )
" "

View File

@ -7,7 +7,7 @@
"files": [ "files": [
{ {
"name": "Separator.vue", "name": "Separator.vue",
"content": "<script setup lang=\"ts\">\nimport { type HTMLAttributes, computed } from 'vue'\nimport { Separator, type SeparatorProps } from 'radix-vue'\nimport { cn } from '@/lib/utils'\n\nconst props = defineProps<\n SeparatorProps & { class?: HTMLAttributes['class'], label?: string }\n>()\n\nconst delegatedProps = computed(() => {\n const { class: _, ...delegated } = props\n\n return delegated\n})\n</script>\n\n<template>\n <Separator\n v-bind=\"delegatedProps\"\n :class=\"\n cn(\n 'shrink-0 bg-border relative',\n props.orientation === 'vertical' ? 'w-px h-full' : 'h-px w-full',\n props.class,\n )\n \"\n >\n <span\n v-if=\"props.label\"\n :class=\"cn('text-xs text-muted-foreground bg-background absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 bg-white flex justify-center items-center',\n props.orientation === 'vertical' ? 'w-[1px] px-1 py-2' : 'h-[1px] py-1 px-2',\n )\"\n >{{ props.label }}</span>\n </Separator>\n</template>\n" "content": "<script setup lang=\"ts\">\nimport { type HTMLAttributes, computed } from 'vue'\nimport { Separator, type SeparatorProps } from 'radix-vue'\nimport { cn } from '@/lib/utils'\n\nconst props = defineProps<\n SeparatorProps & { class?: HTMLAttributes['class'], label?: string }\n>()\n\nconst delegatedProps = computed(() => {\n const { class: _, ...delegated } = props\n\n return delegated\n})\n</script>\n\n<template>\n <Separator\n v-bind=\"delegatedProps\"\n :class=\"\n cn(\n 'shrink-0 bg-border relative',\n props.orientation === 'vertical' ? 'w-px h-full' : 'h-px w-full',\n props.class,\n )\n \"\n >\n <span\n v-if=\"props.label\"\n :class=\"cn('text-xs text-muted-foreground bg-background absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 flex justify-center items-center',\n props.orientation === 'vertical' ? 'w-[1px] px-1 py-2' : 'h-[1px] py-1 px-2',\n )\"\n >{{ props.label }}</span>\n </Separator>\n</template>\n"
}, },
{ {
"name": "index.ts", "name": "index.ts",

View File

@ -7,7 +7,7 @@
"files": [ "files": [
{ {
"name": "Separator.vue", "name": "Separator.vue",
"content": "<script setup lang=\"ts\">\nimport { type HTMLAttributes, computed } from 'vue'\nimport { Separator, type SeparatorProps } from 'radix-vue'\nimport { cn } from '@/lib/utils'\n\nconst props = defineProps<\n SeparatorProps & { class?: HTMLAttributes['class'], label?: string }\n>()\n\nconst delegatedProps = computed(() => {\n const { class: _, ...delegated } = props\n\n return delegated\n})\n</script>\n\n<template>\n <Separator\n v-bind=\"delegatedProps\"\n :class=\"\n cn(\n 'shrink-0 bg-border relative',\n props.orientation === 'vertical' ? 'w-px h-full' : 'h-px w-full',\n props.class,\n )\n \"\n >\n <span\n v-if=\"props.label\"\n :class=\"\n cn(\n 'text-xs text-muted-foreground bg-background absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 bg-white flex justify-center items-center',\n props.orientation === 'vertical' ? 'w-[1px] px-1 py-2' : 'h-[1px] py-1 px-2',\n )\n \"\n >{{ props.label }}</span>\n </Separator>\n</template>\n" "content": "<script setup lang=\"ts\">\nimport { type HTMLAttributes, computed } from 'vue'\nimport { Separator, type SeparatorProps } from 'radix-vue'\nimport { cn } from '@/lib/utils'\n\nconst props = defineProps<\n SeparatorProps & { class?: HTMLAttributes['class'], label?: string }\n>()\n\nconst delegatedProps = computed(() => {\n const { class: _, ...delegated } = props\n\n return delegated\n})\n</script>\n\n<template>\n <Separator\n v-bind=\"delegatedProps\"\n :class=\"\n cn(\n 'shrink-0 bg-border relative',\n props.orientation === 'vertical' ? 'w-px h-full' : 'h-px w-full',\n props.class,\n )\n \"\n >\n <span\n v-if=\"props.label\"\n :class=\"\n cn(\n 'text-xs text-muted-foreground bg-background absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 flex justify-center items-center',\n props.orientation === 'vertical' ? 'w-[1px] px-1 py-2' : 'h-[1px] py-1 px-2',\n )\n \"\n >{{ props.label }}</span>\n </Separator>\n</template>\n"
}, },
{ {
"name": "index.ts", "name": "index.ts",