Pranith-Kantamneni
commented
2 weeks ago @ANSHIKA-26 I have a better idea of making it visually aesthetic can you please assign it to me Rather than resizing images I would like to change the way the grid is coded , I would use flexbox to remove the empty spaces in it. at last whichever PR is better you can merge it
Description:
Currently, some images and divs within the application do not maintain a consistent size or alignment, leading to a disjointed user experience. This issue aims to standardize the sizing of images and divs for a more cohesive layout.
Proposed Improvements:
Image Resizing:
Review all images used in the application and resize them to ensure they fit well within their respective containers. Implement CSS rules to maintain aspect ratios for images to prevent distortion. Div Resizing:
Assess the dimensions of all div elements and adjust their sizes to create a more balanced and visually appealing layout. Use Flexbox or Grid layout to enhance responsiveness and alignment of divs. Responsive Design:
Ensure that resized images and divs maintain their proportions across different screen sizes (mobile, tablet, desktop). Test the layout on various devices to ensure consistent user experience. Performance Considerations:
Optimize images for faster loading times without sacrificing quality. Acceptance Criteria:
All images should be appropriately resized and maintain their aspect ratios. Div elements should be consistently sized and well-aligned within the layout. The layout should be responsive and visually appealing across all device sizes. Additional Notes: If you have specific images or divs in mind that need attention, please include them in your comments.