feat: добавлены анимации загрузки и переходов между разделами

- Добавлен полноэкранный индикатор загрузки с размытием фона (LoadingOverlay)
- Реализован глобальный контекст загрузки для отслеживания переходов между страницами
- Добавлены плавные fade-анимации при переходах между страницами
- Реализованы поочередные (stagger) анимации для карточек:
  * Карточки дней на странице расписания
  * Карточки уроков внутри каждого дня
  * Карточки групп на главной странице
- Анимации работают на всех устройствах, включая мобильные
- Улучшен компонент Spinner с поддержкой разных размеров
- Исправлена ошибка гидратации с вложенными <li> элементами в навигации
- Оптимизированы задержки анимаций для более быстрого отображения контента
This commit is contained in:
kilyabin
2025-11-23 01:29:09 +04:00
parent e5262f8203
commit cf0137a8d6
11 changed files with 276 additions and 60 deletions

View File

@@ -0,0 +1,46 @@
import React from 'react'
import { useRouter } from 'next/router'
interface LoadingContextType {
isLoading: boolean
}
export const LoadingContext = React.createContext<LoadingContextType>({
isLoading: false,
})
export function LoadingContextProvider({ children }: React.PropsWithChildren) {
const [isLoading, setIsLoading] = React.useState(false)
const router = useRouter()
React.useEffect(() => {
const handleRouteChangeStart = () => {
setIsLoading(true)
}
const handleRouteChangeComplete = () => {
setIsLoading(false)
}
const handleRouteChangeError = () => {
setIsLoading(false)
}
router.events.on('routeChangeStart', handleRouteChangeStart)
router.events.on('routeChangeComplete', handleRouteChangeComplete)
router.events.on('routeChangeError', handleRouteChangeError)
return () => {
router.events.off('routeChangeStart', handleRouteChangeStart)
router.events.off('routeChangeComplete', handleRouteChangeComplete)
router.events.off('routeChangeError', handleRouteChangeError)
}
}, [router])
return (
<LoadingContext.Provider value={{ isLoading }}>
{children}
</LoadingContext.Provider>
)
}