Nav bar redesign

[0x4Graham]

The following ticket will cover all the redesign task items for the Pool Overview Page Redesign/Improvements

Please ensure you update the component library(story book) for all existing & new components

https://www.figma.com/design/ng7qdNcSCXSDA6ZUdWIs6u/Pool-Overview%2F-Pool-Detail?node-id=2173-41892&t=UbtuoHdsKv1ZIAVQ-0

• [x] Title of page changes to Pools of real-world assets in semi bold size 16

• [x] Change the colour of the sidebar #252B34. When tab selected or hovered over, change the colour of the text in the menu bar to: #FFC500. Ensure that we update the story book components for this as well.

• [ ] Button colour changes.

• For connect wallet: #252B34

• For secondary buttons: yellow

• For primary: #252B34

• [ ] Remove the graph at the top of the page. Colour of the values text needs to be: #37394C and the headings: #82888D (Need to ensure that we're able to query the values)

• Total Value Locked (TVL) with small YoY growth %

For Archive Pools

• [ ] Change font colour for "View Archived pools" to 82888D
• [ ] Remove underline and replace with >

Storybook

• Make sure components used for the changes load in Storybook and fix if not

[kattylucy]

Can I get a design for the button "create a pool"

@sonam-jo @BrianCarter-Design

[sonam-jo]

This doesn't fall under the primary/secondary colour system? Then let's do the background grey 82888D and the text colour 252B34

[kattylucy]

You are right, it does fall under primary/secondary. @sonam-jo

[0x4Graham]

@kattylucy This PR breaks the transaction history page at the top

The button is overlaying on the table

[kattylucy]

I just deploy a fix for this, like 2 min ago @0x4Graham

[kattylucy]

https://app-dev.k-f.dev/#/history @0x4Graham

[BrianCarter-Design]

On the Pools pages, the "Connect" button should be inline with the page heading. So up into the pink space in this screenshot.

The light grey buttons for download (which you commented on in Figma)

I think the new tab design looks good. Could we just use a slightly lighter font weight or colour on the non-active tabs

Lastly, on the pools landing page. When you hover over a pool card, can we make the outline charcoal when you hover to show that it's clickable. See below:

[kattylucy]

Thank you! @BrianCarter-Design - The tabs and the gray button would be handle in the pool overview redesign, I think this ticket is misleading, this ticket is only for the nav bar on the left side

[0x4Graham]

@kattylucy do you want a standalone ticket for the navbar on the top?

[kattylucy]

do you mean for the tabs on pool over view page? That one I'm fixing on the pool overview changes. @0x4Graham

And the connect button position is part of this ticket. I fixed it yesterday, waiting for code review