marleymarl / geotimeline-website Goto Github PK

Mobile:

• 1. The whole hero / CTA component needs to be wider on mobile so it fits on the screen
• 2. Steps need more work on styles and content. (There is no design for these)
• 3. The logo / brand text is broken on mobile.
• 4. FAQ comp is too narrow on mobile.
• 5. Carousel needs sorting on mobile. Too narrow / whitespace issue
• 6. General responsiveness needs attention (whitespace, font size, etc)

Desktop

• 1. Same as number 2 above
• 2. The scroll-to-content icon isn't linked
• 3. General font size tweaks - up the font size a bit for body text

General page improvements and notes

Other enhancements welcome but I think tackling the Mobile then Desktop specific issues is priority.

Would be nice to have the active nav item change when user manually scrolls to it's anchored element.

This makes navigation management easier. We should divide the page into views that are neatly separated in space and are compatible to be implemented in both web and mobile views. Then:

1. There is already a down-circle icon on the page that does nothing. We can make it work. up-circles can be added as well.
2. Do issues #22 and #18

A nice to have, perhaps, would be a component that plots contributors / volunteers locations on a map, using the GitHub API. @marleymarl

Link to the Figma file:
https://www.figma.com/file/NIcQzGWJlQFqKMkG9hbUwc/GeoTime?node-id=105%3A299

Sticky header with subtle drop shadow and transitions on sticky would be a nice addition

1. Little notch in the bottom of navbar
2. If the map throws an error, the prompt will move over the navbar (zindex)
3. There are 2 hyperlinks in FAQ answer texts
4. Carousel not worknig

AFAIK Ant Design is pretty accessible out of the box but if someone with a keen eye for accessibility could have some input, that'd be great. Lighthouse audit below:

This GitHub issue mentions inaccessible forms in Ant Design.

@marleymarl thoughts?

As suggested by @wakoong in the general channel:

Would it be okay for me to try refactoring codes from HomePage.js? I think there are some DRY codes that can be cleaned up. 🙂
Also, how about we add prettier to standardize our code formats to reduce future conflicts?
😎

We need project related info in the readme.

This would be nice to have for smoother transition between page sections.

Less to be added and used in the site and some theme overrides added.

The homepage (initially) needs Layout components added and the layout tidied up.