feat: add curtain to toc popup

cotes2020 · Oct 11, 2024 · 8287f52 · 8287f52
1 parent ed2842c
commit 8287f52
Showing 1 changed file with 10 additions and 0 deletions.
diff --git a/_sass/layout/post.scss b/_sass/layout/post.scss
@@ -379,6 +379,7 @@ header {
 #toc-popup {
   $slide-in: slide-in 0.3s ease-out;
   $slide-out: slide-out 0.3s ease-out;
+  $curtain-height: 2rem;
 
   border-color: var(--toc-popup-border-color);
   border-width: 1px;
@@ -469,10 +470,19 @@ header {
     backdrop-filter: blur(5px);
   }
 
+  &::after {
+    display: flex;
+    content: '';
+    position: relative;
+    background: linear-gradient(transparent, var(--main-bg) 70%);
+    height: $curtain-height;
+  }
+
   #toc-popup-content {
     overflow: auto;
     max-height: calc(100vh - 4 * $topbar-height);
     font-family: $font-family-heading;
+    margin-bottom: -$curtain-height;
   }
 }