lq/lgp-admin-plus
1
0
Fork 0
Code Issues Pull Requests Actions 4 Packages Projects Releases Wiki Activity

refactor: migrate spacing utilities to tailwind v4 syntax

Browse Source
This commit is contained in:
xingyu4j
2026-03-14 18:27:16 +08:00
parent b9467b2bc3
commit 2823848fae
27 changed files with 45 additions and 45 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
packages/@core/ui-kit/shadcn-ui/src/components/breadcrumb/breadcrumb-background.vue
View File

@@ -57,7 +57,7 @@ li {
}
li a {
@apply bg-accent text-muted-foreground relative mr-9 flex h-7 items-center py-0 pr-2 pl-[5px] text-[13px];
@apply bg-accent text-muted-foreground relative mr-9 flex h-7 items-center py-0 pr-2 pl-1.25 text-[13px];
}
li a > span {
@@ -69,7 +69,7 @@ li:first-child a > span {
}
li:first-child a {
@apply rounded-[4px_0_0_4px] pl-[15px];
@apply rounded-l-sm pl-3.75;
}
li:first-child a::before {
@@ -77,7 +77,7 @@ li:first-child a::before {
}
li:last-child a {
@apply rounded-[0_4px_4px_0] pr-[15px];
@apply rounded-r-sm pr-3.75;
}
li:last-child a::after {
@@ -86,7 +86,7 @@ li:last-child a::after {
li a::before,
li a::after {
@apply border-accent absolute top-0 h-0 w-0 border-[.875rem] border-solid content-[''];
@apply border-accent absolute top-0 h-0 w-0 border-14 border-solid content-[''];
}
li a::before {

2
packages/@core/ui-kit/shadcn-ui/src/components/spinner/spinner.vue
View File

@@ -75,7 +75,7 @@ function onTransitionEnd() {
<div
:class="{ paused: !renderSpinner }"
v-if="renderSpinner"
class="loader before:bg-primary/50 after:bg-primary relative size-12 before:absolute before:top-[60px] before:left-0 before:h-[5px] before:w-12 before:rounded-[50%] before:content-[''] after:absolute after:top-0 after:left-0 after:h-full after:w-full after:rounded after:content-['']"
class="loader before:bg-primary/50 after:bg-primary relative size-12 before:absolute before:top-15 before:left-0 before:h-1.25 before:w-12 before:rounded-full before:content-[''] after:absolute after:top-0 after:left-0 after:h-full after:w-full after:rounded after:content-['']"
></div>
</div>
</template>

2
packages/@core/ui-kit/tabs-ui/src/tabs-view.vue
View File

@@ -65,7 +65,7 @@ useTabsDrag(props, emit);
<div
:class="{
'pt-[3px]': styleType === 'chrome',
'pt-0.75': styleType === 'chrome',
}"
class="size-full flex-1 overflow-hidden"
>

4
packages/effects/common-ui/src/components/icon-picker/icon-picker.vue
View File

@@ -246,7 +246,7 @@ defineExpose({ toggleOpenState, open, close });
</div>
<template v-if="paginationList.length > 0">
<div class="grid max-h-[360px] w-full grid-cols-6 justify-items-center">
<div class="grid max-h-90 w-full grid-cols-6 justify-items-center">
<VbenIconButton
v-for="(item, index) in paginationList"
:key="index"
@@ -309,7 +309,7 @@ defineExpose({ toggleOpenState, open, close });
</template>
<template v-else>
<div class="flex-col-center min-h-[150px] w-full text-muted-foreground">
<div class="flex-col-center min-h-37.5 w-full text-muted-foreground">
<EmptyIcon class="size-10" />
<div class="mt-1 text-sm">{{ $t('common.noData') }}</div>
</div>

2
packages/effects/common-ui/src/ui/authentication/dingding-login.vue
View File

@@ -25,7 +25,7 @@ const [Modal, modalApi] = useVbenModal({
header: false,
footer: false,
fullscreenButton: false,
class: 'w-[302px] h-[302px] dingding-qrcode-login-modal',
class: 'size-75.5 dingding-qrcode-login-modal',
onOpened() {
handleQrCodeLogin();
},

2
packages/effects/common-ui/src/ui/authentication/login-expired-modal.vue
View File

@@ -78,7 +78,7 @@ function calcZIndex() {
:fullscreen-button="false"
:header="false"
:z-index="getZIndex"
class="border-none px-10 py-6 text-center shadow-xl sm:w-[600px] sm:rounded-2xl md:h-[unset]"
class="border-none px-10 py-6 text-center shadow-xl sm:w-150 sm:rounded-2xl md:h-[unset]"
>
<VbenAvatar :src="avatar" class="mx-auto mb-6 size-20" />
<Slot

2
packages/effects/layouts/src/widgets/global-search/global-search.vue
View File

@@ -101,7 +101,7 @@ onMounted(() => {
<div>
<Modal
:fullscreen-button="false"
class="w-[600px]"
class="w-150"
header-class="py-2 border-b"
>
<template #title>

2
packages/effects/layouts/src/widgets/global-search/search-panel.vue
View File

@@ -223,7 +223,7 @@ onMounted(() => {
<template>
<VbenScrollbar>
<div class="flex! h-full justify-center px-2 sm:max-h-[450px]">
<div class="flex! h-full justify-center px-2 sm:max-h-112.5">
<!-- 无搜索结果 -->
<div
v-if="keyword && searchResults.length === 0"

6
packages/effects/layouts/src/widgets/lock-screen/lock-screen.vue
View File

@@ -103,7 +103,7 @@ useScrollLock();
<div class="flex-center size-full">
<div class="flex w-full justify-center gap-4 px-4 sm:gap-6 md:gap-8">
<div
class="relative flex-center h-[140px] w-[140px] rounded-xl bg-accent text-[36px] sm:h-[160px] sm:w-[160px] sm:text-[42px] md:h-[200px] md:w-[200px] md:text-[72px]"
class="relative flex-center h-35 w-35 rounded-xl bg-accent text-[36px] sm:h-40 sm:w-40 sm:text-[42px] md:h-50 md:w-50 md:text-[72px]"
>
<span
class="absolute top-3 left-3 text-xs font-semibold sm:text-sm md:text-xl"
@@ -113,7 +113,7 @@ useScrollLock();
{{ hour }}
</div>
<div
class="flex-center h-[140px] w-[140px] rounded-xl bg-accent text-[36px] sm:h-[160px] sm:w-[160px] sm:text-[42px] md:h-[200px] md:w-[200px] md:text-[72px]"
class="flex-center h-35 w-35 rounded-xl bg-accent text-[36px] sm:h-40 sm:w-40 sm:text-[42px] md:h-50 md:w-50 md:text-[72px]"
>
{{ minute }}
</div>
@@ -128,7 +128,7 @@ useScrollLock();
class="flex-center size-full"
@keydown.enter.prevent="handleSubmit"
>
<div class="mb-10 flex-col-center w-[90%] max-w-[300px] px-4">
<div class="mb-10 flex-col-center w-[90%] max-w-75 px-4">
<VbenAvatar :src="avatar" class="enter-x mb-6 size-20" />
<div class="enter-x mb-2 w-full items-center">
<Form />

6
packages/effects/layouts/src/widgets/notification/notification.vue
View File

@@ -89,7 +89,7 @@ function navigateTo(
<template>
<VbenPopover
v-model:open="open"
content-class="relative right-2 w-[360px] p-0"
content-class="relative right-2 w-90 p-0"
>
<template #trigger>
<div class="mr-2 flex-center h-full" @click.stop="toggle()">
@@ -115,7 +115,7 @@ function navigateTo(
</VbenIconButton>
</div>
<VbenScrollbar v-if="notifications.length > 0">
<ul class="flex! max-h-[360px] w-full flex-col">
<ul class="flex! max-h-90 w-full flex-col">
<template v-for="item in notifications" :key="item.id ?? item.title">
<li
class="relative flex w-full cursor-pointer items-start gap-5 border-t border-border p-3 hover:bg-accent"
@@ -173,7 +173,7 @@ function navigateTo(
</VbenScrollbar>
<template v-else>
<div class="flex-center min-h-[150px] w-full text-muted-foreground">
<div class="flex-center min-h-37.5 w-full text-muted-foreground">
{{ $t('common.noData') }}
</div>
</template>

2
packages/effects/layouts/src/widgets/preferences/blocks/checkbox-item.vue
View File

@@ -53,7 +53,7 @@ const slots = useSlots();
</span>
<VbenCheckButtonGroup
v-model="inputValue"
class="h-8 w-[165px]"
class="h-8 w-41.25"
:options="items"
:disabled="disabled"
:multiple="multiple"

2
packages/effects/layouts/src/widgets/preferences/blocks/input-item.vue
View File

@@ -50,7 +50,7 @@ const slots = useSlots();
<div class="relative">
<Input
v-model="inputValue"
class="h-8 w-[165px]"
class="h-8 w-41.25"
:placeholder="placeholder"
/>
<CircleX

2
packages/effects/layouts/src/widgets/preferences/blocks/layout/content.vue
View File

@@ -38,7 +38,7 @@ function activeClass(theme: string): string[] {
<div class="flex w-full gap-5">
<template v-for="theme in PRESET" :key="theme.name">
<div
class="flex w-[100px] cursor-pointer flex-col"
class="flex w-25 cursor-pointer flex-col"
@click="modelValue = theme.type"
>
<div :class="activeClass(theme.type)" class="outline-box flex-center">

2
packages/effects/layouts/src/widgets/preferences/blocks/layout/layout.vue
View File

@@ -89,7 +89,7 @@ function activeClass(theme: string): string[] {
<div class="flex w-full flex-wrap gap-5">
<template v-for="theme in PRESET" :key="theme.name">
<div
class="flex w-[100px] cursor-pointer flex-col"
class="flex w-25 cursor-pointer flex-col"
@click="modelValue = theme.type"
>
<div :class="activeClass(theme.type)" class="outline-box flex-center">

2
packages/effects/layouts/src/widgets/preferences/blocks/number-field-item.vue
View File

@@ -63,7 +63,7 @@ const slots = useSlots();
</VbenTooltip>
</span>
<NumberField v-model="inputValue" v-bind="$attrs" class="w-[165px]">
<NumberField v-model="inputValue" v-bind="$attrs" class="w-41.25">
<NumberFieldContent>
<NumberFieldDecrement />
<NumberFieldInput />

2
packages/effects/layouts/src/widgets/preferences/blocks/select-item.vue
View File

@@ -55,7 +55,7 @@ const slots = useSlots();
</VbenTooltip>
</span>
<Select v-model="selectValue">
<SelectTrigger class="h-8 w-[165px]">
<SelectTrigger class="h-8 w-41.25">
<SelectValue :placeholder="placeholder" />
</SelectTrigger>
<SelectContent>

2
packages/effects/layouts/src/widgets/user-dropdown/user-dropdown.vue
View File

@@ -203,7 +203,7 @@ if (enableShortcutKey.value) {
</div>
</div>
</DropdownMenuTrigger>
<DropdownMenuContent class="mr-2 min-w-[240px] p-0 pb-1">
<DropdownMenuContent class="mr-2 min-w-60 p-0 pb-1">
<div ref="refContent">
<DropdownMenuLabel class="flex items-center p-3">
<VbenAvatar