feature(header): add header config

assets/css/_core/_media.scss

@@ -62,6 +62,7 @@
 
   .page {
     max-width: 100%;
+    padding-top: $page-padding-top-mobile;
 
     .categories-card {
       .card-item {
@@ -80,8 +81,4 @@
       }
     }
   }
-
-  .dynamic-to-top {
-    display: none !important;
-  }
 }

assets/css/_page/_index.scss

@@ -3,7 +3,7 @@
   width: 100%;
   max-width: 980px;
   margin: 0 auto;
-  padding-top: 6rem;
+  padding-top: $page-padding-top-desktop;
 }
 
 @import "_single";

assets/css/_partial/_header.scss

@@ -1,8 +1,6 @@
 header {
-  position: fixed;
   width: 100%;
-  height: $header-height;
-  line-height: $header-height;
+  z-index: 100;
   background-color: $header-background-color;
 
   .dark-theme & {
@@ -12,7 +10,9 @@ header {
 
 #header-desktop {
   display: block;
-  z-index: 100;
+  position: $header-position-desktop;
+  height: $header-height-desktop;
+  line-height: $header-height-desktop;
 
   .header-wrapper {
     width: auto;
@@ -47,12 +47,14 @@ header {
 
 #header-mobile {
   display: none;
-  z-index: 100;
-  transition: all 0.3s ease 0s;
+  position: $header-position-mobile;
+  height: $header-height-mobile;
+  line-height: $header-height-mobile;
 
   .header-wrapper {
     padding: 0;
     margin: 0;
+    transition: all 0.3s ease 0s;
 
     .header-container {
       display: flex;

assets/css/_partial/_single/_toc.scss

@@ -7,7 +7,7 @@
   border-left: 1px solid $global-border-color;
   overflow-wrap: break-word;
   box-sizing: border-box;
-  top: 12rem;
+  top: $post-toc-top;
 
   .dark-theme & {
     border-left: 1px solid $global-border-color-dark;

assets/css/_variables.scss

@@ -47,7 +47,8 @@ $selection-color-dark: rgba(38, 139, 211, 0.3) !default;
 
 // ========== Header ========== //
 // Height of the header
-$header-height: 4rem !default;
+$header-height-desktop: 4rem !default;
+$header-height-mobile: 4rem !default;
 
 // Color of the header background
 $header-background-color: #fafafa !default;

assets/css/style.template.scss

@@ -8,6 +8,24 @@
   $home-posts: false;
 {{- end -}}
 
+{{- if eq .Site.Params.desktopHeaderMode "normal" -}}
+  $header-position-desktop: static;
+  $page-padding-top-desktop: 1rem;
+  $post-toc-top: 7rem;
+{{- else -}}
+  $header-position-desktop: fixed;
+  $page-padding-top-desktop: 6rem;
+  $post-toc-top: 12rem;
+{{- end -}}
+
+{{- if eq .Site.Params.mobileHeaderMode "normal" -}}
+  $header-position-mobile: static;
+  $page-padding-top-mobile: 1rem;
+{{- else -}}
+  $header-position-mobile: fixed;
+  $page-padding-top-mobile: 6rem;
+{{- end -}}
+
 @import "_variables";
 
 {{- if fileExists "config/css/_custom.scss" -}}