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
This commit is contained in:
kilyabin
2025-11-26 01:09:46 +04:00
parent 2225851177
commit 24bb531dfb
7 changed files with 102 additions and 58 deletions

View File

@@ -16,25 +16,29 @@ export function ThemeSwitcher() {
const { setTheme } = useTheme()
return (
<DropdownMenu>
<DropdownMenuTrigger asChild>
<Button variant="outline" size="icon" className="min-w-[44px] min-h-[44px] md:min-w-0 md:min-h-0">
<Sun className="h-[1.2rem] w-[1.2rem] rotate-0 scale-100 transition-all dark:-rotate-90 dark:scale-0" />
<Moon className="absolute h-[1.2rem] w-[1.2rem] rotate-90 scale-0 transition-all dark:rotate-0 dark:scale-100" />
<span className="sr-only">Toggle theme</span>
</Button>
</DropdownMenuTrigger>
<DropdownMenuContent align="end">
<DropdownMenuItem onClick={() => setTheme('light')}>
Светлая тема
</DropdownMenuItem>
<DropdownMenuItem onClick={() => setTheme('dark')}>
Темная тема
</DropdownMenuItem>
<DropdownMenuItem onClick={() => setTheme('system')}>
Как в системе
</DropdownMenuItem>
</DropdownMenuContent>
</DropdownMenu>
<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>
)
}