feat: custom window decorations

This commit is contained in:
GyDi
2022-01-08 22:23:48 +08:00
parent 2d2899b68a
commit ed6bfa5fa2
10 changed files with 194 additions and 648 deletions

View File

@@ -1,46 +1,72 @@
.layout {
width: 100%;
height: 100vh;
display: flex;
overflow: hidden;
&__sidebar {
position: relative;
&__left {
flex: 1 0 25%;
height: 100vh;
display: flex;
height: 100%;
max-width: 225px;
min-width: 125px;
overflow: hidden auto;
padding: 8px 0;
flex-direction: column;
box-sizing: border-box;
user-select: none;
overflow: hidden;
.the-logo {
flex: 0 1 180px;
width: 100%;
max-width: 180px;
max-height: 180px;
margin: 0 auto;
padding: 0 8px;
text-align: center;
box-sizing: border-box;
}
.the-menu {
flex: 1 1 75%;
overflow-y: auto;
margin-bottom: 8px;
}
.the-traffic {
flex: 0 0 60px;
> div {
margin: 0 auto;
}
}
}
&__content {
&__right {
position: relative;
flex: 1 1 75%;
height: 100vh;
overflow: auto;
height: 100%;
display: flex;
flex-direction: column;
padding: 2px 0;
box-sizing: border-box;
scrollbar-gutter: "stable";
}
&__logo {
width: 100%;
height: auto;
max-width: 180px;
max-height: 180px;
margin: 0 auto;
padding: 8px 8px 0;
user-select: none;
text-align: center;
box-sizing: border-box;
}
.the-bar {
flex: 0 0 30px;
width: 100%;
height: 30px;
padding: 0 16px;
display: flex;
align-items: center;
justify-content: flex-end;
box-sizing: border-box;
}
&__traffic {
position: absolute;
left: 0;
right: 0;
bottom: 8px;
> div {
margin: 0 auto;
.the-content {
flex: 1 1 100%;
overflow: auto;
box-sizing: border-box;
scrollbar-gutter: stable;
}
}
}