+ {% include 'navigation-side.html' %}
{% if toc != false -%}
+ {%- comment -%}
{% include 'navigation-toc-side.html', tocContents:tocContents %}
+ {% endcomment %}
{% endif -%}
diff --git a/src/_sass/_site.scss b/src/_sass/_site.scss
index 1e2a9f753f..5eb1904864 100644
--- a/src/_sass/_site.scss
+++ b/src/_sass/_site.scss
@@ -41,6 +41,11 @@
}
#page-content {
+ display: flex;
+ flex-direction: row;
+ flex-grow: 1;
+ align-items: flex-start;
+ justify-content: space-between;
min-height: calc(100vh);
body.homepage & {
@@ -53,21 +58,27 @@
}
> article {
- > .content {
- max-width: 960px;
- margin-left: auto;
- margin-right: auto;
- padding: $top-content-padding 1.5rem 1.5rem;
- }
-
- @media(min-width: 1024px) {
- margin-left: 226px;
- }
-
- @media(min-width: 1200px) {
- margin-right: 226px;
- }
- }
+ overflow-x: hidden;
+ margin: 1rem;
+ max-width: 56rem;
+ }
+
+ //> article {
+ // > .content {
+ // max-width: 960px;
+ // margin-left: auto;
+ // margin-right: auto;
+ // padding: $top-content-padding 1.5rem 1.5rem;
+ // }
+ //
+ // @media(min-width: 1024px) {
+ // margin-left: 226px;
+ // }
+ //
+ // @media(min-width: 1200px) {
+ // margin-right: 226px;
+ // }
+ //}
}
#site-content-title {
diff --git a/src/_sass/components/_sidebar.scss b/src/_sass/components/_sidebar.scss
index 5318e431cd..ae02168451 100644
--- a/src/_sass/components/_sidebar.scss
+++ b/src/_sass/components/_sidebar.scss
@@ -3,16 +3,16 @@
@use '../core/bootstrap';
#sidenav {
- font-family: $site-font-family-alt;
- position: fixed;
+ position: sticky;
+ overflow-y: auto;
+
top: $site-header-height;
- bottom: 0;
- left: 0;
- width: 226px;
+ width: 15rem;
+ max-height: calc(100vh - $site-header-height);
+
+ font-family: $site-font-family-alt;
border-right: 1px solid #d8d8d8;
- overflow-x: hidden;
- overflow-y: auto;
- z-index: 1;
+ scrollbar-width: thin;
.open_menu & {
z-index: 10000;
@@ -20,6 +20,10 @@
overscroll-behavior: contain;
pointer-events: auto;
}
+
+ @media(max-width: 768px) {
+ display: none;
+ }
}
.site-sidebar {