GeoNode / geonode

GeoNode is an open source platform that facilitates the creation, sharing, and collaborative use of geospatial data.
https://geonode.org/
Other
1.41k stars 1.11k forks source link

Proposal for Adding Mobile-Responsive Design to GNIP #11397

Open warriorBunny013 opened 10 months ago

warriorBunny013 commented 10 months ago

Proposal for Adding Mobile-Responsive Design to GNIP

web page: https://development.demo.geonode.org/people/?limit=5&offset=0 image

Overview

This proposal aims to enhance the user experience by making the GNIP website mobile-responsive. Currently, the website is not optimized for mobile view, leading to usability issues for users accessing the site on their mobile devices.

Proposed By

Uditi Das

Assigned to Release

This proposal is for GeoNode .

State

Motivation

The motivation behind this proposal is to address the growing trend of users accessing websites on mobile devices. By making the GNIP website mobile-responsive, we can provide a seamless experience to users regardless of the device they use. This update will improve user engagement, increase accessibility, and ensure the website remains competitive in today's digital landscape.

Proposal

To achieve a mobile-responsive design for the GNIP website, the following steps need to be taken:

  1. Layout Adjustments: Modify the layout of the website to adapt to different screen sizes and orientations. This includes rearranging content, resizing images, and adjusting font sizes.

  2. Media Queries: Implement CSS media queries to apply specific styling rules based on the device's screen width. This will ensure that the website's appearance is optimized for various screen sizes.

  3. Responsive Images: Use responsive image techniques to deliver appropriately sized images based on the user's device and viewport.

Backwards Compatibility

The proposed changes will not affect the website's current functionality. Users accessing the site from desktop devices will continue to experience the website as before.

Future Evolution

In the future, we can explore additional optimizations, such as progressive web app features, to further enhance the mobile experience.

Feedback

No relevant feedback received at the moment.

Voting

Project Steering Committee:

Links

Remove unused links below.

t-book commented 10 months ago

@warriorBunny013 GNIP stands for Geonode improvement process. With your ticket, do you mean to rework the peoples page? In that case I would guess a feature request should do it. ... In case basic functionality does not change... Also please note that there are two layout parts. The legacy pages served by django and the mapstore2 pages build by react ...

warriorBunny013 commented 10 months ago

Yes, Can I work on this issue? @t-book

giohappy commented 10 months ago

@warriorBunny013 as @t-book says, this is the legacy template. The plans are to migrate these pages to the new client, but for the moment we have to stick with them. Notice that the link to the people page has been hidden from the mobile version, and one of the reasons was that there weren't plans to optimize it for mobile.

Notice the links in the navbar; Mobile image

Desktop image

However, the profile page can be reached and it's also broken. If you want to contribute an improvement I would suggest to start from this page.

Can I work on this issue? @t-book

You don't need permission to contribute. Just prepare a PR and someone will review it (no grants on the timing though!)

edited: fixed formatting issue

t-book commented 10 months ago

@warriorBunny013 your contribution is very welcome. Next to the link @giohappy shared, I'd suggest to also go through https://github.com/GeoNode/geonode/blob/master/CONTRIBUTING.md