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

feat: style

This commit is contained in:
FairyEver 2021-11-14 20:35:32 +08:00
parent 508e291c08
commit 9171c459d6
3 changed files with 17 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
d2/style/themes/default/src/layout/dashboard/src/menu.scss
View File

@ -55,7 +55,7 @@
// margin-bottom: 0;
// padding-left: 0;
color: --var('color-text-item'); // color: rgba(0, 0, 0, 0.85);
font-size: --var('font-size'); // font-size: 14px;
font-size: --var('item-font-size'); // font-size: 14px;
// line-height: 0;
// text-align: left;
// list-style: none;
@ -239,7 +239,7 @@
.ant-menu-submenu-title .ant-menu-item-icon + span,
.ant-menu-item .anticon + span,
.ant-menu-submenu-title .anticon + span {
// margin-left: 10px;
margin-left: calc((#{--var('item-line-height')} - #{--var('item-font-size')}) / 2); // margin-left: 10px;
// opacity: 1;
// transition: opacity 0.3s cubic-bezier(0.645, 0.045, 0.355, 1), margin 0.3s, color 0.3s;
}
@ -364,7 +364,7 @@
.ant-menu-horizontal:not(.ant-menu-dark) > .ant-menu-submenu {
// margin-top: -1px;
// margin-bottom: 0;
padding: 0 calc((#{--var('item-line-height')} - #{--var('font-size')}) / 2); // padding: 0 20px;
padding: 0 calc((#{--var('item-line-height')} - #{--var('item-font-size')}) / 2); // padding: 0 20px;
}
.ant-menu-horizontal:not(.ant-menu-dark) > .ant-menu-item:hover,
.ant-menu-horizontal:not(.ant-menu-dark) > .ant-menu-submenu:hover,
@ -403,7 +403,7 @@
// display: inline-block;
// vertical-align: bottom;
// ---- new ----
border-radius: --var('radius');
border-radius: --var('item-radius');
margin: --var('item-margin-y') 0;
&:not(:last-child) {
margin-right: --var('item-margin-x');
@ -474,7 +474,7 @@
margin-bottom: --var('item-margin-y'); // margin-bottom: 4px;
margin-right: --var('item-margin-x'); // new
margin-left: --var('item-margin-x'); // new
border-radius: --var('radius'); // new
border-radius: --var('item-radius'); // new
// padding: 0 16px;
// overflow: hidden;
line-height: --var('item-line-height'); // line-height: 40px;

6
d2/style/themes/default/src/layout/dashboard/src/style.scss
View File

@ -24,16 +24,16 @@ html, body, #app {
padding: 0 calc(#{--var('item-margin-x')} / 2);
>.header__button {
@apply transition-colors bg-transparent;
font-size: --var('font-size');
font-size: --var('item-font-size');
height: --var('item-line-height');
margin: --var('item-margin-y') calc(#{--var('item-margin-x')} / 2);
border-radius: --var('radius');
border-radius: --var('item-radius');
&.header__button--icon {
min-width: --var('item-line-height');
}
&.header__button--text {
line-height: --var('item-line-height');
padding: 0 calc((#{--var('item-line-height')} - #{--var('font-size')}) / 2);
padding: 0 calc((#{--var('item-line-height')} - #{--var('item-font-size')}) / 2);
}
&:hover {
background-color: --var('color-bg-item-hover');

13
d2/style/themes/default/src/layout/dashboard/src/var.scss
View File

@ -23,10 +23,15 @@ $classname: '#{$namespace}-layout-dashboard';
#{--key('color-bg-item-selected')}: #FFFFFF;
#{--key('color-text-item')}: #606266;
#{--key('color-text-item-selected')}: #2F74FF;
// size
#{--key('font-size')}: 14px;
#{--key('radius')}: 4px;
// item
// item:
// header menu
// side logo
// side footer
// side menu
// popup menu
// header button
#{--key('item-font-size')}: 14px;
#{--key('item-radius')}: 4px;
#{--key('item-line-height')}: 40px;
#{--key('item-height')}: 50px;
#{--key('item-margin-y')}: calc((#{--var('item-height')} - #{--var('item-line-height')}) / 2);