Poor Responsive Design+ Missing Logout Functionality on Android and Tablet Devices

[lavkeshmeena015]

Poor Responsive Design + Missing Logout Functionality on Android and Tablet Devices

Description

The current responsive design of our website/application does not function correctly on Android smartphones and tablet devices. Users are experiencing various issues that hinder usability and negatively impact the user experience. Additionally, there is no logout functionality available, which is a critical feature for user security and session management.

Affected Devices

• Android smartphones (various models)
• Tablets (both Android and iOS)

Specific Problems

1. Layout Issues:

   • Elements overlap or are misaligned.
   • Text and images do not scale appropriately, resulting in either being too small or too large.

2. Navigation Problems:

   • Menus and navigation bars are not easily accessible.

3. Performance Concerns:

   • Pages load slowly or lag when scrolling.
   • Some interactive elements (like sliders or carousels) do not respond well to touch gestures.

4. Missing Logout Functionality:

   • Users cannot log out of their accounts, which is essential for security and privacy.
   • The absence of a logout option prevents users from ending their sessions, potentially exposing their accounts to unauthorized access.

Steps to Reproduce

1. Open the website/application on an Android smartphone or a tablet.
2. Navigate to various sections of the site, particularly to message section.
3. Attempt to find and use the logout functionality.
4. Observe the layout, navigation, performance issues, and the absence of a logout option as described.

Expected Behavior

• The website/application should automatically adjust to fit the screen size and orientation of the device.
• Navigation elements should be easily accessible and usable.
• Text and images should scale appropriately without overlapping or excessive whitespace.
• Users should be able to easily find and use a logout option to securely end their sessions.

Screenshots

• missing logout button

• Elements overlap

Additional Information

• Operating systems: Android (version), iOS (version for tablets)
• Browsers: Chrome, Firefox, Safari

Possible Solutions

• Review and update CSS media queries to ensure proper scaling for different screen sizes.
• Test and optimize interactive elements for touch gestures.
• Ensure navigation menus are accessible and usable on smaller screens.
• Implement a visible and functional logout option accessible from all pages.
• Consider using responsive design frameworks or libraries (e.g., Bootstrap, Foundation) if not already in use.

Priority

High - This issue significantly affects user experience on widely-used devices.

As a GSSOC contributor

• [ ] @SamarthKadam I would like to contribute under GSSOC to resolving these issues. Please assign me this issue so I can start working on this. Thank you!

[SamarthKadam]

@lavkeshmeena015 Yes Im assigning this to you but make sure you make it responsive for Tablet as well as Mobile and also take care of the design side. So the tag im labelling is level3 so make the most of it

[lavkeshmeena015]

Hi @SamarthKadam ,

Thank you for assigning this issue to me. I appreciate the opportunity and will prioritize it to ensure it is addressed promptly and effectively.

[ShampaShaw]

assign me this issue under gssoc'24

[Sujal7ss]

@lavkeshmeena015 Are you still working on this issue?