Fix/landingpage-product-section #709
Conversation
Srinu346
force-pushed
the
fix/landingpage-product-section
branch
4 times, most recently
from
35b7cfe to
335fd5d
Compare
There was a problem hiding this comment.
Hey @Srinu346, as I mentioned earlier, we don’t want to make any changes to the existing product section since it already looks good. However, in this PR, you’ve updated that section on the product page. We didn’t notice any issues with the existing landing page on the desktop version.
There was a problem hiding this comment.
Hey @Srinu346, as I mentioned earlier, we don’t want to make any changes to the existing product section since it already looks good. However, in this PR, you’ve updated that section on the product page. We didn’t notice any issues with the existing landing page on the desktop version.
Also, the pipelines are currently failing. Please mention the specific changes you made in the PR, as I couldn’t understand them clearly. In the PR description, you mentioned the updates were for small screens, but the changes are also reflecting on the desktop version.
Srinu346
force-pushed
the
fix/landingpage-product-section
branch
from
335fd5d to
a153ec4
Compare
Signed-off-by: Akella Srinivas <alsrinivas.346@gmail.com>
Srinu346
force-pushed
the
fix/landingpage-product-section
branch
from
a153ec4 to
9ad61e6
Compare
|
@Achanandhi-M sir please have a look, hopes that didn't mess it up this time. Before Changes
After Changes
Mobile ViewScreen.Recording.2025-10-28.222841.mp4 |
src/components/Product.js
Outdated
| return ( | ||
| <div className="rounded-lg"> | ||
| <ul className="grid auto-cols-[300px] grid-flow-col gap-3 lg:gap-5"> | ||
| <ul className="grid grid-flow-row md:grid-flow-col md:auto-cols-[300px] gap-3 lg:gap-5"> |
There was a problem hiding this comment.
Why there are two grid styles implement, we already have grid style in the code
There was a problem hiding this comment.
Sir removing ( auto-cols-[300px]) was disturbing the desktop version in little way so i avoided it, if it's ok then i will align the boxes and remove the additional grid style .
There was a problem hiding this comment.
Sir removing ( auto-cols-[300px]) was disturbing the desktop version in little way so i avoided it, if it's ok then i will align the boxes and remove the additional grid style .
No the point is there are two grid sections in the updated code, if you are solving for the small screen better use media screens dont change the existing style
There was a problem hiding this comment.
Sir, I have used two grid styles one for small screen and one for desktop version which was already there, even after trying for using media screen, some styles were not getting overidded sir (grid-flow-row) was not getting overidded sir.
There was a problem hiding this comment.
Screen.Recording.2025-10-31.010643.mp4
|
Sir, the prettify error mentions branch not found even though i have raised my pr from my fork and from the same branch . |
there is a command you need to run before everything you push the code to github, use this command, npx prettier --write '**/*.{js,md}' |
Signed-off-by: Akella Srinivas <alsrinivas.346@gmail.com>
Thank you Sir. |
Signed-off-by: Akella Srinivas <alsrinivas.346@gmail.com>
Sir have used this command, even tough same error is coming. |
2 participants
What has changed?
The Products section on the landing page has been updated to ensure it is fully responsive across all screen sizes.
Productscontainer for a better user experience on mobile, tablet, and desktop views.Type of change
How Has This Been Tested?
I have manually tested the changes by resizing the browser window across common breakpoints to simulate different devices.
The screenshot below confirms the corrected layout on a wide desktop viewport:
After Changes
Checklist: