perf: 根据tailwindcss推荐优化类名

This commit is contained in:
xiaoxian521
2025-12-08 15:44:00 +08:00
parent aeb4feb6f9
commit d794c7965c
12 changed files with 128 additions and 16 deletions

View File

@@ -51,7 +51,7 @@ onBeforeUnmount(() => {
<div class="right-panel-background" />
<div ref="target" class="right-panel bg-bg_color">
<div
class="project-configuration border-0 border-b-[1px] border-solid border-[var(--pure-border-color)]"
class="project-configuration border-0 border-b-[1px] border-solid border-(--pure-border-color)"
>
<h4 class="dark:text-white">
{{ t("panel.pureSystemSet") }}
@@ -78,7 +78,7 @@ onBeforeUnmount(() => {
</el-scrollbar>
<div
class="flex justify-end p-3 border-0 border-t-[1px] border-solid border-[var(--pure-border-color)]"
class="flex justify-end p-3 border-0 border-t-[1px] border-solid border-(--pure-border-color)"
>
<el-button
v-tippy="{

View File

@@ -416,7 +416,7 @@ onUnmounted(() => removeMatchMedia);
<button
v-else
v-ripple="{ class: 'text-gray-300' }"
class="bg-transparent flex-c w-full h-20 rounded-md border border-[var(--pure-border-color)]"
class="bg-transparent flex-c w-full h-20 rounded-md border border-(--pure-border-color)"
@click="setStretch(!settings.stretch)"
>
<div

View File

@@ -70,16 +70,16 @@ getMine().then(res => {
<el-container class="h-full">
<el-aside
v-if="isOpen"
class="pure-account-settings overflow-hidden px-2 dark:bg-(--el-bg-color)! border-r-[1px] border-[var(--pure-border-color)]"
class="pure-account-settings overflow-hidden px-2 dark:bg-(--el-bg-color)! border-r-[1px] border-(--pure-border-color)"
:width="deviceDetection() ? '180px' : '240px'"
>
<el-menu :default-active="witchPane" class="pure-account-settings-menu">
<div
class="h-[50px]! text-[var(--pure-theme-menu-text)] cursor-pointer text-sm transition-all duration-300 ease-in-out hover:scale-105 will-change-transform transform-gpu origin-center hover:text-base! hover:text-[var(--pure-theme-menu-title-hover)]!"
class="h-[50px]! text-(--pure-theme-menu-text) cursor-pointer text-sm transition-all duration-300 ease-in-out hover:scale-105 will-change-transform transform-gpu origin-center hover:text-base! hover:text-(--pure-theme-menu-title-hover)!"
@click="router.go(-1)"
>
<div
class="h-full flex items-center px-[var(--el-menu-base-level-padding)]"
class="h-full flex items-center px-(--el-menu-base-level-padding)"
>
<IconifyIconOffline :icon="leftLine" />
<span class="ml-2">返回</span>

View File

@@ -38,7 +38,7 @@ const handleChange = value => {
<el-row :gutter="24">
<el-col :xl="12" :lg="12" :md="24" :sm="24" :xs="24">
<div class="flex flex-col items-center justify-center">
<span class="text-[var(--el-color-primary)]">
<span class="text-(--el-color-primary)">
1. 二级联动不带全部选项
<el-cascader
v-model="selectedOptions1"
@@ -67,7 +67,7 @@ const handleChange = value => {
</el-col>
<el-col :xl="12" :lg="12" :md="24" :sm="24" :xs="24">
<div class="flex flex-col items-center justify-center mt-3">
<span class="text-[var(--el-color-primary)]">
<span class="text-(--el-color-primary)">
2. 二级联动带有全部选项
<el-cascader
v-model="selectedOptions3"
@@ -96,7 +96,7 @@ const handleChange = value => {
</el-col>
<el-col :xl="12" :lg="12" :md="24" :sm="24" :xs="24">
<div class="flex flex-col items-center justify-center mt-3">
<span class="text-[var(--el-color-primary)]">
<span class="text-(--el-color-primary)">
3. 三级联动不带全部选项
<el-cascader
v-model="selectedOptions2"
@@ -127,7 +127,7 @@ const handleChange = value => {
</el-col>
<el-col :xl="12" :lg="12" :md="24" :sm="24" :xs="24">
<div class="flex flex-col items-center justify-center mt-3">
<span class="text-[var(--el-color-primary)]">
<span class="text-(--el-color-primary)">
4. 三级联动"全部选项"
<el-cascader
v-model="selectedOptions4"

View File

@@ -190,7 +190,7 @@ const onDownload = () => {
class="el-upload-list__item-delete"
@click="handleRemove(file)"
>
<span title="移除" class="hover:text-[var(--el-color-danger)]">
<span title="移除" class="hover:text-(--el-color-danger)">
<IconifyIconOffline
:icon="Delete"
class="hover:scale-125 duration-100"

View File

@@ -103,7 +103,7 @@ const {
<div
v-if="selectedNum > 0"
v-motion-fade
class="bg-[var(--el-fill-color-light)] w-full h-[46px] mb-2 pl-4 flex items-center"
class="bg-(--el-fill-color-light) w-full h-[46px] mb-2 pl-4 flex items-center"
>
<div class="flex-auto">
<span

View File

@@ -103,7 +103,7 @@ const {
<div
v-if="selectedNum > 0"
v-motion-fade
class="bg-[var(--el-fill-color-light)] w-full h-[46px] mb-2 pl-4 flex items-center"
class="bg-(--el-fill-color-light) w-full h-[46px] mb-2 pl-4 flex items-center"
>
<div class="flex-auto">
<span

View File

@@ -95,7 +95,7 @@ const {
<div
v-if="selectedNum > 0"
v-motion-fade
class="bg-[var(--el-fill-color-light)] w-full h-[46px] mb-2 pl-4 flex items-center"
class="bg-(--el-fill-color-light) w-full h-[46px] mb-2 pl-4 flex items-center"
>
<div class="flex-auto">
<span

View File

@@ -128,7 +128,7 @@ const {
<div
v-if="selectedNum > 0"
v-motion-fade
class="bg-[var(--el-fill-color-light)] w-full h-[46px] mb-2 pl-4 flex items-center"
class="bg-(--el-fill-color-light) w-full h-[46px] mb-2 pl-4 flex items-center"
>
<div class="flex-auto">
<span