Новые изменения в компоенты

frontend/src/components/blog/ArticleTableOfContents.astro

@@ -28,7 +28,14 @@ const { items } = Astro.props;
     )}
 
 <style is:global>
-  .toc-container { width: 100%; }
+  .toc-container { 
+    width: 100%; 
+    margin-top: 1.5rem;
+    transition: margin-top 0.3s ease;
+  }
+  .toc-container.no-top-margin {
+    margin-top: 0 !important;
+  }
   .toc-nav {
     background: #ffffff;
     border-radius: 1.25rem;
@@ -108,6 +115,29 @@ const { items } = Astro.props;
     const toc = document.getElementById('toc-sidebar');
     if (!toc) return;
 
+    let lastScrollY = window.scrollY;
+    let ticking = false;
+
+    const updateMargin = () => {
+      const currentScrollY = window.scrollY;
+      // При скролле ВНИЗ - убрать отступ
+      if (currentScrollY > lastScrollY) {
+        toc.classList.add('no-top-margin');
+      } else {
+        // При скролле ВВЕРХ или начальная позиция - вернуть отступ
+        toc.classList.remove('no-top-margin');
+      }
+      lastScrollY = currentScrollY;
+      ticking = false;
+    };
+
+    window.addEventListener('scroll', () => {
+      if (!ticking) {
+        requestAnimationFrame(() => updateMargin());
+        ticking = true;
+      }
+    });
+
     const items = toc.querySelectorAll('.toc-item');
     const links = toc.querySelectorAll<HTMLAnchorElement>('.toc-link');
     const HEADER_OFFSET = 120; // Высота хедера + запас