🎨 fix text display issue

This commit is contained in:
layyback 2024-07-18 18:47:52 +08:00
parent bbeddb3fe6
commit b9f4333c01

View File

@ -8,37 +8,37 @@
> >
<a-menu-item key="finder"> <a-menu-item key="finder">
<template #icon> <template #icon>
<StarOutlined style="font-size: 18px;" /> <StarOutlined style="font-size: 16px" />
</template> </template>
{{ $t('feature.market.explore') }} {{ $t('feature.market.explore') }}
</a-menu-item> </a-menu-item>
<a-menu-item key="worker"> <a-menu-item key="worker">
<template #icon> <template #icon>
<SendOutlined style="transform: rotate(-45deg); font-size: 18px;" /> <SendOutlined style="transform: rotate(-45deg); font-size: 16px" />
</template> </template>
{{ $t('feature.market.efficiency') }} {{ $t('feature.market.efficiency') }}
</a-menu-item> </a-menu-item>
<a-menu-item key="tools"> <a-menu-item key="tools">
<template #icon> <template #icon>
<SearchOutlined style="font-size: 18px;" /> <SearchOutlined style="font-size: 16px" />
</template> </template>
{{ $t('feature.market.searchTool') }} {{ $t('feature.market.searchTool') }}
</a-menu-item> </a-menu-item>
<a-menu-item key="image"> <a-menu-item key="image">
<template #icon> <template #icon>
<FileImageOutlined style="font-size: 18px;" /> <FileImageOutlined style="font-size: 16px" />
</template> </template>
{{ $t('feature.market.imageTool') }} {{ $t('feature.market.imageTool') }}
</a-menu-item> </a-menu-item>
<a-menu-item key="devPlugin"> <a-menu-item key="devPlugin">
<template #icon> <template #icon>
<CodeOutlined style="font-size: 18px;" /> <CodeOutlined style="font-size: 16px" />
</template> </template>
{{ $t('feature.market.developTool') }} {{ $t('feature.market.developTool') }}
</a-menu-item> </a-menu-item>
<a-menu-item key="system"> <a-menu-item key="system">
<template #icon> <template #icon>
<DatabaseOutlined style="font-size: 18px;" /> <DatabaseOutlined style="font-size: 16px" />
</template> </template>
{{ $t('feature.market.systemTool') }} {{ $t('feature.market.systemTool') }}
</a-menu-item> </a-menu-item>
@ -72,7 +72,21 @@
</a-sub-menu> </a-sub-menu>
</a-menu> </a-menu>
</div> </div>
<div :class="['finder', 'result', 'devPlugin', 'image', 'tools', 'worker', 'system'].includes(active[0]) ? 'container' : 'more'"> <div
:class="
[
'finder',
'result',
'devPlugin',
'image',
'tools',
'worker',
'system',
].includes(active[0])
? 'container'
: 'more'
"
>
<keep-alive> <keep-alive>
<router-view /> <router-view />
</keep-alive> </keep-alive>
@ -103,14 +117,14 @@ const active = computed(() => store.state.active);
const { perf } = localConfig.getConfig(); const { perf } = localConfig.getConfig();
const changeMenu = (key: any) => { const changeMenu = (key: any) => {
store.commit('commonUpdate', {active: [key]}) store.commit('commonUpdate', { active: [key] });
router.push(key); router.push(key);
}; };
window.rubick.onPluginEnter(({ code }: { code: string }) => { window.rubick.onPluginEnter(({ code }: { code: string }) => {
code = code === '已安装插件' ? 'installed' : code; code = code === '已安装插件' ? 'installed' : code;
changeMenu(code); changeMenu(code);
store.commit('commonUpdate', {active: [code]}) store.commit('commonUpdate', { active: [code] });
}); });
window.rubick.setSubInput((e: any) => { window.rubick.setSubInput((e: any) => {
@ -129,7 +143,7 @@ window.rubick.setSubInput((e: any) => {
store.commit('setSearchValue', e.text); store.commit('setSearchValue', e.text);
router.push('result'); router.push('result');
} else { } else {
store.commit('commonUpdate', {active: ['finder']}) store.commit('commonUpdate', { active: ['finder'] });
router.push('finder'); router.push('finder');
} }
} }
@ -144,13 +158,16 @@ init();
background: var(--color-body-bg2) !important; background: var(--color-body-bg2) !important;
height: 100%; height: 100%;
border-right: none; border-right: none;
.ant-menu-item, .ant-menu-submenu, .ant-menu-submenu-arrow { .ant-menu-item,
.ant-menu-submenu,
.ant-menu-submenu-arrow {
color: var(--color-text-content); color: var(--color-text-content);
&:active { &:active {
background: none; background: none;
} }
} }
.ant-menu-item-selected, .ant-menu-submenu-selected { .ant-menu-item-selected,
.ant-menu-submenu-selected {
background-color: var(--color-list-hover); background-color: var(--color-list-hover);
color: var(--ant-primary-color); color: var(--ant-primary-color);
.ant-menu-submenu-arrow { .ant-menu-submenu-arrow {
@ -203,9 +220,12 @@ init();
background: var(--color-body-bg2); background: var(--color-body-bg2);
} }
.left-menu { .left-menu {
padding: 24px 16px; padding: 16px;
position: relative; position: relative;
height: 100vh; height: 100vh;
:deep(.ant-menu) {
width: 100%;
}
:deep(.ant-menu-item) { :deep(.ant-menu-item) {
padding-left: 12px !important; padding-left: 12px !important;
display: flex; display: flex;
@ -219,7 +239,14 @@ init();
} }
:deep(.user-info) { :deep(.user-info) {
position: absolute; position: absolute;
bottom: 32px; bottom: 16px;
width: calc(100% - 32px);
.ant-menu-submenu-title {
padding: 0 32px 0 8px;
.ant-menu-title-content {
margin-left: 8px;
}
}
} }
:deep(.ant-avatar) { :deep(.ant-avatar) {
background: transparent; background: transparent;