Latest solutions
Browser Extensions Mangager Using React and Tailwind CSS
#react#tailwind-css#post-cssSubmitted 29 days agoAnything!
Interactive E-commerce Product Page-Responsive UI with Cart & Lightbox
#tailwind-cssSubmitted 29 days agoAnything!
Latest comments
- @manjirigole@Shakshi-Mittal-Tech
When toggling, the extension immediately goes to the 'Inactive' state and is no longer visible under the 'All' tab. Ideally, both active and inactive extensions should be visible in the 'All' section
- @mdoaa@Shakshi-Mittal-Tech
You've done a great job implementing the core e-commerce features like the cart functionality, lightbox modal, and responsive layout. The overall UI structure looks clean and functional.
A few suggestions to enhance it further:
🟡 Overlay Bug: After closing the sidebar menu, the dark overlay still stays — consider removing it when the menu is closed.
🟡 Lightbox Alignment: The image lightbox on desktop opens well, but it sometimes feels slightly off-centered. A minor tweak can make the viewing experience smoother.
🟢 Mobile Slider: The mobile image carousel works well — consider adding some smooth transitions for a more fluid feel.
🟢 Cart Badge: Works as expected! You might add a quick animation on item add to make it more interactive.
Overall, you're very close to a polished UI. Great work — just fix a couple of those UX details and it’ll feel super professional!
- @AnjulAryal@Shakshi-Mittal-Tech
Your rating component design is clean and user-friendly, with a soft color palette that feels approachable and welcoming. The light background and pastel accents give it a classic, gentle look, which works well for general audiences.
One area you might enhance is the visual hierarchy—using slightly bolder headings and increasing padding around text could help content stand out more clearly.
Overall, it’s a neat and intuitive design; refining spacing and interactive feedback would make it even stronger.
Marked as helpful - @alberthgrande@Shakshi-Mittal-Tech
A clean and user-friendly interface with smooth real-time updates for tip and total amounts. The predefined tip options and custom input work well, and the reset button adds convenience.
To improve further, consider using semantic HTML elements for better accessibility, adding input validation for cases like zero or blank entries, and enhancing keyboard navigation with proper focus styles.
Formatting the output as currency would also make the results more polished. Overall, it's a solid and functional project with room for a few refinements.
- @bogoreh@Shakshi-Mittal-Tech
Hey! Your version has good use of shadows and hover animations, which add depth and interactivity.
The color palette is well-matched to the original. However, the major issue here is with text alignment, especially on mobile devices.
The “Last Week - Xhrs” text appears next to or too close to the main hour count like “10hrs,” causing visual overlap and confusion.
Also, the font weight and size feel slightly off compared to the original, making the layout appear heavier and less refined.
Fixing the mobile text flow and adjusting typography would significantly improve this version's clarity and aesthetic.
- @VickyAzola@Shakshi-Mittal-Tech
Hey! Your version stands out for its use of Tailwind CSS and has a modern, clean structure. The responsiveness is well-handled and the overall layout works well on different screen sizes.
However, the font used doesn't quite match the original Rubik font, which slightly changes the look and feel.
Also, the alignment and spacing of time data (like “10hrs” and “Last Week - 8hrs”) are not perfectly aligned, making it look a bit unbalanced in some sections.
Improving text alignment and switching to the Rubik font will bring it much closer to the original design and enhance the professional appearance.