Moonbeam/Moonriver update logos and colors

[albertov19]

✅ Checklist

• npx changeset was attached.
• Covered by automatic tests.
• Impact of the changes:

📝 Description

Updated the Moonbeam/Moonriver logos and colors to follow the new Moonbeam/Moonriver brand guidelines

🧐 Checklist for the PR Reviewers

• The code aligns with the requirements described in the linked JIRA or GitHub issue.
• The PR description clearly documents the changes made and explains any technical trade-offs or design decisions.
• There are no undocumented trade-offs, technical debt, or maintainability issues.
• The PR has been tested thoroughly, and any potential edge cases have been considered and handled.
• Any new dependencies have been justified and documented.
• Performance considerations have been taken into account. (changes have been profiled or benchmarked if necessary)

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
web-tools	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Oct 9, 2024 5:50am

3 Skipped Deployments

Name	Status	Preview	Comments	Updated (UTC)
ledger-live-docs	⬜️ Ignored (Inspect)	Visit Preview		Oct 9, 2024 5:50am
native-ui-storybook	⬜️ Ignored (Inspect)	Visit Preview		Oct 9, 2024 5:50am
react-ui-storybook	⬜️ Ignored (Inspect)	Visit Preview		Oct 9, 2024 5:50am

[vercel]

@albertov19 is attempting to deploy a commit to the LedgerHQ Team on Vercel.

A member of the Team first needs to authorize it.

[albertov19]

Hey @ypolishchuk-ledger any updates here 😄 thanks in advance

not actual

[github-actions]

There as been no activity on this PR for the last 14 days. Please consider closing this PR.

[albertov19]

Waiting on review from the Ledger Team :)

[albertov19]

Hey all - any updates here? Thanks in advance

[Wozacosta]

Hey there, the svgs you submitted have some extra tags that make them not render (at all).

Could you maybe try to export them as plain svg (Im guessing you used inkscape or something similar as there are sodipopi tags in the svg https://wiki.inkscape.org/wiki/Inkscape_SVG_vs._plain_SVG).

At the very least for Moonriver, as I was able to clean the Moonbeam svg and make it display properly.

FYI you can use this tool to validate the svgs beforehand without having to build Ledger Live: https://live.ledger.tools/svg-icons.
It catches common tags are missing attributes that could result in the logos not displaying properly.

[albertov19]

@Wozacosta I pushed new SVGs following your suggestions, thanks!

@VicAlbr @bharamboure-ledger please check again 🙏

[Wozacosta]

Checked again, didn't display correctly, here's the versions I modified that make them displayable in desktop:

[albertov19]

Ah @Wozacosta but then the checker is not correct. Your SVGS have just a viewBox and an image tag that has the base64 content while the ones I've been working with have the geometric definitions with circle and path, etc. Nevertheless, your image does not pass the provided SVG checker tool.

Unsure how to proceed as the latest images I tested pass the checker.

[albertov19]

@Wozacosta Hey, I hope you are well. Any thoughts on my post above? Would love to get this merged

[Wozacosta]

Hey @albertov19, the SVG checker tool is mainly used for a quick overview of potential errors, but it not passing doesn't necessarily means the SVG won't be displayed.
Have you tried exporting your svgs as plain svgs (or even plain pngs) ?

I'll try to fit in some time to tests those then, but it would help if you're able to test how they're displayed in Ledger Live.

[albertov19]

Hey @Wozacosta - I've pushed another commit that should solve all issues! The problem I was having was that I was uploading a <circle> that enclosed the icon, so Ledger was recoloring the entire symbol circle.

The last SVGs are OK in Ledger's SVG checker, but I also built Ledger Live locally with these SVGs, and they show fine 😄

It was definitely a learning experience haha, hope this helps getting this PR merged 🚀

[Wozacosta]

Amazing work, Im testing it on mobile and if that's good I'll approve!

Edit: svgs can be a pain sometimes.. yeah. Glad you kept trying!

[Wozacosta]

Mobile looks good:

[Wozacosta]

Don't forget to rebase your PR, somes failing tests will be successful then.

[albertov19]

@Wozacosta, I noticed a minimal margin on mobile. I don't have an easy way to test the mobile version, but I bumped a version with larger margins that looks better on the desktop.

That is why I submitted a new commit and your approval was dismissed