Updated list style
This commit is contained in:
@@ -31,7 +31,7 @@ const forwarded = useForwardPropsEmits(delegatedProps, emits)
|
||||
v-bind="forwarded"
|
||||
:class="
|
||||
cn(
|
||||
'fixed left-1/2 top-1/2 z-50 grid w-[calc(100%-2rem)] max-w-3xl -translate-x-1/2 -translate-y-1/2 gap-4 border border-indigo-200 bg-background dark:bg-slate-950 dark:border-indigo-950 p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-50% data-[state=closed]:slide-out-to-top-48% data-[state=open]:slide-in-from-left-50% data-[state=open]:slide-in-from-top-48% sm:rounded-lg',
|
||||
'fixed left-1/2 top-1/2 z-50 grid w-[calc(100%-2rem)] max-w-3xl -translate-x-1/2 -translate-y-1/2 gap-4 border border-indigo-200 bg-background dark:bg-slate-950 dark:border-indigo-950 p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-50% data-[state=closed]:slide-out-to-top-48% data-[state=open]:slide-in-from-left-50% data-[state=open]:slide-in-from-top-48% rounded-lg',
|
||||
props.class,
|
||||
)
|
||||
"
|
||||
|
||||
@@ -33,7 +33,7 @@ const forwarded = useForwardPropsEmits(delegatedProps, emits)
|
||||
v-bind="forwarded"
|
||||
:class="
|
||||
cn(
|
||||
'fixed left-1/2 top-1/2 z-50 grid w-[calc(100%-2rem)] max-w-4xl -translate-x-1/2 -translate-y-1/2 gap-4 border bg-background border-indigo-200 dark:bg-slate-950 dark:border-indigo-950 p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-50% data-[state=closed]:slide-out-to-top-48% data-[state=open]:slide-in-from-left-50% data-[state=open]:slide-in-from-top-48% sm:rounded-lg',
|
||||
'fixed left-1/2 top-1/2 z-50 grid w-[calc(100%-2rem)] max-w-4xl -translate-x-1/2 -translate-y-1/2 gap-4 border bg-background border-indigo-200 dark:bg-slate-950 dark:border-indigo-950 p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-50% data-[state=closed]:slide-out-to-top-48% data-[state=open]:slide-in-from-left-50% data-[state=open]:slide-in-from-top-48% rounded-lg',
|
||||
props.class
|
||||
)
|
||||
"
|
||||
|
||||
@@ -32,7 +32,7 @@ const forwarded = useForwardPropsEmits(delegatedProps, emits)
|
||||
<DialogContent
|
||||
:class="
|
||||
cn(
|
||||
'relative z-50 grid w-full max-w-lg my-8 gap-4 border border-border bg-background p-6 shadow-lg duration-200 sm:rounded-lg md:w-full',
|
||||
'relative z-50 grid w-full max-w-lg my-8 gap-4 border border-border bg-background p-6 shadow-lg duration-200 rounded-lg md:w-full',
|
||||
props.class
|
||||
)
|
||||
"
|
||||
|
||||
@@ -16,7 +16,7 @@ const delegatedProps = computed(() => {
|
||||
<template>
|
||||
<PaginationEllipsis
|
||||
v-bind="delegatedProps"
|
||||
:class="cn('size-9 flex items-center justify-center', props.class)"
|
||||
:class="cn('size-8 md:size-10 flex items-center justify-center', props.class)"
|
||||
>
|
||||
<slot>
|
||||
<PhArrowsHorizontal />
|
||||
|
||||
@@ -21,7 +21,7 @@ const delegatedProps = computed(() => {
|
||||
|
||||
<template>
|
||||
<PaginationFirst v-bind="delegatedProps">
|
||||
<Button :class="cn('w-10 h-10 p-0', props.class)" variant="outline">
|
||||
<Button :class="cn('size-8 md:size-10 p-0', props.class)" variant="outline">
|
||||
<slot>
|
||||
<PhCaretDoubleLeft class="size-4" />
|
||||
</slot>
|
||||
|
||||
@@ -21,7 +21,7 @@ const delegatedProps = computed(() => {
|
||||
|
||||
<template>
|
||||
<PaginationLast v-bind="delegatedProps">
|
||||
<Button :class="cn('size-10 p-0', props.class)" variant="outline">
|
||||
<Button :class="cn('size-8 md:size-10 p-0', props.class)" variant="outline">
|
||||
<slot>
|
||||
<PhCaretDoubleRight class="size-4" />
|
||||
</slot>
|
||||
|
||||
@@ -21,7 +21,7 @@ const delegatedProps = computed(() => {
|
||||
|
||||
<template>
|
||||
<PaginationNext v-bind="delegatedProps">
|
||||
<Button :class="cn('size-10 p-0', props.class)" variant="outline">
|
||||
<Button :class="cn('size-8 md:size-10 p-0', props.class)" variant="outline">
|
||||
<slot>
|
||||
<PhCaretRight class="size-4" />
|
||||
</slot>
|
||||
|
||||
@@ -21,7 +21,7 @@ const delegatedProps = computed(() => {
|
||||
|
||||
<template>
|
||||
<PaginationPrev v-bind="delegatedProps">
|
||||
<Button :class="cn('size-10 p-0', props.class)" variant="outline">
|
||||
<Button :class="cn('size-8 md:size-10 p-0', props.class)" variant="outline">
|
||||
<slot>
|
||||
<PhCaretLeft class="size-4" />
|
||||
</slot>
|
||||
|
||||
Reference in New Issue
Block a user