lisang
/
d2-admin
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: body.#{$classname}

This commit is contained in:
FairyEver 2021-11-11 11:16:59 +08:00
parent 47659bbd02
commit 213cb2452f
5 changed files with 31 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
d2/style/themes/default/index.scss
View File

@ -1,6 +1,4 @@
@import './src/base/var.scss';
@import './src/base/base.scss';
@import './src/base/ant.scss';
@import './src/layout/header-aside.scss';

11
d2/style/themes/default/src/base/ant.scss
View File

@ -1,11 +0,0 @@
.d2-admin {
// When the menu exceeds the screen height
// Display it as the maximum screen height
.ant-menu-vertical,
.ant-menu-vertical-left,
.ant-menu-vertical-right {
&.ant-menu-sub {
max-height: 100vh;
}
}
}

8
d2/style/themes/default/src/base/base.scss
View File

@ -1,8 +0,0 @@
html, body, #app {
height: 100%;
width: 100%;
}
#app {
position: relative;
}

31
d2/style/themes/default/src/layout/header-aside.scss
View File

@ -13,12 +13,33 @@ $classname: '#{$namespace}-layout-header-aside';
#{--key('header-height')}: 46px;
}
html, body, #app {
height: 100%;
width: 100%;
}
body.#{$classname} {
#app {
position: relative;
}
// When the menu exceeds the screen height
// Display it as the maximum screen height
.ant-menu-vertical,
.ant-menu-vertical-left,
.ant-menu-vertical-right {
&.ant-menu-sub {
max-height: 100vh;
}
}
}
.#{$classname}__body {
position: absolute;
>.body__scroll {
@apply w-full h-full;
}
}
.#{$classname}__header {
@apply box-content absolute top-0 right-0 border-b border-gray-200 cursor-pointer select-none;
height: --var('header-height');
@ -64,6 +85,7 @@ $classname: '#{$namespace}-layout-header-aside';
}
}
}
.#{$classname}__aside {
@apply box-content absolute top-0 bottom-0 left-0 bg-gray-100 border-r border-gray-200 cursor-pointer select-none;
>.aside__header {
@ -75,8 +97,15 @@ $classname: '#{$namespace}-layout-header-aside';
>.aside__scroll {
@apply w-full h-full;
}
.ant-menu-inline {
.ant-menu-inline,
.ant-menu-vertical,
.ant-menu-vertical-left {
@apply border-r-0;
}
.ant-menu-vertical-right {
@apply border-l-0;
}
.ant-menu-inline {
.ant-menu-item,
.ant-menu-submenu-title {
width: 100%;

2
index.html
View File

@ -6,7 +6,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Vite App</title>
</head>
<body class="d2-admin">
<body class="d2-admin-layout-header-aside">
<div id="app"></div>
<script type="module" src="/src/main.js"></script>
</body>