Feature/adventurerList & navigation

[Majorfi]

Description

Following the PR #103, rework some part of the UI, trying to achieve a better UX/UI combinaison. A huge thank for @hanahem for this initial and essential work!!

Type of change

• Breaking change (fix or feature that would cause existing functionality to not work as expected)

Change details

• Update the landing page to display the current adventurer and the menu directly on the UI (UX: Town Navigation Enhancement #103)
• Update the list of adventurer for a more compact display
• Adding a page for the details of an adventurer on adventurer click
• Adding the favorite system for adventurer
• Updating the mobile menu navigation
• Removing the Inventory menu and adding the Storage page
• Adding the current page in the menu and a back to home button as suggested in PR UX: Town Navigation Enhancement #103
• Replace the switch dark/light mode on the bottom of the screen by a option button that display a modal to be able to switch theme and use the legacy layout for the adventurer list
• Some code cleaning on the actions + using of env variable for the ABIs
• Fixing name at the wrong place (was on class name instead of ID)
• Updating the current adventurer modal to reflect changes

Resources

[vercel]

This pull request is being automatically deployed with Vercel (learn more).
To see the status of your deployment, click below or on the icon next to each commit.

🔍 Inspect: https://vercel.com/rarityextended/rarity/Cic52mFY96BeArToi9Kw1WvotZMu
✅ Preview: https://rarity-git-feature-adventurerlist-rarityextended.vercel.app

[hanahem]

@Major-Eth Great work!

In the adventurers grid, there's an overflow-y-scroll attribute, when the grid has more than 8 items in big screens, the scrollbar is not triggered because a grid behavior defaults to taking the adequate height to display all its items.

I tried to reduce the grid's height, but it is not effective to shrink the grid when you have lots of adventurers.

It might be more appropriate to remove the scroll attribute here:

pages/index.js l:99
<div className={'grid grid-cols-2 md:grid-cols-4 gap-4 md:gap-8 gap-y-0 md:gap-y-4 overflow-y-scroll px-1'}>

[Majorfi]

I close this PR as it's merged with another branch that will be in a PR soon !
@hanahem change done, thank you !