sebastjanartic
8d5f60dcfa
Adjust spacing between content categories for better visual flow
...
Modify the bottom margin for the third category in the NetflixGrid component to `0px` and reduce the margin for other categories to `24px`.
Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 074b0e4c-6171-43bd-aa98-f9e04623ca14
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/074b0e4c-6171-43bd-aa98-f9e04623ca14/iazasnP
2025-08-30 13:50:20 +00:00
sebastjanartic
40e7af9be3
Adjust spacing between video categories on the main page
...
Update NetflixGrid component to reduce bottom margin for the third category from 16px to 8px.
Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 074b0e4c-6171-43bd-aa98-f9e04623ca14
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/074b0e4c-6171-43bd-aa98-f9e04623ca14/iazasnP
2025-08-30 13:48:15 +00:00
sebastjanartic
02a0c38d36
Adjust spacing between video categories for better visual appeal
...
Modify the margin-bottom for the third category in the Netflix grid component to 16px, while other categories maintain a 32px margin.
Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 074b0e4c-6171-43bd-aa98-f9e04623ca14
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/074b0e4c-6171-43bd-aa98-f9e04623ca14/iazasnP
2025-08-30 13:47:36 +00:00
sebastjanartic
819aa8e9d4
Improve spacing and layout of video categories on the homepage
...
Adjusted CSS styling in `client/src/components/netflix-grid.tsx` to add bottom margin to each category row, improving visual separation and user experience.
Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 074b0e4c-6171-43bd-aa98-f9e04623ca14
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/074b0e4c-6171-43bd-aa98-f9e04623ca14/iazasnP
2025-08-30 13:46:29 +00:00
sebastjanartic
6d7899ea50
Improve video grid layout and category row spacing
...
Update `netflix-grid.tsx` to apply a gap of 6 to the grid container and remove unnecessary top margin from the category row.
Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 074b0e4c-6171-43bd-aa98-f9e04623ca14
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/074b0e4c-6171-43bd-aa98-f9e04623ca14/iazasnP
2025-08-30 13:45:38 +00:00
sebastjanartic
e35a79c74b
Improve grid layout and spacing for better visual appeal
...
Update NetflixGrid component to remove unnecessary divs and adjust margin-bottom for CategoryRow.
Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 074b0e4c-6171-43bd-aa98-f9e04623ca14
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/074b0e4c-6171-43bd-aa98-f9e04623ca14/iazasnP
2025-08-30 13:45:03 +00:00
sebastjanartic
4ceb8342a4
Improve video grid layout by removing unnecessary top padding
...
Remove the conditional `pt-4` class from the first category div in the NetflixGrid component to ensure consistent spacing.
Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 074b0e4c-6171-43bd-aa98-f9e04623ca14
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/074b0e4c-6171-43bd-aa98-f9e04623ca14/iazasnP
2025-08-30 13:44:31 +00:00
sebastjanartic
38f4f887f3
Improve visual layout by adjusting spacing and adding a top padding to the first category row
...
Adjusted main content padding on the home page from `pt-4` to `pt-0` and added `pt-4` conditionally to the first category row in `NetflixGrid` to refine vertical spacing.
Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 074b0e4c-6171-43bd-aa98-f9e04623ca14
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/074b0e4c-6171-43bd-aa98-f9e04623ca14/iazasnP
2025-08-30 13:43:36 +00:00
sebastjanartic
3ab93a0cb3
Improve grid layout by adding spacing between video categories
...
Update the NetflixGrid component to include bottom margin for category rows in client/src/components/netflix-grid.tsx.
Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 074b0e4c-6171-43bd-aa98-f9e04623ca14
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/074b0e4c-6171-43bd-aa98-f9e04623ca14/iazasnP
2025-08-30 13:42:49 +00:00
sebastjanartic
1c79a7b57d
Adjust spacing for video grid rows to improve visual presentation
...
Modify CSS class in `netflix-grid.tsx` to remove bottom padding from category rows, aligning with design specifications.
Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 074b0e4c-6171-43bd-aa98-f9e04623ca14
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/074b0e4c-6171-43bd-aa98-f9e04623ca14/iazasnP
2025-08-30 13:41:58 +00:00
sebastjanartic
67d533f88f
Adjust spacing for video categories on the homepage
...
Modify the spacing class in `client/src/components/netflix-grid.tsx` from `-space-y-2` to `space-y-1` to reduce vertical space between category rows.
Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 074b0e4c-6171-43bd-aa98-f9e04623ca14
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/074b0e4c-6171-43bd-aa98-f9e04623ca14/iazasnP
2025-08-30 13:37:51 +00:00
sebastjanartic
a6c400bbb4
Adjust spacing between video categories on the homepage
...
Update `client/src/components/netflix-grid.tsx` to change the negative margin from `-space-y-2` to `-space-y-2` to reduce the vertical spacing between category rows.
Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 074b0e4c-6171-43bd-aa98-f9e04623ca14
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/074b0e4c-6171-43bd-aa98-f9e04623ca14/iazasnP
2025-08-30 13:37:09 +00:00
sebastjanartic
b3c227fe79
Reduce top spacing for category rows on the homepage
...
Adjusted the margin-top style for category rows in `netflix-grid.tsx` to remove excessive top spacing.
Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 074b0e4c-6171-43bd-aa98-f9e04623ca14
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/074b0e4c-6171-43bd-aa98-f9e04623ca14/iazasnP
2025-08-30 13:36:16 +00:00
sebastjanartic
d125917713
Improve spacing between video categories on the homepage
...
Add a top margin to the category row component to provide better visual separation between content sections.
Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 074b0e4c-6171-43bd-aa98-f9e04623ca14
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/074b0e4c-6171-43bd-aa98-f9e04623ca14/iazasnP
2025-08-30 13:34:48 +00:00
sebastjanartic
aa9805f788
Adjust spacing for video grid rows to improve visual presentation
...
Update `client/src/components/netflix-grid.tsx` to reduce the bottom padding of category rows from `pb-8` to `pb-2`, slightly adjusting the visual spacing between rows.
Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 074b0e4c-6171-43bd-aa98-f9e04623ca14
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/074b0e4c-6171-43bd-aa98-f9e04623ca14/iazasnP
2025-08-30 13:31:58 +00:00
sebastjanartic
81ac15005b
Improve video category layout for better spacing and visual appeal
...
Adjust CSS class in NetflixGrid component to change vertical spacing between video categories from -space-y-8 to space-y-1.
Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 074b0e4c-6171-43bd-aa98-f9e04623ca14
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/074b0e4c-6171-43bd-aa98-f9e04623ca14/iazasnP
2025-08-30 13:31:13 +00:00
sebastjanartic
435bfe23a2
Adjust spacing between video rows for better visual appeal
...
Update client/src/components/netflix-grid.tsx to increase the vertical spacing between categories by modifying the negative margin utility class.
Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 074b0e4c-6171-43bd-aa98-f9e04623ca14
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/074b0e4c-6171-43bd-aa98-f9e04623ca14/iazasnP
2025-08-30 13:30:36 +00:00
sebastjanartic
d3fa718a25
Adjust spacing between video categories for better visual presentation
...
Modify CSS class on netflix-grid.tsx to reduce negative vertical spacing between category rows.
Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 074b0e4c-6171-43bd-aa98-f9e04623ca14
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/074b0e4c-6171-43bd-aa98-f9e04623ca14/iazasnP
2025-08-30 13:29:40 +00:00
sebastjanartic
63a1e7ec3f
Reduce vertical spacing between video categories on the grid
...
Update `netflix-grid.tsx` to reduce vertical spacing (`space-y-0`) between categories in the Netflix grid component.
Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 074b0e4c-6171-43bd-aa98-f9e04623ca14
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/074b0e4c-6171-43bd-aa98-f9e04623ca14/iazasnP
2025-08-30 13:28:55 +00:00
sebastjanartic
bae022498b
Reduce excessive spacing above video categories on the main page
...
Reduce the vertical spacing above each category row in the NetflixGrid component by changing the class from `space-y-12` to `space-y-2`.
Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 074b0e4c-6171-43bd-aa98-f9e04623ca14
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/074b0e4c-6171-43bd-aa98-f9e04623ca14/iazasnP
2025-08-30 13:28:05 +00:00
sebastjanartic
bb3067664a
Reduce space above category titles on the grid
...
Adjusted the margin-bottom class on the category row div in `netflix-grid.tsx` to `relative group` to remove the extra space above category titles.
Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 074b0e4c-6171-43bd-aa98-f9e04623ca14
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/074b0e4c-6171-43bd-aa98-f9e04623ca14/iazasnP
2025-08-30 13:27:10 +00:00
sebastjanartic
8f0e26c37a
Adjust spacing between video category titles on the grid
...
Modify the margin-bottom CSS property for category titles within the netflix-grid component to reduce spacing.
Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 074b0e4c-6171-43bd-aa98-f9e04623ca14
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/074b0e4c-6171-43bd-aa98-f9e04623ca14/iazasnP
2025-08-30 13:26:27 +00:00
sebastjanartic
412b0221d4
Improve video display and scaling for smoother browsing
...
Update netflix-grid.tsx to include `overflow-hidden` on the relative div and adjust video scaling on hover for a better user experience.
Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 074b0e4c-6171-43bd-aa98-f9e04623ca14
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/074b0e4c-6171-43bd-aa98-f9e04623ca14/iazasnP
2025-08-30 13:25:20 +00:00
sebastjanartic
0f4a74ef47
Improve video hover effect for better visual interaction
...
Update CSS classes in `netflix-grid.tsx` to enhance the hover effect on video elements, increasing their z-index on hover to bring them to the front.
Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 074b0e4c-6171-43bd-aa98-f9e04623ca14
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/074b0e4c-6171-43bd-aa98-f9e04623ca14/iazasnP
2025-08-30 13:23:32 +00:00
sebastjanartic
ef77969844
Improve video grid spacing and responsiveness on smaller screens
...
Adjust padding in the category row component to prevent video overlap when expanding grid tiles.
Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 074b0e4c-6171-43bd-aa98-f9e04623ca14
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/074b0e4c-6171-43bd-aa98-f9e04623ca14/iazasnP
2025-08-30 13:22:14 +00:00
sebastjanartic
9f616d7d89
Reduce spacing between rows and category titles
...
Adjusted margin-bottom for the category row container and category titles in the netflix-grid component from `mb-2` to `mb-1` to decrease vertical spacing.
Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 074b0e4c-6171-43bd-aa98-f9e04623ca14
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/074b0e4c-6171-43bd-aa98-f9e04623ca14/iazasnP
2025-08-30 13:21:21 +00:00
sebastjanartic
98c1dfab2b
Adjust spacing and video sizes in the grid view for better usability
...
Update CSS classes in `netflix-grid.tsx` to reduce margin bottom for category titles and adjust the width of video elements within different screen size breakpoints.
Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 074b0e4c-6171-43bd-aa98-f9e04623ca14
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/074b0e4c-6171-43bd-aa98-f9e04623ca14/iazasnP
2025-08-30 13:20:33 +00:00
sebastjanartic
8b8664b2de
Reduce vertical spacing within video category rows
...
Adjusted margin-bottom for category containers and titles in `netflix-grid.tsx` to decrease vertical spacing.
Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 074b0e4c-6171-43bd-aa98-f9e04623ca14
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/074b0e4c-6171-43bd-aa98-f9e04623ca14/iazasnP
2025-08-30 13:19:27 +00:00
sebastjanartic
8ef2facc0c
Hide scroll buttons on mobile devices for better interaction
...
Modify the netflix-grid component to conditionally render left and right scroll buttons using Tailwind CSS's 'hidden md:flex' class, ensuring they are only visible on medium-sized screens and larger.
Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 074b0e4c-6171-43bd-aa98-f9e04623ca14
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/074b0e4c-6171-43bd-aa98-f9e04623ca14/iazasnP
2025-08-30 13:14:13 +00:00
sebastjanartic
77055dec61
Improve video display by hiding numbers on hover
...
Update the `CategoryRow` component to hide the "Top 10" number overlay when the mouse leaves the video or when hovering over a different video, and to display the number only when a specific video is not selected.
Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 074b0e4c-6171-43bd-aa98-f9e04623ca14
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/074b0e4c-6171-43bd-aa98-f9e04623ca14/7j5FE92
2025-08-30 13:05:00 +00:00
sebastjanartic
74a94cacac
Fix video disappearing when hovering over grid items
...
Reset clickedVideoId state on mouse enter in CategoryRow component to prevent unintended video hiding.
Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 074b0e4c-6171-43bd-aa98-f9e04623ca14
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/074b0e4c-6171-43bd-aa98-f9e04623ca14/7j5FE92
2025-08-30 13:03:14 +00:00
sebastjanartic
6583dfb235
Improve video grid interaction by preventing accidental hiding
...
Adjusted the `CategoryRow` component in `netflix-grid.tsx` to prevent the video details from hiding when hovering over a different video within the same category row, specifically when a video is already selected.
Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 074b0e4c-6171-43bd-aa98-f9e04623ca14
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/074b0e4c-6171-43bd-aa98-f9e04623ca14/7j5FE92
2025-08-30 13:02:49 +00:00
sebastjanartic
8d5dd20cf3
Improve video selection highlighting and display on hover
...
Update the `CategoryRow` component in `netflix-grid.tsx` to manage the `clickedVideoId` state. This state is used to conditionally render the "Top 10" number overlay on videos. When a video is clicked, its ID is stored in `clickedVideoId`. The overlay is now hidden if the `clickedVideoId` matches the current video's ID. Additionally, hovering over a video category row resets `clickedVideoId` to `null` to ensure the number reappears when the mouse leaves the video. The `onClick` handler for `VideoCard` is modified to update this state and then call the original `onVideoClick` prop.
Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 074b0e4c-6171-43bd-aa98-f9e04623ca14
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/074b0e4c-6171-43bd-aa98-f9e04623ca14/7j5FE92
2025-08-30 12:59:37 +00:00
sebastjanartic
b5f0bcb2ae
Improve video navigation by repositioning scroll buttons
...
Refactors the horizontal scrolling mechanism in the `netflix-grid.tsx` component, replacing broad scroll areas with targeted left and right arrow buttons. These buttons appear on hover and are positioned to prevent interference with video selection.
Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 074b0e4c-6171-43bd-aa98-f9e04623ca14
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/074b0e4c-6171-43bd-aa98-f9e04623ca14/7j5FE92
2025-08-30 12:58:16 +00:00
sebastjanartic
6af0b01f23
Stop automatic scrolling when moving the mouse away from the category
...
Adds a check to clear the existing scroll interval before starting a new one in the `startAutoScroll` function within the `CategoryRow` component.
Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 074b0e4c-6171-43bd-aa98-f9e04623ca14
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/074b0e4c-6171-43bd-aa98-f9e04623ca14/6upLu3q
2025-08-30 12:56:24 +00:00
sebastjanartic
0d97d83050
Add smooth scrolling to video rows by hovering over directional areas
...
Introduce auto-scrolling functionality to the CategoryRow component. When a user hovers over the left or right half of the row's area, the row will automatically scroll in that direction. This is achieved using `setInterval` for continuous scrolling and clearing the interval on mouse leave. The previous fixed buttons have been replaced with these interactive hover areas.
Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 074b0e4c-6171-43bd-aa98-f9e04623ca14
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/074b0e4c-6171-43bd-aa98-f9e04623ca14/6upLu3q
2025-08-30 12:52:34 +00:00
sebastjanartic
8716a2aae0
Improve scrolling experience by adjusting video grid spacing
...
Adjusted padding and margins in the Netflix grid component to allow for true edge-to-edge display of videos and ensure sufficient space for scroll buttons on various screen sizes.
Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 074b0e4c-6171-43bd-aa98-f9e04623ca14
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/074b0e4c-6171-43bd-aa98-f9e04623ca14/6upLu3q
2025-08-30 12:50:03 +00:00
sebastjanartic
50fa13147f
Improve video browsing experience with adaptive scrolling and full-width display
...
Adjusts `CategoryRow` component to utilize viewport width for scroll amounts and applies responsive widths to video cards, enhancing horizontal navigation across different screen sizes.
Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 074b0e4c-6171-43bd-aa98-f9e04623ca14
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/074b0e4c-6171-43bd-aa98-f9e04623ca14/6upLu3q
2025-08-30 12:48:43 +00:00
sebastjanartic
30b8be3502
Adjust video display and scrolling for improved mobile viewing
...
Update CSS and JavaScript to implement responsive card widths, adjust scroll amounts for different screen sizes (mobile, tablet, desktop), and modify hover effects for a better user experience on mobile devices.
Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 074b0e4c-6171-43bd-aa98-f9e04623ca14
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/074b0e4c-6171-43bd-aa98-f9e04623ca14/6upLu3q
2025-08-30 12:46:46 +00:00
sebastjanartic
2355fc4da6
Restored to '7fd7127003398a269f1f765208c8baced728aafb'
...
Replit-Restored-To: 7fd7127003
2025-08-30 12:39:34 +00:00
sebastjanartic
bdfd7a4b08
Adjust layout for better video display and content visibility
...
Update netflix-grid.tsx to remove z-index from the main container and home.tsx to set overflow-visible on the main element.
Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 2eb1084e-b728-4449-9231-f1665924c8d5
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/2eb1084e-b728-4449-9231-f1665924c8d5/kdQ95gE
2025-08-29 18:05:47 +00:00
sebastjanartic
855d7e2448
Implement a smooth scrolling carousel for video categories
...
Introduces a new `SimpleCarousel` component to replace `CategoryRow` for displaying videos within categories, enabling smooth horizontal scrolling with auto-scroll and navigation buttons.
Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 2eb1084e-b728-4449-9231-f1665924c8d5
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/2eb1084e-b728-4449-9231-f1665924c8d5/yexZbDm
2025-08-29 17:16:20 +00:00
sebastjanartic
95cc839838
Improve video carousel scrolling by using native scroll functionality
...
Refactors the `CategoryRow` component in `netflix-grid.tsx` to utilize the browser's native `scrollBy` method for smoother and more performant horizontal scrolling of video categories, replacing the previous manual translation logic.
Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 2eb1084e-b728-4449-9231-f1665924c8d5
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/2eb1084e-b728-4449-9231-f1665924c8d5/yexZbDm
2025-08-29 17:13:36 +00:00
sebastjanartic
91617c8835
Improve video carousel scrolling experience for smoother navigation
...
Refactors the Netflix grid component's horizontal scrolling implementation. Instead of using CSS transforms for manual positioning, it now utilizes the browser's native smooth scrolling behavior via `scrollBy` on a container with `overflow-x-auto`. This change aims to resolve issues where videos were not scrolling correctly and to provide a more fluid user experience. The `scrollContainerRef` is introduced to directly access the DOM element for scrolling. The component now relies on CSS to manage the display of the carousel items, eliminating the need for manual `translateX` state management and fixed video widths for calculation.
Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 2eb1084e-b728-4449-9231-f1665924c8d5
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/2eb1084e-b728-4449-9231-f1665924c8d5/yexZbDm
2025-08-29 17:07:20 +00:00
sebastjanartic
e554b8a346
Simplify video carousel to allow easier scrolling and reduce complexity
...
Remove seamless infinite scroll logic from the video carousel and replace it with a simpler implementation that renders multiple copies of videos, along with adjusted scrolling functionality.
Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 2eb1084e-b728-4449-9231-f1665924c8d5
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/2eb1084e-b728-4449-9231-f1665924c8d5/yexZbDm
2025-08-29 17:05:15 +00:00
sebastjanartic
75e3d4b1f9
Created a checkpoint
...
Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 2eb1084e-b728-4449-9231-f1665924c8d5
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/2eb1084e-b728-4449-9231-f1665924c8d5/yexZbDm
2025-08-29 17:03:57 +00:00
sebastjanartic
3e6d01c2ac
Improve video carousel behavior for smoother navigation
...
Adjusted the logic for wrapping around video categories in the carousel to prevent jarring jumps and ensure a more fluid user experience. The carousel now initializes in a centered position to facilitate seamless looping.
Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 2eb1084e-b728-4449-9231-f1665924c8d5
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/2eb1084e-b728-4449-9231-f1665924c8d5/yexZbDm
2025-08-29 17:00:47 +00:00
sebastjanartic
9e185a1dfd
Improve scrolling behavior and initial positioning in video grids
...
Refactor the `CategoryRow` component in `netflix-grid.tsx` to adjust the logic for seamless infinite scrolling. The changes modify how the component wraps around when scrolling left or right past the initial set of videos, ensuring a smoother transition. Additionally, the initial positioning of the carousel has been reset to the beginning of the first set of videos (0 position), improving the starting experience for users.
Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 2eb1084e-b728-4449-9231-f1665924c8d5
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/2eb1084e-b728-4449-9231-f1665924c8d5/yexZbDm
2025-08-29 16:59:33 +00:00
sebastjanartic
ba2856ede7
Improve video scrolling with seamless infinite looping
...
Update client-side logic to implement a triple-copy approach for videos, enabling smooth, seamless infinite scrolling. Adjust initial translation and scroll calculations to support the new wrapping mechanism.
Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 2eb1084e-b728-4449-9231-f1665924c8d5
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/2eb1084e-b728-4449-9231-f1665924c8d5/yexZbDm
2025-08-29 16:57:14 +00:00
sebastjanartic
a069bca552
Improve scrolling behavior in video category rows with wrap-around
...
Update the `CategoryRow` component to implement wrap-around scrolling logic for video navigation. This change modifies the `scroll` function to handle transitions when reaching the beginning or end of the video list, ensuring a smoother user experience by preventing abrupt stops and allowing continuous scrolling. The `willChange: 'transform'` CSS property is also added for performance optimization during scrolling animations.
Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 2eb1084e-b728-4449-9231-f1665924c8d5
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/2eb1084e-b728-4449-9231-f1665924c8d5/yexZbDm
2025-08-29 16:55:32 +00:00
