feat: responsive design grid (#1354)

* Responsive design grid

* Addressed PR feedback

* Bump Quartz version 4.3.1 => 4.4.0

* Moved page-header into center

* Updated docs with new layouts

* Sync updated version number with package-lock

* Table of Content scrollbar auto

* Reset node_modules

* Updated layout images

* Fixed tablet layout

* Finilazed layout images
This commit is contained in:
Emile Bangma
2024-09-23 22:40:12 +02:00
committed by GitHub
parent 9cefcd0dd1
commit 7d7e334976
17 changed files with 247 additions and 92 deletions

View File

@ -1,5 +1,23 @@
@use "../../styles/variables.scss" as *;
.explorer {
&.desktop-only {
overflow-y: auto;
}
&:after {
pointer-events: none;
content: "";
width: 100%;
height: 50px;
position: absolute;
left: 0;
bottom: 0;
opacity: 1;
transition: opacity 0.3s ease;
background: linear-gradient(transparent 0px, var(--light));
}
}
button#explorer {
background-color: transparent;
border: none;
@ -58,10 +76,6 @@ button#explorer {
visibility: hidden;
}
&.collapsed > .overflow::after {
opacity: 0;
}
& ul {
list-style: none;
margin: 0.08rem 0;
@ -76,6 +90,9 @@ button#explorer {
pointer-events: all;
}
}
> #explorer-ul {
max-height: none;
}
}
svg {