yudao
/
admin-vben
mirror of https://gitee.com/yudaocode/yudao-ui-admin-vben.git
3
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

perf: update menu icons (#4357)

pull/48/MERGE
Li Kui 2024-09-11 16:23:24 +08:00 committed by GitHub
parent ceb52aad7f
commit 8f6bf6add3
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
15 changed files with 54 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
apps/web-antd/src/router/routes/modules/dashboard.ts
View File

@ -29,6 +29,7 @@ const routes: RouteRecordRaw[] = [
path: '/workspace',
component: () => import('#/views/dashboard/workspace/index.vue'),
meta: {
icon: 'carbon:workspace',
title: $t('page.dashboard.workspace'),
},
},

2
apps/web-antd/src/router/routes/modules/vben.ts
View File

@ -58,6 +58,7 @@ const routes: RouteRecordRaw[] = [
component: IFrameView,
meta: {
badgeType: 'dot',
icon: 'logos:naiveui',
link: VBEN_NAIVE_PREVIEW_URL,
title: $t('page.vben.naive-ui'),
},
@ -68,6 +69,7 @@ const routes: RouteRecordRaw[] = [
component: IFrameView,
meta: {
badgeType: 'dot',
icon: 'logos:element',
link: VBEN_ELE_PREVIEW_URL,
title: $t('page.vben.element-plus'),
},

1
apps/web-ele/src/router/routes/modules/dashboard.ts
View File

@ -29,6 +29,7 @@ const routes: RouteRecordRaw[] = [
path: '/workspace',
component: () => import('#/views/dashboard/workspace/index.vue'),
meta: {
icon: 'carbon:workspace',
title: $t('page.dashboard.workspace'),
},
},

3
apps/web-ele/src/router/routes/modules/vben.ts
View File

@ -7,6 +7,7 @@ import {
VBEN_LOGO_URL,
VBEN_NAIVE_PREVIEW_URL,
} from '@vben/constants';
import { SvgAntdvLogoIcon } from '@vben/icons';
import { BasicLayout, IFrameView } from '#/layouts';
import { $t } from '#/locales';
@ -58,6 +59,7 @@ const routes: RouteRecordRaw[] = [
component: IFrameView,
meta: {
badgeType: 'dot',
icon: 'logos:naiveui',
link: VBEN_NAIVE_PREVIEW_URL,
title: $t('page.vben.naive-ui'),
},
@ -68,6 +70,7 @@ const routes: RouteRecordRaw[] = [
component: IFrameView,
meta: {
badgeType: 'dot',
icon: SvgAntdvLogoIcon,
link: VBEN_ANT_PREVIEW_URL,
title: $t('page.vben.antdv'),
},

1
apps/web-naive/src/router/routes/modules/dashboard.ts
View File

@ -29,6 +29,7 @@ const routes: RouteRecordRaw[] = [
path: '/workspace',
component: () => import('#/views/dashboard/workspace/index.vue'),
meta: {
icon: 'carbon:workspace',
title: $t('page.dashboard.workspace'),
},
},

3
apps/web-naive/src/router/routes/modules/vben.ts
View File

@ -7,6 +7,7 @@ import {
VBEN_GITHUB_URL,
VBEN_LOGO_URL,
} from '@vben/constants';
import { SvgAntdvLogoIcon } from '@vben/icons';
import { BasicLayout, IFrameView } from '#/layouts';
import { $t } from '#/locales';
@ -58,6 +59,7 @@ const routes: RouteRecordRaw[] = [
component: IFrameView,
meta: {
badgeType: 'dot',
icon: SvgAntdvLogoIcon,
link: VBEN_ANT_PREVIEW_URL,
title: $t('page.vben.antdv'),
},
@ -68,6 +70,7 @@ const routes: RouteRecordRaw[] = [
component: IFrameView,
meta: {
badgeType: 'dot',
icon: 'logos:element',
link: VBEN_ELE_PREVIEW_URL,
title: $t('page.vben.element-plus'),
},

2
packages/@core/ui-kit/menu-ui/src/components/menu-item.vue
View File

@ -113,7 +113,7 @@ onBeforeUnmount(() => {
class="right-2"
v-bind="props"
/>
<VbenIcon :class="nsMenu.e('icon')" :icon="menuIcon" fallback />
<VbenIcon :class="nsMenu.e('icon')" :icon="menuIcon" />
<slot></slot>
<slot name="title"></slot>
</div>

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

@ -31,7 +31,6 @@ function handleClick(path?: string) {
<span class="flex-center z-10 h-full">
<VbenIcon
v-if="showIcon"
:fallback="showIcon"
:icon="item.icon"
class="mr-1 size-4 flex-shrink-0"
/>

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

@ -47,12 +47,7 @@ function handleClick(path?: string) {
<div v-if="item.items?.length ?? 0 > 0">
<DropdownMenu>
<DropdownMenuTrigger class="flex items-center gap-1">
<VbenIcon
v-if="showIcon"
:fallback="showIcon"
:icon="item.icon"
class="size-5"
/>
<VbenIcon v-if="showIcon" :icon="item.icon" class="size-5" />
{{ item.title }}
<ChevronDown class="size-4" />
</DropdownMenuTrigger>
@ -77,7 +72,6 @@ function handleClick(path?: string) {
<VbenIcon
v-if="showIcon"
:class="{ 'size-5': item.isHome }"
:fallback="showIcon"
:icon="item.icon"
class="mr-1 size-4"
/>
@ -89,7 +83,6 @@ function handleClick(path?: string) {
<VbenIcon
v-if="showIcon"
:class="{ 'size-5': item.isHome }"
:fallback="showIcon"
:icon="item.icon"
class="mr-1 size-4"
/>

1
packages/@core/ui-kit/tabs-ui/src/components/tabs-chrome/tabs.vue
View File

@ -134,7 +134,6 @@ const tabsView = computed((): TabConfig[] => {
v-if="showIcon"
:icon="tab.icon"
class="mr-1 flex size-4 items-center overflow-hidden"
fallback
/>
<span class="flex-1 overflow-hidden whitespace-nowrap text-sm">

29
packages/icons/src/svg/icons/antdv-logo.svg Normal file
View File

@ -0,0 +1,29 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="128px" height="128px" viewBox="0 0 128 128" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 52.6 (67491) - http://www.bohemiancoding.com/sketch -->
<title>Vue</title>
<desc>Created with Sketch.</desc>
<defs>
<linearGradient x1="69.644116%" y1="0%" x2="69.644116%" y2="100%" id="linearGradient-1">
<stop stop-color="#29CDFF" offset="0%"></stop>
<stop stop-color="#148EFF" offset="37.8600687%"></stop>
<stop stop-color="#0A60FF" offset="100%"></stop>
</linearGradient>
<linearGradient x1="-19.8191553%" y1="-36.7931464%" x2="138.57919%" y2="157.637507%" id="linearGradient-2">
<stop stop-color="#29CDFF" offset="0%"></stop>
<stop stop-color="#0F78FF" offset="100%"></stop>
</linearGradient>
<linearGradient x1="68.1279872%" y1="-35.6905737%" x2="30.4400914%" y2="114.942679%" id="linearGradient-3">
<stop stop-color="#FA8E7D" offset="0%"></stop>
<stop stop-color="#F74A5C" offset="51.2635191%"></stop>
<stop stop-color="#F51D2C" offset="100%"></stop>
</linearGradient>
</defs>
<g id="Vue" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="Group" transform="translate(19.000000, 9.000000)">
<path d="M89.96,90.48 C78.58,93.48 68.33,83.36 67.62,82.48 L46.6604487,62.2292258 C45.5023849,61.1103236 44.8426845,59.5728835 44.8296987,57.9626396 L44.5035564,17.5209948 C44.4948861,16.4458744 44.0537714,15.4195095 43.2796864,14.6733517 L29.6459999,1.53153737 C28.055475,-0.00160504005 25.5232423,0.0449126588 23.9900999,1.63543756 C23.2715121,2.38092066 22.87,3.37600834 22.87,4.41143746 L22.87,64.3864751 C22.87,67.0807891 23.9572233,69.6611067 25.885409,71.5429748 L63.6004615,108.352061 C65.9466323,110.641873 69.6963584,110.624605 72.0213403,108.313281" id="Path-Copy" fill="url(#linearGradient-1)" fill-rule="nonzero" transform="translate(56.415000, 54.831157) scale(-1, 1) translate(-56.415000, -54.831157) "></path>
<path d="M68,90.1163122 C56.62,93.1163122 45.46,83.36 44.75,82.48 L23.7904487,62.2292258 C22.6323849,61.1103236 21.9726845,59.5728835 21.9596987,57.9626396 L21.6335564,17.5209948 C21.6248861,16.4458744 21.1837714,15.4195095 20.4096864,14.6733517 L6.7759999,1.53153737 C5.185475,-0.00160504005 2.65324232,0.0449126588 1.12009991,1.63543756 C0.401512125,2.38092066 3.90211878e-13,3.37600834 3.90798505e-13,4.41143746 L3.94351218e-13,64.3864751 C3.94681177e-13,67.0807891 1.08722326,69.6611067 3.01540903,71.5429748 L40.7807092,108.401101 C43.1069304,110.671444 46.8180151,110.676525 49.1504445,108.412561" id="Path" fill="url(#linearGradient-2)" fill-rule="nonzero"></path>
<path d="M43.2983488,19.0991931 L27.5566079,3.88246244 C26.7624281,3.11476967 26.7409561,1.84862177 27.5086488,1.05444194 C27.8854826,0.664606611 28.4044438,0.444472651 28.9466386,0.444472651 L60.3925021,0.444472651 C61.4970716,0.444472651 62.3925021,1.33990315 62.3925021,2.44447265 C62.3925021,2.9858375 62.1730396,3.50407742 61.7842512,3.88079942 L46.0801285,19.0975301 C45.3051579,19.8484488 44.0742167,19.8491847 43.2983488,19.0991931 Z" id="Path" fill="url(#linearGradient-3)"></path>
</g>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 3.3 KiB

2
packages/icons/src/svg/index.ts
View File

@ -10,8 +10,10 @@ const SvgDownloadIcon = createIconifyIcon('svg:download');
const SvgCardIcon = createIconifyIcon('svg:card');
const SvgBellIcon = createIconifyIcon('svg:bell');
const SvgCakeIcon = createIconifyIcon('svg:cake');
const SvgAntdvLogoIcon = createIconifyIcon('svg:antdv-logo');
export {
SvgAntdvLogoIcon,
SvgAvatar1Icon,
SvgAvatar2Icon,
SvgAvatar3Icon,

1
playground/src/router/routes/modules/dashboard.ts
View File

@ -29,6 +29,7 @@ const routes: RouteRecordRaw[] = [
path: '/workspace',
component: () => import('#/views/dashboard/workspace/index.vue'),
meta: {
icon: 'carbon:workspace',
title: $t('page.dashboard.workspace'),
},
},

5
playground/src/router/routes/modules/examples.ts
View File

@ -20,6 +20,7 @@ const routes: RouteRecordRaw[] = [
path: '/examples/modal',
component: () => import('#/views/examples/modal/index.vue'),
meta: {
icon: 'system-uicons:window-content',
title: $t('page.examples.modal.title'),
},
},
@ -28,6 +29,7 @@ const routes: RouteRecordRaw[] = [
path: '/examples/drawer',
component: () => import('#/views/examples/drawer/index.vue'),
meta: {
icon: 'iconoir:drawer',
title: $t('page.examples.drawer.title'),
},
},
@ -36,6 +38,7 @@ const routes: RouteRecordRaw[] = [
path: '/examples/ellipsis',
component: () => import('#/views/examples/ellipsis/index.vue'),
meta: {
icon: 'ion:ellipsis-horizontal',
title: $t('page.examples.ellipsis.title'),
},
},
@ -44,6 +47,7 @@ const routes: RouteRecordRaw[] = [
path: '/examples/captcha',
component: () => import('#/views/examples/captcha/index.vue'),
meta: {
icon: 'logos:recaptcha',
title: $t('page.examples.captcha.title'),
},
},
@ -51,6 +55,7 @@ const routes: RouteRecordRaw[] = [
name: 'FormExample',
path: '/examples/form',
meta: {
icon: 'mdi:form-select',
title: $t('page.examples.form.title'),
},
children: [

4
playground/src/router/routes/modules/vben.ts
View File

@ -8,6 +8,7 @@ import {
VBEN_LOGO_URL,
VBEN_NAIVE_PREVIEW_URL,
} from '@vben/constants';
import { SvgAntdvLogoIcon } from '@vben/icons';
import { BasicLayout, IFrameView } from '#/layouts';
import { $t } from '#/locales';
@ -59,6 +60,7 @@ const routes: RouteRecordRaw[] = [
component: IFrameView,
meta: {
badgeType: 'dot',
icon: SvgAntdvLogoIcon,
link: VBEN_ANT_PREVIEW_URL,
title: $t('page.vben.antdv'),
},
@ -69,6 +71,7 @@ const routes: RouteRecordRaw[] = [
component: IFrameView,
meta: {
badgeType: 'dot',
icon: 'logos:naiveui',
link: VBEN_NAIVE_PREVIEW_URL,
title: $t('page.vben.naive-ui'),
},
@ -79,6 +82,7 @@ const routes: RouteRecordRaw[] = [
component: IFrameView,
meta: {
badgeType: 'dot',
icon: 'logos:element',
link: VBEN_ELE_PREVIEW_URL,
title: $t('page.vben.element-plus'),
},