From 2d2576679b3c09edf37a98cfef2bf26c6987ca69 Mon Sep 17 00:00:00 2001
From: Alexander Bilz <mail@alexbilz.com>
Date: Wed, 28 Apr 2021 12:16:54 +0000
Subject: [PATCH] Initial Tweak for Adjustable Sidebars
---
assets/css/style.css | 32 ++++++++++++++++++++++++++------
1 files changed, 26 insertions(+), 6 deletions(-)
diff --git a/assets/css/style.css b/assets/css/style.css
index 08a33a3..435773f 100644
--- a/assets/css/style.css
+++ b/assets/css/style.css
@@ -17,6 +17,13 @@
--link-color: #0366d7;
--thumbnail-height: 15em;
scroll-padding-top: 100px;
+ --body-max-width: 1920px;
+ --content-ratio: {{ .Site.Params.contentratio | default 0.6 }};
+ --sidebar-ratio: calc(1 - var(--content-ratio));
+ --content-max-width: calc(var(--body-max-width) * var(--content-ratio));
+ --sidebar-max-width: calc(var(--body-max-width) - var(--content-max-width));
+ --content-width: calc(var(--content-ratio) * 100%);
+ --sidebar-width: calc(var(--sidebar-ratio) * 100%);
}
html[data-theme='dark'] {
@@ -181,12 +188,12 @@
.content {
height: auto;
float: right;
- width: 60%;
+ width: var(--content-width);
margin-top: 60px;
}
.page-top {
- width: 60%;
+ width: var(--content-width);
position: fixed;
right: 0;
z-index: 3;
@@ -258,7 +265,7 @@
}
.sidebar {
- width: 40%;
+ width: var(--sidebar-width);
-webkit-background-size: cover;
background-size: cover;
background-color: var(--bg-color);
@@ -271,6 +278,7 @@
display: flex;
flex-direction: column;
min-height: 100%;
+ float: left;
}
.sidebar .logo-title {
@@ -1071,11 +1079,23 @@
@media (min-width: 1921px){
.content {
padding-right: 25%;
- width: 35%;
+ width: var(--content-max-width);
}
.sidebar {
- padding-left: 15%;
- width: 25%;
+ width: var(--sidebar-max-width);
+ left: 50%;
+ margin-left: calc( -1 * var(--body-max-width)/2);
+ }
+
+ .page-top {
+ width: var(--content-max-width);
+ position: fixed;
+ left: 50%;
+ margin-left: calc(-1* (var(--body-max-width)/2 - var(--sidebar-max-width) ));
+ z-index: 3;
+ background-color: var(--bg-color);
+ height: 60px;
+ border-bottom: 1px solid var(--border-color);
}
}
--
Gitblit v1.10.0