From 165bb13623fd703c474917644b8682ecb098452f Mon Sep 17 00:00:00 2001
From: Sebastiaan van Stijn <github@gone.nl>
Date: Wed, 1 Sep 2021 11:58:00 +0200
Subject: [PATCH] _scss: fix some styling in the TOC

- fix margin at the top
- fix left-hand border from disappearing when hovering over the link
- fix indentation for active link (compensate for border-width)

Signed-off-by: Sebastiaan van Stijn <github@gone.nl>
---
 _scss/_layout.scss     |  1 -
 _scss/_navigation.scss | 23 ++++++++++++-----------
 _scss/_night-mode.scss |  2 +-
 3 files changed, 13 insertions(+), 13 deletions(-)

diff --git a/_scss/_layout.scss b/_scss/_layout.scss
index 729ca2f4cf..650f53f3fd 100755
--- a/_scss/_layout.scss
+++ b/_scss/_layout.scss
@@ -113,7 +113,6 @@ section.section {
     top:            $top-navigation-height;
     overflow:       auto;
     max-height:     calc(100vh - #{$top-navigation-height});
-    padding-top:    15px;
     padding-bottom: 20px;
 }
 
diff --git a/_scss/_navigation.scss b/_scss/_navigation.scss
index 443ce8f4df..2112b18276 100755
--- a/_scss/_navigation.scss
+++ b/_scss/_navigation.scss
@@ -76,14 +76,16 @@
 }
 
 .nav-sidebar ul li a,
-.nav-sidebar ul li a:focus,
-.nav-sidebar ul li a:hover {
+.nav-sidebar ul li a:focus {
     border-bottom: none;
-    border-left:   4px solid rgba($primary-links, 0);
+    border-left:   1px solid $primary-links;
 }
 
 .nav-sidebar .nav > li > a {
   padding-left: 22px; // left-padding to align with logo
+  &.active {
+    padding-left: 19px; // compensate for 1px -> 4px border-width
+  }
   @include before-md-width {
     padding-right: 32px; // right-align with hamburger menu
   }
@@ -96,10 +98,9 @@
     font-weight: 600;
 }
 
-.nav-sidebar ul li li a {
-    border-left: 1px solid $primary-links;
-    font-size: 12px;
-    margin-left: 15px;
+.nav-sidebar ul li ul li a {
+  font-size:   12px;
+  margin-left:  8px;
 }
 
 .nav-sidebar .caret {
@@ -141,8 +142,8 @@
 }
 
 .toc-nav li a.active {
-    color: #2089C4;
-    border-left: 4px solid #2089C4;
+    color: $primary-links;
+    border-left: 4px solid $primary-links;
     font-weight: bold;
 }
 
@@ -218,7 +219,7 @@ div#side-toc-title {
 }
 
 input:focus+.slider {
-    box-shadow: 0 0 1px #2196F3;
+    box-shadow: 0 0 1px $slider-btn;
 }
 
 input:checked+.slider:before {
@@ -275,7 +276,7 @@ input:checked+.slider:before {
  */
 
 .feedback-links {
-    margin: 0 0 10px 0;
+    margin: 15px 0 10px 0;
 }
 
 /* polldaddy */
diff --git a/_scss/_night-mode.scss b/_scss/_night-mode.scss
index af018c2fa3..321a87bda7 100755
--- a/_scss/_night-mode.scss
+++ b/_scss/_night-mode.scss
@@ -56,7 +56,7 @@ body.night {
         border: none;
     }
     .nav-sidebar ul li a.active,
-    .nav-sidebar.nav>li>a:focus,
+    .nav-sidebar.nav > li > a:focus,
     .toc-nav li a.active {
         background:  $bg-sidebar-night-active;
         border-left: 4px solid $primary-links;