81 lines
No EOL
1.4 KiB
SCSS
81 lines
No EOL
1.4 KiB
SCSS
:root {
|
|
--accent: #343434;
|
|
}
|
|
|
|
body {
|
|
background: transparent;
|
|
color: white;
|
|
font-family: arial;
|
|
}
|
|
|
|
::-webkit-scrollbar {
|
|
background: #232323;
|
|
width: 12px;
|
|
}
|
|
::-webkit-scrollbar-thumb {
|
|
background: rgba(255, 255, 255, 0.1);
|
|
border-radius: 24px;
|
|
border: 4px #232323 solid;
|
|
}
|
|
|
|
.fullview {
|
|
position: absolute;
|
|
top: 0px;
|
|
left: 0px;
|
|
width: 100%;
|
|
height: 100%;
|
|
border: none;
|
|
}
|
|
|
|
.sidebar {
|
|
position: fixed;
|
|
top: 0px;
|
|
left: 0px;
|
|
width: 240px;
|
|
height: 100%;
|
|
background: #23232305;
|
|
padding: 0px 20px;
|
|
display: grid;
|
|
.sidebar-top {
|
|
padding-top: 24px;
|
|
}
|
|
.sidebar-bottom {
|
|
padding-bottom: 24px;
|
|
align-self: end;
|
|
}
|
|
li {
|
|
cursor: pointer;
|
|
color: white;
|
|
background: transparent;
|
|
display: flex;
|
|
width: 100%;
|
|
border: none;
|
|
border-radius: 6px;
|
|
margin-bottom: 6px;
|
|
align-items: center;
|
|
i {
|
|
margin: 0px 16px;
|
|
}
|
|
}
|
|
li:hover {
|
|
background: rgba(51, 51, 51, 0.5);
|
|
}
|
|
li.active {
|
|
background: var(--accent);
|
|
}
|
|
}
|
|
|
|
.pages {
|
|
position: absolute;
|
|
top: 0px;
|
|
left: 280px;
|
|
width: calc(100% - 280px);
|
|
max-width: calc(100% - 280px);
|
|
height: 100%;
|
|
background: #232323;
|
|
}
|
|
|
|
.page {
|
|
display: none;
|
|
&.active {display: block}
|
|
} |