UI adjustments for sky

[DaeunYoon]

Make UI adjustments to the UI to align with the new brand.
(color theme, logo)

Checklist:

• issue number linked above after pound (#)
  • replace "Closes " with "Contributes to" or other if this PR does not close the issue
• issue checkboxes are all addressed
• manually checked my feature / not applicable
• wrote tests / not applicable
• attached screenshots / not applicable

[LukSteib]

• NIT: On hover of this primary button the button caption becomes barely readable (see s1). Can we change that in a way that it's still readable (e.g. white)

s1

[DaeunYoon]

fyi: we need to update preview image that is used for twitter card later on as well :)

[valiafetisov]

Please add this back, as this is out of scope of this update. This banner is being used to differentiate staging from production, see it in action here: https://main.auctions-ui.k8s.sidestream.tech

[DaeunYoon]

I added the variable back, but not sure StagingBanner uses productionBannerURL.
I removed it with banner that refers to the electron app which was outlined in the issue. Do you think we need to bring this one back as well?

[valiafetisov]

Ah, maybe it's just a confusing name of the variable (as well as confusing use of it). This can be tested by providing PRODUCTION_BANNER_URL env variable to the frontend

[DaeunYoon]

Screenshots

I used mono icon for mobile-screen size (testing with web browser, the logo wasn't rendered properly on smaller screen)

(tested on chrome)

[valiafetisov]

Did some minor tweaks to the colors based on the Brand Guideline.

Screenshots

[LukSteib]

Sorry for NIT picking:

• ensure that font in dropdown for network and wallet has other color than black (e.g. white) because currently hard to read

s1

[DaeunYoon]