mirror of
https://github.com/XiaoDaiGua-Ray/ray-template.git
synced 2025-04-06 03:57:49 +08:00
调整布局border,优化显示
This commit is contained in:
parent
077f5a8b67
commit
142612cfbd
@ -19,6 +19,7 @@
|
||||
gap: 8px 12px;
|
||||
font-weight: 600;
|
||||
overflow: hidden;
|
||||
border-right: solid 1px var(--n-border-color);
|
||||
|
||||
&.ray-menu__logo-url {
|
||||
position: sticky;
|
||||
|
@ -2,6 +2,7 @@ $space: calc($layoutRouterViewContainer / 2);
|
||||
|
||||
.menu-tag {
|
||||
height: $layoutMenuHeight;
|
||||
border-bottom: solid 1px var(--n-border-color);
|
||||
|
||||
& .menu-tag-sapce {
|
||||
width: calc(100% - $space * 2);
|
||||
|
@ -10,7 +10,7 @@
|
||||
*/
|
||||
|
||||
import './index.scss'
|
||||
import { NScrollbar, NTag, NSpace } from 'naive-ui'
|
||||
import { NScrollbar, NTag, NSpace, NLayoutHeader } from 'naive-ui'
|
||||
import { useMenu } from '@/store'
|
||||
|
||||
import type { MenuOption } from 'naive-ui'
|
||||
@ -61,23 +61,26 @@ const MenuTag = defineComponent({
|
||||
},
|
||||
render() {
|
||||
return (
|
||||
<NScrollbar class="menu-tag" xScrollable>
|
||||
<NSpace class="menu-tag-sapce" wrap={false} align="center">
|
||||
{this.modelMenuTagOptions.map((curr, idx) => (
|
||||
<NTag
|
||||
closable={
|
||||
curr.key !== '/dashboard' && this.modelMenuTagOptions.length > 1
|
||||
}
|
||||
onClose={() => this.handleCloseTag(idx)}
|
||||
type={curr.key === this.menuKey ? 'success' : 'info'}
|
||||
onClick={this.handleTagClick.bind(this, curr)}
|
||||
bordered={false}
|
||||
>
|
||||
{typeof curr.label === 'function' ? curr.label() : curr.label}
|
||||
</NTag>
|
||||
))}
|
||||
</NSpace>
|
||||
</NScrollbar>
|
||||
<NLayoutHeader>
|
||||
<NScrollbar class="menu-tag" xScrollable>
|
||||
<NSpace class="menu-tag-sapce" wrap={false} align="center">
|
||||
{this.modelMenuTagOptions.map((curr, idx) => (
|
||||
<NTag
|
||||
closable={
|
||||
curr.key !== '/dashboard' &&
|
||||
this.modelMenuTagOptions.length > 1
|
||||
}
|
||||
onClose={() => this.handleCloseTag(idx)}
|
||||
type={curr.key === this.menuKey ? 'success' : 'info'}
|
||||
onClick={this.handleTagClick.bind(this, curr)}
|
||||
bordered={false}
|
||||
>
|
||||
{typeof curr.label === 'function' ? curr.label() : curr.label}
|
||||
</NTag>
|
||||
))}
|
||||
</NSpace>
|
||||
</NScrollbar>
|
||||
</NLayoutHeader>
|
||||
)
|
||||
},
|
||||
})
|
||||
|
@ -25,7 +25,7 @@ const Layout = defineComponent({
|
||||
|
||||
if (settingStore.menuTagSwitch) {
|
||||
cssVar = {
|
||||
'--layout-content-height': 'calc(100% - 110px)',
|
||||
'--layout-content-height': 'calc(100% - 111px)',
|
||||
}
|
||||
} else {
|
||||
cssVar = {
|
||||
|
Loading…
x
Reference in New Issue
Block a user