kv-netflix/backend/static/styles/grid-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

45 lines
No EOL
1.1 KiB
CSS

/* Base Video Grid Definition (Desktop) */
.video-grid {
display: grid !important;
/* Larger cards for better visibility */
grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)) !important;
gap: var(--spacing-lg) !important;
padding: var(--spacing-lg) 4%;
width: 100%;
}
/* Ensure cards inside grid take full width */
.video-grid .video-card {
width: 100%;
/* Override fixed width if any */
flex: none;
/* Override flex */
aspect-ratio: 2/3;
min-width: 160px;
}
/* Medium screens - slightly smaller cards */
@media (max-width: 1200px) {
.video-grid {
grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
gap: 20px;
}
}
/* Tablet */
@media (max-width: 768px) {
.video-grid {
grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
gap: 16px;
padding: var(--spacing-md) 3%;
}
}
/* Mobile - 2 columns */
@media (max-width: 480px) {
.video-grid {
grid-template-columns: repeat(2, 1fr);
gap: 12px;
padding: var(--spacing-sm) 16px;
}
}