feat: Modernize UI/UX for current web standards

[duyet]

Major Changes:

• Upgrade Bootstrap 4 alpha → 5.3.2 (latest stable)
• Upgrade Font Awesome 4.5 → 6.5.1
• Remove jQuery and Tether dependencies
• Implement comprehensive CSS custom properties (design tokens)

Design System:

• Modern indigo/cyan color palette (replacing yellow/cyan)
• CSS variables for colors, spacing, shadows, transitions
• Improved typography with system font stack
• Modern shadow system for depth and elevation

Component Updates:

• Modernized navigation with gradient header
• Updated buttons with hover lift effects
• Improved form controls with rounded corners
• Modern card designs with hover animations
• Pill-shaped tags with better spacing
• Feed items with card-style layout

Responsive Improvements:

• Better mobile navigation
• Improved breakpoint handling
• Responsive typography
• Enhanced touch targets

Accessibility:

• Visible focus states
• Proper ARIA labels
• Better color contrast
• Semantic HTML improvements

Templates Updated:

• views/index.html (Bootstrap 5 navbar)
• views/partials/menu.html (FA6 icons, BS5 classes)
• views/collection/home.html (modern alerts, grid)
• views/partials/header_meta.html (theme color)

CSS Files Modernized:

• public/css/app.css (comprehensive update)
• public/css/note.css (modern note styles)
• public/css/til.css (improved TIL layout)
• public/css/trend.css (modern tag styles)

Documentation:

• Added CLAUDE.md with detailed migration notes

Performance:

• Removed jQuery dependency
• Hardware-accelerated animations
• System fonts (no web font loading)

Summary by Sourcery

Modernize the UI/UX by upgrading frontend dependencies, introducing a CSS design token system, and restyling key components for a contemporary, accessible, and responsive interface.

Enhancements:

• Upgrade Bootstrap to 5.3.2 and Font Awesome to 6.5.1 while removing jQuery and Tether dependencies
• Implement CSS custom properties for a cohesive design system covering colors, spacing, shadows, and transitions
• Revamp navigation with a gradient header, updated Bootstrap 5 navbar structure, and improved mobile menu behavior
• Restyle buttons, form controls, cards, tags, and feed items with rounded corners, hover lift effects, and smooth animations
• Improve responsive behavior with adjusted breakpoints, responsive typography, and enhanced touch targets
• Enhance accessibility through visible focus states, proper ARIA labels, semantic HTML, and improved color contrast
• Migrate view templates to Bootstrap 5 markup and apply modern alert and grid classes

Documentation:

• Add detailed migration notes and design rationale in CLAUDE.md