first commit

frontend/src/components/base/ScrollTopButton.astro

@@ -0,0 +1,75 @@
+
+<button
+    id="scroll-top-button"
+    class="fixed bottom-8 right-8 z-[100] w-12 h-12 bg-[#bf9b58] text-white rounded-full shadow-lg flex items-center justify-center opacity-0 invisible transition-all duration-300 hover:bg-[#a68545] hover:cursor-pointer group"
+    aria-label="Вернуться наверх"
+>
+    <svg 
+        xmlns="http://www.w3.org/2000/svg" 
+        class="w-6 h-6 transition-transform duration-300 group-hover:-translate-y-1" 
+        fill="none" 
+        viewBox="0 0 24 24" 
+        stroke="currentColor" 
+        stroke-width="2"
+    >
+        <path stroke-linecap="round" stroke-linejoin="round" d="M5 15l7-7 7 7" />
+    </svg>
+</button>
+
+<style>
+    #scroll-top-button.show {
+        opacity: 1;
+        visibility: visible;
+        transform: translateY(0);
+    }
+</style>
+
+<script>
+    // Функция для обработки прокрутки
+    const handleScroll = () => {
+        const scrollTopButton = document.getElementById('scroll-top-button');
+        
+        if (!scrollTopButton) return;
+        
+        // Показываем кнопку, если прокрутили больше 20% высоты viewport
+        const scrollPercentage = window.scrollY / window.innerHeight;
+        
+        if (scrollPercentage > 0.2) {
+            scrollTopButton.classList.add('show');
+        } else {
+            scrollTopButton.classList.remove('show');
+        }
+    };
+
+    // Функция для прокрутки наверх
+    const scrollToTop = () => {
+        window.scrollTo({
+            top: 0,
+            behavior: 'smooth'
+        });
+    };
+
+    // Добавляем обработчики событий
+    document.addEventListener('DOMContentLoaded', () => {
+        const button = document.getElementById('scroll-top-button');
+        if (button) {
+            button.addEventListener('click', scrollToTop);
+        }
+        
+        window.addEventListener('scroll', handleScroll);
+    });
+
+    // Убираем обработчики при изменении страницы в Astro
+    document.addEventListener('astro:before-swap', () => {
+        window.removeEventListener('scroll', handleScroll);
+    });
+    
+    document.addEventListener('astro:after-swap', () => {
+        const button = document.getElementById('scroll-top-button');
+        if (button) {
+            button.addEventListener('click', scrollToTop);
+        }
+        
+        window.addEventListener('scroll', handleScroll);
+    });
+</script>