telosnetwork / open-block-explorer

The Open Block Explorer (OBE) is the first open source block explorer that is designed to support all AntelopeIO-based blockchains.

https://explorer.telos.net

Apache License 2.0

27 stars 24 forks source link

Implementation of Landing page #754

Closed jaegerfe closed 1 year ago

jaegerfe commented 1 year ago

Fixes #746

Description

Implementing landing page to allow Users to select their preferred network if they access the home URL (https:///) for the first time.

Test scenarios

Tested acessing home page without having localStorage preferred network key set to a chain and checked if the landing page was presented;
Tested acessing home page after selecting a preferred network and checked if the user was directed to the network page;
Tested if manually removing the localStorage preferred network key made the system present the landing page again;

Checklist:

[x] I have performed a self-review of my own code
[x] I have commented my code, particularly in hard-to-understand areas
[x] I have cleaned up the code in the areas my change touches
[x] My changes generate no new warnings
[x] I have checked my code and corrected any misspellings
[x] I have removed any unnecessary console messages
[x] I have tested for mobile functionality and responsiveness

netlify[bot] commented 1 year ago

Deploy Preview for obe-testnet ready!

Name	Link
Latest commit	d0e0422b2d4e663ddec6769b482894356481306d
Latest deploy log	https://app.netlify.com/sites/obe-testnet/deploys/650c4cbb6a26b500094aa6f6
Deploy Preview	https://deploy-preview-754--obe-testnet.netlify.app/
Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

netlify[bot] commented 1 year ago

Deploy Preview for obe-staging ready!

Name	Link
Latest commit	d0e0422b2d4e663ddec6769b482894356481306d
Latest deploy log	https://app.netlify.com/sites/obe-staging/deploys/650c4cbb20c4cc0008b0595a
Deploy Preview	https://deploy-preview-754--obe-staging.netlify.app/
Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

cloudflare-workers-and-pages[bot] commented 1 year ago

Deploying with Cloudflare Pages

Latest commit:	`d0e0422`
Status:	✅ Deploy successful!
Preview URL:	https://ac161060.open-block-explorer.pages.dev
Branch Preview URL:	https://746-landing-page.open-block-explorer.pages.dev

View logs

donnyquixotic commented 1 year ago

@jaegerfe approved but curious if there are plans to improve the chain selection UI in the future?

Some feedback:

text seems a bit crunched vertically (between 'Open' and 'Block') on mobile, could improve responsive
selection sidebar on desktop takes up a huge amount of real estate
would a dropdown be better? the background looks great and seems like it'd be better taking up the entire screen.

Something along these lines?

karynemayer commented 1 year ago

@donnyquixotic there are indeed plans to improve this page! This is a version with minimal effort design wise, copying the selector we already have in place.

I actually love your selector suggestion for mobile, but ideally I would like to list all the chains in the page itself