mayank-0789 commented 1 week ago

Responsiveness Issue Report

Overview

The website is experiencing responsiveness issues when viewed on different screen sizes, particularly on mobile devices. This markdown file outlines the problems, proposed solutions, and tasks to improve the responsiveness across various devices.

Issue Summary

Problem: The website layout breaks or doesn't adapt properly on screens below 768px wide (e.g., mobile phones and smaller tablets).
Affected Components:
- Image scaling
- Not proper scaling of blogs and articles section

screenshot

Root Cause Analysis

Navigation Menu: The current flexbox CSS for the navigation bar does not wrap properly, causing items to overflow.
Images: Some images use fixed widths and heights rather than percentage-based values, making them not responsive.
Text Overflow: Lack of media queries to adjust font sizes or padding for smaller screens.
Buttons: Buttons have fixed widths and do not adjust based on viewport size, leading to misalignment.

Proposed Solutions

Use of Media Queries

mayank-0789 commented 1 week ago

Hey @sajalbatra Please assign this issue to me I would love to work on it

BitByteBoss commented 1 week ago

@sajalbatra please assign this issue i will make it responsive

sajalbatra commented 1 week ago

@mayank-0789 assigned