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

feat: logo space

This commit is contained in:
FairyEver 2021-11-24 08:32:41 +08:00
parent bb73b5ed39
commit f25d47a41a
3 changed files with 28 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
d2/components/d2/admin/layout/dashboard/index.vue
View File

@ -35,7 +35,7 @@
</d2-scroll>
</d2-flex>
<!-- logo -->
<div class="layout__logo">
<div class="layout__logo layout__blur">
logo
</div>
</template>

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

@ -76,14 +76,34 @@ html, body, #app {
width: --var('side-width');
>.side__scroll {
@apply w-full h-full;
>.os-scrollbar-vertical {
top: --var('logo-height');
}
.side__container {
padding-top: --var('logo-height');
padding-top: calc(#{--var('logo-height')} + #{--var('logo-border-width')});
}
}
}
.layout__logo {
position: absolute;
top: 0px;
left: 0px;
height: --var('logo-height');
width: --var('logo-width');
border-bottom-style: solid;
border-bottom-width: --var('logo-border-width');
}
.layout__blur {
background-color: --var('color-bg-app-rgba-blur');
backdrop-filter: blur(8px);
border-color: --var('color-bg-app');
box-sizing: content-box;
}
@-moz-document url-prefix() {
.layout__blur {
background-color: --var('color-bg-app-rgba-blur-moz');
}
}
}

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

@ -14,9 +14,13 @@ $classname: '#{$namespace}-layout-dashboard';
}
}
$color-bg-app: #ECF1F6;
:root {
// color
#{--key('color-bg-app')}: #ECF1F6;
#{--key('color-bg-app')}: $color-bg-app;
#{--key('color-bg-app-rgba-blur')}: rgba($color-bg-app, 0.6);
#{--key('color-bg-app-rgba-blur-moz')}: rgba($color-bg-app, 0.96);
#{--key('color-bg-content')}: #FFFFFF;
#{--key('color-bg-popup')}: #FFFFFF;
#{--key('color-bg-item-hover')}: #F6F8FB;
@ -38,4 +42,5 @@ $classname: '#{$namespace}-layout-dashboard';
// logo
#{--key('logo-height')}: --var('header-height');
#{--key('logo-width')}: --var('side-width');
#{--key('logo-border-width')}: 1px;
}