From bc6a0b5060117d152721230b8e33a8d6be2d4a78 Mon Sep 17 00:00:00 2001
From: squidfunk <martin.donath@squidfunk.com>
Date: Thu, 5 Mar 2020 09:27:32 +0100
Subject: [PATCH] Improved layer promotion and reduced jitter

---
 src/assets/stylesheets/layout/_footer.scss  | 2 +-
 src/assets/stylesheets/layout/_header.scss  | 3 ++-
 src/assets/stylesheets/layout/_nav.scss     | 2 ++
 src/assets/stylesheets/layout/_sidebar.scss | 2 +-
 src/assets/stylesheets/layout/_source.scss  | 5 ++---
 5 files changed, 8 insertions(+), 6 deletions(-)

diff --git a/src/assets/stylesheets/layout/_footer.scss b/src/assets/stylesheets/layout/_footer.scss
index 1c2540e3f..481fd37e8 100644
--- a/src/assets/stylesheets/layout/_footer.scss
+++ b/src/assets/stylesheets/layout/_footer.scss
@@ -130,7 +130,7 @@
     margin-top: px2rem(-20px);
     padding: 0 px2rem(20px);
     color: var(--md-default-bg-color--light);
-    font-size: px2rem(15px);
+    font-size: ms(-1);
   }
 }
 
diff --git a/src/assets/stylesheets/layout/_header.scss b/src/assets/stylesheets/layout/_header.scss
index 662186ed8..0e99c7a5c 100644
--- a/src/assets/stylesheets/layout/_header.scss
+++ b/src/assets/stylesheets/layout/_header.scss
@@ -41,7 +41,6 @@
   box-shadow:
     0 0           px2rem(4px) rgba(0, 0, 0, 0),
     0 px2rem(4px) px2rem(8px) rgba(0, 0, 0, 0);
-  backface-visibility: hidden;
   z-index: 2;
 
   // Always hide shadow, in case JavaScript is not available
@@ -156,6 +155,8 @@
     text-overflow: ellipsis;
     white-space: nowrap;
     overflow: hidden;
+    // Hack: reduce jitter
+    backface-visibility: hidden;
 
     // Page title
     & + & {
diff --git a/src/assets/stylesheets/layout/_nav.scss b/src/assets/stylesheets/layout/_nav.scss
index 741be1f25..8a0258ea8 100644
--- a/src/assets/stylesheets/layout/_nav.scss
+++ b/src/assets/stylesheets/layout/_nav.scss
@@ -205,6 +205,8 @@
           box-shadow:
             inset 0 px2rem(1px) 0 var(--md-default-fg-color--lightest);
           overflow-y: auto;
+          // Hack: reduce jitter
+          backface-visibility: hidden;
           scroll-snap-type: y mandatory;
 
           // Remove border for first list item
diff --git a/src/assets/stylesheets/layout/_sidebar.scss b/src/assets/stylesheets/layout/_sidebar.scss
index 3d9921472..263c51e46 100644
--- a/src/assets/stylesheets/layout/_sidebar.scss
+++ b/src/assets/stylesheets/layout/_sidebar.scss
@@ -130,9 +130,9 @@ $md-toggle__drawer--checked:
     max-height: 100%;
     margin: 0 px2rem(4px);
     overflow-y: auto;
-    scroll-snap-type: y mandatory;
     // Hack: reduce jitter
     backface-visibility: hidden;
+    scroll-snap-type: y mandatory;
 
     // [tablet -]: Adjust margins
     @include break-to-device(tablet) {
diff --git a/src/assets/stylesheets/layout/_source.scss b/src/assets/stylesheets/layout/_source.scss
index bbb05fd14..8d9546cd3 100644
--- a/src/assets/stylesheets/layout/_source.scss
+++ b/src/assets/stylesheets/layout/_source.scss
@@ -59,10 +59,9 @@
 // Source container
 .md-source {
   display: block;
-  padding-right: px2rem(12px);
   transition: opacity 250ms;
   font-size: px2rem(13px);
-  line-height: 1.2;
+  line-height: 1.25;
   white-space: nowrap;
   // Hack: reduce jitter
   backface-visibility: hidden;
@@ -115,7 +114,7 @@
   // Repository name
   &__repository {
     display: inline-block;
-    max-width: 100%;
+    max-width: calc(100% - #{px2rem(24px)});
     margin-left: px2rem(12px);
     font-weight: 700;
     text-overflow: ellipsis;