kv-netflix/backend/static/styles/responsive-patch.css
Khoa.vo 00ccf95cae v1.0.6: Image optimization, navigation fixes, PWA improvements
- Optimized mobile image loading (180px vs 200px desktop)
- Fixed Install App navigation not working on desktop
- Fixed replaceChild null error in hero rendering
- Added PWA icon (512x512)
- Fixed back button navigation issues
- Added mobile bottom padding for nav bar
- Moved Get App FAB higher to avoid nav overlap
- Removed unnecessary pushState from video navigation
- Made Search/MyList tabs not scroll to top on mobile
- Removed duplicate Android TV section from download page
2025-12-24 12:21:34 +07:00

33 lines
No EOL
968 B
CSS

/* ============================================
RESPONSIVE GRID OVERRIDES (Final Layout)
============================================ */
/* Mobile (Portrait/Small) - Force 2 Columns for best readability */
@media (max-width: 600px) {
.video-grid {
grid-template-columns: repeat(2, 1fr) !important;
gap: 12px !important;
padding: 16px 12px !important;
}
.video-grid .video-card {
aspect-ratio: 2/3 !important;
}
}
/* Tablet / Landscape Mobile - Balance density */
@media (min-width: 601px) and (max-width: 1024px) {
.video-grid {
grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)) !important;
gap: 16px !important;
padding: 20px 16px !important;
}
}
/* Desktop - Premium Large Cards (Apple TV+ Style) */
@media (min-width: 1025px) {
.video-grid {
grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)) !important;
gap: 24px !important;
}
}