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;
|
gap: 8px 12px;
|
||||||
font-weight: 600;
|
font-weight: 600;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
border-right: solid 1px var(--n-border-color);
|
||||||
|
|
||||||
&.ray-menu__logo-url {
|
&.ray-menu__logo-url {
|
||||||
position: sticky;
|
position: sticky;
|
||||||
|
@ -2,6 +2,7 @@ $space: calc($layoutRouterViewContainer / 2);
|
|||||||
|
|
||||||
.menu-tag {
|
.menu-tag {
|
||||||
height: $layoutMenuHeight;
|
height: $layoutMenuHeight;
|
||||||
|
border-bottom: solid 1px var(--n-border-color);
|
||||||
|
|
||||||
& .menu-tag-sapce {
|
& .menu-tag-sapce {
|
||||||
width: calc(100% - $space * 2);
|
width: calc(100% - $space * 2);
|
||||||
|
@ -10,7 +10,7 @@
|
|||||||
*/
|
*/
|
||||||
|
|
||||||
import './index.scss'
|
import './index.scss'
|
||||||
import { NScrollbar, NTag, NSpace } from 'naive-ui'
|
import { NScrollbar, NTag, NSpace, NLayoutHeader } from 'naive-ui'
|
||||||
import { useMenu } from '@/store'
|
import { useMenu } from '@/store'
|
||||||
|
|
||||||
import type { MenuOption } from 'naive-ui'
|
import type { MenuOption } from 'naive-ui'
|
||||||
@ -61,23 +61,26 @@ const MenuTag = defineComponent({
|
|||||||
},
|
},
|
||||||
render() {
|
render() {
|
||||||
return (
|
return (
|
||||||
<NScrollbar class="menu-tag" xScrollable>
|
<NLayoutHeader>
|
||||||
<NSpace class="menu-tag-sapce" wrap={false} align="center">
|
<NScrollbar class="menu-tag" xScrollable>
|
||||||
{this.modelMenuTagOptions.map((curr, idx) => (
|
<NSpace class="menu-tag-sapce" wrap={false} align="center">
|
||||||
<NTag
|
{this.modelMenuTagOptions.map((curr, idx) => (
|
||||||
closable={
|
<NTag
|
||||||
curr.key !== '/dashboard' && this.modelMenuTagOptions.length > 1
|
closable={
|
||||||
}
|
curr.key !== '/dashboard' &&
|
||||||
onClose={() => this.handleCloseTag(idx)}
|
this.modelMenuTagOptions.length > 1
|
||||||
type={curr.key === this.menuKey ? 'success' : 'info'}
|
}
|
||||||
onClick={this.handleTagClick.bind(this, curr)}
|
onClose={() => this.handleCloseTag(idx)}
|
||||||
bordered={false}
|
type={curr.key === this.menuKey ? 'success' : 'info'}
|
||||||
>
|
onClick={this.handleTagClick.bind(this, curr)}
|
||||||
{typeof curr.label === 'function' ? curr.label() : curr.label}
|
bordered={false}
|
||||||
</NTag>
|
>
|
||||||
))}
|
{typeof curr.label === 'function' ? curr.label() : curr.label}
|
||||||
</NSpace>
|
</NTag>
|
||||||
</NScrollbar>
|
))}
|
||||||
|
</NSpace>
|
||||||
|
</NScrollbar>
|
||||||
|
</NLayoutHeader>
|
||||||
)
|
)
|
||||||
},
|
},
|
||||||
})
|
})
|
||||||
|
@ -25,7 +25,7 @@ const Layout = defineComponent({
|
|||||||
|
|
||||||
if (settingStore.menuTagSwitch) {
|
if (settingStore.menuTagSwitch) {
|
||||||
cssVar = {
|
cssVar = {
|
||||||
'--layout-content-height': 'calc(100% - 110px)',
|
'--layout-content-height': 'calc(100% - 111px)',
|
||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
cssVar = {
|
cssVar = {
|
||||||
|
Loading…
x
Reference in New Issue
Block a user