Commit Graph

314 Commits

Author SHA1 Message Date
sebastjanartic
aaf1231ed0 Improve mobile scrolling behavior by debouncing category index updates
Add a scroll timer to debounce the calculation and update of the current category index on mobile devices, preventing visual flickering during scrolling.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1/OdlP8Wj
2025-09-03 08:52:46 +00:00
sebastjanartic
c89bd4a1be Improve visibility of top 10 videos on desktop
Conditionally render the "Top 10" number overlay only for desktop screen sizes (>= 768px) when the category title includes "Meist Angesehen" and the video index is less than 10, and the clicked video ID does not match the current video ID.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1/OdlP8Wj
2025-09-03 08:50:31 +00:00
sebastjanartic
699ed8ec59 Improve video scrolling behavior on mobile devices for smoother navigation
Refactors the mobile scrolling logic in the Netflix grid component to accurately calculate the most visible video card. Implements a useCallback hook for the scroll handler and updates the pagination indicator styles for better visual feedback.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1/OdlP8Wj
2025-09-03 08:49:08 +00:00
sebastjanartic
200a0884df Adjust grid item appearance for smoother scrolling and better visual consistency
Modify the styling of grid pagination indicators in `netflix-grid.tsx` to remove `scale-125` and explicit `width`/`height` styles, reverting to previous visual size settings for improved performance.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1/OdlP8Wj
2025-09-03 08:46:25 +00:00
sebastjanartic
2233a33526 Improve carousel navigation indicators for better visual feedback
Update the carousel pagination dots in `netflix-grid.tsx` to use more descriptive keys, enhance visual styling with `scale` and `transition-all duration-200 ease-out` classes, and adjust background colors for improved contrast and user experience.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1/OdlP8Wj
2025-09-03 08:45:16 +00:00
sebastjanartic
d2c46814fa Improve mobile video browsing by ensuring cards snap perfectly into view
Adjusts horizontal scrolling on mobile devices to enforce precise snapping of video cards to the screen edge, enhancing user experience and aligning with user expectations for card transitions.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1/OdlP8Wj
2025-09-03 08:44:03 +00:00
sebastjanartic
7894ecb255 Ensure only one video card displays at a time on mobile screens
Refactors the `CategoryRow` component to implement snap-to-start scroll behavior on mobile devices, ensuring that only one full video card is visible at a time. This change adjusts scroll calculations and introduces `scrollSnapType: 'x mandatory'` to the container.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1/OdlP8Wj
2025-09-03 08:42:05 +00:00
sebastjanartic
4fcf1e104f Improve carousel behavior on mobile devices by snapping cards to the left
Adjust carousel scrolling logic in `netflix-grid.tsx` to ensure cards snap to the left edge on mobile devices, accounting for container padding and margins, for a better user experience.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1/OdlP8Wj
2025-09-03 08:40:33 +00:00
sebastjanartic
95ad3e6e34 Improve scrolling behavior for video grids on mobile devices
Adjusts the calculation of scroll amounts and card indices in the `CategoryRow` component for mobile views. It now correctly accounts for margins and gaps between cards, ensuring smoother and more accurate horizontal scrolling. The logic for determining the current card index and navigating between cards has been refined to handle the specific layout of full-width cards on smaller screens, preventing overlapping or skipped items.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1/OdlP8Wj
2025-09-03 08:38:52 +00:00
sebastjanartic
d1ba445592 Limit displayed videos to 10 per row and randomize their order
Adjusted video grid components to display a maximum of 10 videos per row, implementing a random shuffle for all video rows to enhance content variety.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1/OdlP8Wj
2025-09-03 08:36:46 +00:00
sebastjanartic
98c5d91fac Adjust spacing for video category navigation on mobile devices
Update the styling for mobile navigation dots in the Netflix grid component by reducing top and bottom margin and padding.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1/OdlP8Wj
2025-09-03 08:32:35 +00:00
sebastjanartic
4250b50b0f Improve visibility of navigation dots below video rows
Adjusted the styling of mobile navigation dots in the Netflix grid component by adding margin-top, margin-bottom, and padding for better visual placement.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1/OdlP8Wj
2025-09-03 08:31:31 +00:00
sebastjanartic
9ab2966a7b Adjust carousel dot sizes and scaling for better visual consistency
Update the size and scaling of carousel navigation dots in the Netflix grid component.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1/OdlP8Wj
2025-09-03 08:29:46 +00:00
sebastjanartic
ae64f1e4bf Improve navigation indicators in video carousels
Update the size and scale of carousel navigation indicators from 4px to 16px, and adjust the scale factor for the current item.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1/OdlP8Wj
2025-09-03 08:28:58 +00:00
sebastjanartic
c0b08f13fa Improve visibility of carousel indicators on video grids
Update the size and scale of carousel indicators in the Netflix grid component to enhance user visibility.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1/OdlP8Wj
2025-09-03 08:28:30 +00:00
sebastjanartic
3722642531 Improve the appearance of navigation dots on mobile devices
Adjust the size and spacing of mobile navigation dots in the Netflix grid component to enhance visual appeal and adhere to design requirements.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1/OdlP8Wj
2025-09-03 08:27:54 +00:00
sebastjanartic
a7ee41a2c4 Adjust display of navigation indicators for video carousels
Update the styling and size of the pagination indicators in the video category rows to improve visual consistency and responsiveness.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1/OdlP8Wj
2025-09-03 08:26:44 +00:00
sebastjanartic
a5f40b36da Improve visual appearance of content navigation indicators
Update carousel pagination dot styles for better visual feedback and a sleeker UI.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1/OdlP8Wj
2025-09-03 08:25:15 +00:00
sebastjanartic
926ea39e9f Adjust indicator dots for video carousels to be smaller
Update the styling for carousel indicator dots in the `netflix-grid.tsx` component, reducing their size and slightly altering their active state scaling and inactive state opacity for a more subtle appearance.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1/OdlP8Wj
2025-09-03 08:24:04 +00:00
sebastjanartic
c3c9c24516 Add mobile swipe navigation with indicator dots to video carousels
Implement touch event handlers for swiping between video cards on mobile devices, and display pagination dots to indicate the current video and total videos.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1/OdlP8Wj
2025-09-03 08:23:36 +00:00
sebastjanartic
97600c6037 Improve video filtering and display logic for specific content
Refactors the NetflixGrid component to dynamically filter and display videos, prioritizing content matching "Geschichte des Liedes VIDEO" in title or description, with a fallback to a broader filter and random shuffling.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1/4DOsXkx
2025-09-02 17:02:40 +00:00
sebastjanartic
09961bf736 Update German titles to improve language consistency
Update the German title for "Geschichte des Liedes" to "DIE Geschichte des Liedes" in the NetflixGrid component to correct a minor grammatical error.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1/4DOsXkx
2025-09-02 17:00:26 +00:00
sebastjanartic
06d3e40890 Improve collection filtering to show specific content more accurately
Update the Netflix grid component to correctly filter and display videos belonging to the "Geschichte des Liedes" collection by including title and description matches, with a fallback to general filtering if specific videos are not found.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1/4DOsXkx
2025-09-02 17:00:04 +00:00
sebastjanartic
ce3f1d59d3 Update trending videos to show random German songs
Modify the Netflix grid to display 10 random "Geschichte des Liedes" videos, excluding specific titles.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1/4DOsXkx
2025-09-02 16:58:01 +00:00
sebastjanartic
b012c870bd Improve display of top 10 videos by hiding overlay on smaller screens
Adjust conditional rendering for the "Meist Angesehen" category's top 10 overlay to account for viewport width, ensuring it only hides when a video is clicked on larger screens (>= 768px).

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1/4DOsXkx
2025-09-02 16:25:03 +00:00
sebastjanartic
7ddcc0d7a5 Improve visibility of top videos with larger numbers
Adjust the font size for the "Meist Angesehen" category overlay in the netflix-grid component to improve visibility of the top videos.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1/4DOsXkx
2025-09-02 16:24:40 +00:00
sebastjanartic
e7a42bfee8 Adjust spacing and padding for video rows on desktop
Update `netflix-grid.tsx` to increase vertical spacing between categories (`space-y-8` and `mb-6`) and padding for the video row (`py-4`) to improve desktop layout consistency.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1/4DOsXkx
2025-09-02 16:22:22 +00:00
sebastjanartic
c4193352bb Improve visual spacing and scrolling behavior in video grids
Adjusted vertical spacing in NetflixGrid and CategoryRow components and reduced padding in the scrollable video row for better visual presentation and user experience.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1/4DOsXkx
2025-09-02 16:19:29 +00:00
sebastjanartic
5c61884e9c Adjust spacing and text size for improved readability on mobile devices
Reduce vertical spacing in the Netflix grid component and adjust font sizes in VideoCard for mobile responsiveness to address user feedback on small text and excessive spacing.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1/4DOsXkx
2025-09-02 16:18:55 +00:00
sebastjanartic
45987ab28a Improve scrolling behavior for video categories by showing navigation arrows only when applicable
Implement conditional rendering for horizontal scroll navigation buttons in `netflix-grid.tsx` based on scrollable state. Add `checkScrollButtons` function to update button visibility and call it on component mount and scroll events.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1/4DOsXkx
2025-09-02 15:38:41 +00:00
sebastjanartic
09320eb976 Improve visual appearance of video category navigation buttons
Update the CSS classes for the left and right scroll buttons in the Netflix grid component to use a gradient background, enhancing the visual appeal.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1/4DOsXkx
2025-09-02 15:33:54 +00:00
sebastjanartic
dec09b7b2f Improve storage logic to support hybrid and CDN options
Refactor storage initialization to prioritize hybrid (Bunny.net + Database) storage, then Bunny.net only, falling back to Database or Memory storage. Remove debug logs from NetflixGrid component.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1/d05DGZF
2025-09-02 15:02:36 +00:00
sebastjanartic
06185bf445 Improve video display by adding logging for better debugging
Add console logs to the NetflixGrid component to track video data and improve debugging when no videos are present.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1/d05DGZF
2025-09-02 15:01:10 +00:00
sebastjanartic
bddd331745 Improve platform performance and user experience with optimizations
This commit enhances performance by optimizing video card previews, implementing memoization for categories, debouncing search queries, and enabling compression and caching strategies on the server.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 890577b1-c154-40a4-a177-a0c6d55320c3
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/890577b1-c154-40a4-a177-a0c6d55320c3/dCPgsyV
2025-09-02 10:43:58 +00:00
sebastjanartic
72bded4b3d Introduce a new custom loading spinner component with animations
Replace existing simple loading indicators with a new animated `LoadingSpinner` component across various pages and components, including `HLSPreviewThumbnail`, `NetflixGrid`, `ThumbnailGenerator`, `VideoAds`, `VideoGrid`, `FolxStadlPage`, `GeschichteLiedPage`, `GipfelstammtischPage`, and `VideoPage`. The new component features a customizable size, text, and a pulsing gradient animation, improving the visual feedback during loading states.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 890577b1-c154-40a4-a177-a0c6d55320c3
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/890577b1-c154-40a4-a177-a0c6d55320c3/UbX8tN8
2025-09-02 10:38:08 +00:00
sebastjanartic
ed37dc0662 Improve visibility of scrolling controls on video rows
Adjusted the z-index of the left and right scroll buttons in the Netflix grid component to ensure they are always visible over video content.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 890577b1-c154-40a4-a177-a0c6d55320c3
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/890577b1-c154-40a4-a177-a0c6d55320c3/DyHCx4q
2025-09-01 22:18:55 +00:00
sebastjanartic
a9cd118f50 Improve video card display on smaller screens
Adjust client/src/components/netflix-grid.tsx to ensure only one video card is visible at a time on mobile devices by modifying the width calculation for video elements.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 890577b1-c154-40a4-a177-a0c6d55320c3
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/890577b1-c154-40a4-a177-a0c6d55320c3/DyHCx4q
2025-09-01 21:44:01 +00:00
sebastjanartic
71c50d133d Improve video row spacing and padding for better visual presentation
Update the `CategoryRow` component in `netflix-grid.tsx` to include vertical padding (`py-4`) for better visual spacing of videos within the scrollable row.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 890577b1-c154-40a4-a177-a0c6d55320c3
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/890577b1-c154-40a4-a177-a0c6d55320c3/2xHHKQn
2025-09-01 20:30:07 +00:00
sebastjanartic
49b3b39b2c Improve video card display and spacing for better user experience
Adjust margins in NetflixGrid component and increase z-index for video cards on hover in CategoryRow to prevent clipping issues.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 890577b1-c154-40a4-a177-a0c6d55320c3
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/890577b1-c154-40a4-a177-a0c6d55320c3/2xHHKQn
2025-09-01 20:29:06 +00:00
sebastjanartic
530f4de2e4 Remove unnecessary grouping for category rows on the page
Update the 'CategoryRow' component in 'netflix-grid.tsx' to remove the 'group' class from the main div.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 890577b1-c154-40a4-a177-a0c6d55320c3
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/890577b1-c154-40a4-a177-a0c6d55320c3/2xHHKQn
2025-09-01 20:27:09 +00:00
sebastjanartic
7ddc096f0c Improve video card interactions with subtle hover animations and effects
Update netflix-grid.tsx to refine video card scaling and shadow effects on hover, enhancing user interaction.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 890577b1-c154-40a4-a177-a0c6d55320c3
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/890577b1-c154-40a4-a177-a0c6d55320c3/2xHHKQn
2025-09-01 20:26:20 +00:00
sebastjanartic
1504911fab Adjust video grid to show fewer videos and use smaller navigation arrows
Modify the video grid component to display only four videos per row and revert to the previous circular navigation arrows.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 890577b1-c154-40a4-a177-a0c6d55320c3
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/890577b1-c154-40a4-a177-a0c6d55320c3/2xHHKQn
2025-09-01 20:22:48 +00:00
sebastjanartic
56dab34290 Enhance visual appearance of video category rows with stronger gradients
Update client/src/components/netflix-grid.tsx to apply stronger left and right gradient masks to category rows for improved visual depth.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 890577b1-c154-40a4-a177-a0c6d55320c3
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/890577b1-c154-40a4-a177-a0c6d55320c3/2xHHKQn
2025-09-01 20:19:48 +00:00
sebastjanartic
79d6459a61 Improve visual cues for scrolling through video categories
Adjust gradient fade widths and opacity in the netflix-grid component to provide clearer visual indicators for scrollable content.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 890577b1-c154-40a4-a177-a0c6d55320c3
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/890577b1-c154-40a4-a177-a0c6d55320c3/2xHHKQn
2025-09-01 20:17:53 +00:00
sebastjanartic
82751343f2 Adjust video card width to fit within display boundaries
Reduce the width of video cards in the Netflix grid component from 340px to 300px in `client/src/components/netflix-grid.tsx`.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 890577b1-c154-40a4-a177-a0c6d55320c3
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/890577b1-c154-40a4-a177-a0c6d55320c3/2xHHKQn
2025-09-01 20:17:21 +00:00
sebastjanartic
7ef65fb5a8 Improve video card scrolling by fading the track behind arrows
Add gradient fade effects to the left and right edges of the video category rows to create a visual separation between the scrolling content and the navigation arrows.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 890577b1-c154-40a4-a177-a0c6d55320c3
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/890577b1-c154-40a4-a177-a0c6d55320c3/2xHHKQn
2025-09-01 20:14:11 +00:00
sebastjanartic
1e83a546b2 Improve video grid layout by adjusting spacing and positioning
Adjusted left and right padding for category titles and scrollable video rows to achieve full edge-to-edge display in the `netflix-grid.tsx` component, enhancing visual presentation.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 890577b1-c154-40a4-a177-a0c6d55320c3
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/890577b1-c154-40a4-a177-a0c6d55320c3/2xHHKQn
2025-09-01 20:12:13 +00:00
sebastjanartic
7c2a66a2c1 Update carousel scroll buttons to improve browsing experience
Adjusted styling for carousel navigation buttons to match the ZDF-like aesthetic, enhancing visual appeal and user interaction.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 890577b1-c154-40a4-a177-a0c6d55320c3
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/890577b1-c154-40a4-a177-a0c6d55320c3/2xHHKQn
2025-09-01 20:09:09 +00:00
sebastjanartic
1db0110cba Adjust video card width for improved display
Increase the width of individual video cards in the Netflix grid component from 320px to 340px by modifying client/src/components/netflix-grid.tsx.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 890577b1-c154-40a4-a177-a0c6d55320c3
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/890577b1-c154-40a4-a177-a0c6d55320c3/2xHHKQn
2025-09-01 20:08:18 +00:00
sebastjanartic
5d6e3464b0 Improve layout by making video cards larger and adjusting scroll buttons
Update netflix-grid.tsx to increase the width of video cards and resize navigation icons for scroll buttons.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 890577b1-c154-40a4-a177-a0c6d55320c3
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/890577b1-c154-40a4-a177-a0c6d55320c3/2xHHKQn
2025-09-01 20:07:27 +00:00