Files
kspguti-schedule/src/features/theme-switch/index.tsx
kilyabin 24bb531dfb feat(ui): improve lesson cards and theme button, optimize dependency checks
UI Improvements:
- Highlight classroom number in lesson cards using Badge component
  * Applied to both mobile and desktop views
  * Improved visual distinction for classroom information

- Fix theme switcher button layout on mobile
  * Add "Тема" text label inside the button (visible on all devices)
  * Remove redundant absolute positioned span below button
  * Fix text overflow issues on mobile devices
  * Improve button isolation to prevent text escaping

Performance Optimization:
- Optimize dependency installation check in deployment scripts
  * Replace timestamp-based check with content hash comparison
  * Use MD5 hash of package.json and lock files to detect real changes
  * Save hash after successful installation for future comparisons
  * Significantly reduce unnecessary npm install runs during updates
  * Add .dependencies.hash to .gitignore

Files changed:
- src/widgets/schedule/lesson.tsx - Added Badge for classroom
- src/features/theme-switch/index.tsx - Added text label to button
- src/widgets/navbar/index.tsx - Improved button container structure
- src/pages/index.tsx - Removed redundant theme label span
- scripts/manage.sh - Optimized dependency check logic
- scripts/install.sh - Optimized dependency check logic
- .gitignore - Added .dependencies.hash exclusion
2025-11-26 01:09:46 +04:00

45 lines
1.7 KiB
TypeScript
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
'use client'
import * as React from 'react'
import { Moon, Sun } from 'lucide-react'
import { useTheme } from 'next-themes'
import { Button } from '@/shadcn/ui/button'
import {
DropdownMenu,
DropdownMenuContent,
DropdownMenuItem,
DropdownMenuTrigger,
} from '@/shadcn/ui/dropdown-menu'
export function ThemeSwitcher() {
const { setTheme } = useTheme()
return (
<div className="flex-shrink-0">
<DropdownMenu>
<DropdownMenuTrigger asChild>
<Button variant="outline" className="min-h-[44px] md:min-h-0 flex-shrink-0 gap-2 px-3 whitespace-nowrap">
<div className="relative h-[1.2rem] w-[1.2rem] flex-shrink-0">
<Sun className="h-[1.2rem] w-[1.2rem] rotate-0 scale-100 transition-all dark:-rotate-90 dark:scale-0 absolute inset-0" />
<Moon className="h-[1.2rem] w-[1.2rem] rotate-90 scale-0 transition-all dark:rotate-0 dark:scale-100 absolute inset-0" />
</div>
<span className="flex-shrink-0">Тема</span>
</Button>
</DropdownMenuTrigger>
<DropdownMenuContent align="end" className="min-w-[140px] whitespace-nowrap">
<DropdownMenuItem onClick={() => setTheme('light')} className="whitespace-nowrap">
Светлая тема
</DropdownMenuItem>
<DropdownMenuItem onClick={() => setTheme('dark')} className="whitespace-nowrap">
Темная тема
</DropdownMenuItem>
<DropdownMenuItem onClick={() => setTheme('system')} className="whitespace-nowrap">
Как в системе
</DropdownMenuItem>
</DropdownMenuContent>
</DropdownMenu>
</div>
)
}