lab/website-components
1
Fork 0
Code Activity

Clean up grid sidebar

Browse source
This commit is contained in:
Jake Howard 2024-11-01 17:25:50 +00:00
parent 791041ea9c
commit 529c866547
Signed by: jake
GPG key ID: 57AFB45680EDD477
2 changed files with 9 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
src/sidebars/sidebar/index.html
View file

@ -1,3 +1,4 @@
<!doctype html>
<html>
<head>
<link rel="stylesheet" href="./index.scss" />

15
src/sidebars/sidebar/index.scss
View file

@ -8,6 +8,7 @@ html {
$content-width: 85ch;
$content-padding: 16px;
$sidebar-width: 400px;
$bleed-ratio: 0.2;
$details-bg: black;
@ -53,8 +54,8 @@ main {
.spacer {
flex-grow: 1;
flex-shrink: 10;
flex-basis: 200px;
flex-shrink: 100;
flex-basis: $sidebar-width;
}
.content-wrapper {
@ -84,9 +85,8 @@ main {
.sidebar {
flex-grow: 1;
flex-shrink: 10;
flex-basis: 200px;
min-width: 400px;
flex-basis: $sidebar-width;
min-width: $sidebar-width;
background-color: orange;
.sidebar-inner {
@ -95,11 +95,12 @@ main {
}
}
@media (max-width: 1200px) {
@media (max-width: 1175px) {
main {
flex-direction: column-reverse;
align-items: center;
padding: 0 1rem;
gap: unset;
}
.spacer {
@ -118,7 +119,7 @@ main {
}
}
@media (max-width: 400px) {
@media (max-width: 300px) {
.sidebar {
display: none;
}