Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Design system and icon updates for 2.0 #5938

Merged
merged 8 commits into from May 19, 2024

Conversation

dennisreimann
Copy link
Member

@dennisreimann dennisreimann commented Apr 18, 2024

WIP, will update this in an ongoing manner as we progress with 2.0 and the app.

Closes #5485.

@dennisreimann dennisreimann added the UI / UX Front-end issues, for front-end designers label Apr 18, 2024
@dstrukt
Copy link
Member

dstrukt commented Apr 18, 2024

iconography reference issue: #5485

@dstrukt
Copy link
Member

dstrukt commented Apr 18, 2024

Documenting as I work through everything. Might have more comments, will add them as I go.

Few suggestions and nits:

  • nav-explore could be more specific nav-explore-plugins?
  • nav-settings to nav-store-settings?
  • rename nav-menu to nav-mobile-menu?

  • do we really want to distinguish nav-back (don't remember where we use explicitly) vs. just using the back icon?
  • same for nav-close?

  • we don't have an "invite accepted" notification icon specifically
  • add caret-left and caret-right (will export)

@dennisreimann
Copy link
Member Author

This one is ready for now, let's try to integrate it soon. Can you give it a review, @dstrukt?

@NicolasDorier
Copy link
Member

Code ACK, didn't visually checked though

@dstrukt
Copy link
Member

dstrukt commented May 15, 2024

Have a few last icons for you that won't dramatically change up the code, but yes - will get this reviewed/merged asap!

We're not planning to deprecate the Font Awesome code in this PR are we?

@dennisreimann
Copy link
Member Author

Replaced more icons, e.g. on the HWW screen:

vault

Font Awesome icons are almost replaced, there are only these remainders:

  • fa-sort + fa-sort-desc
  • fa-sort-alpha + fa-sort-alpha-desc
  • fa-spinner

@dstrukt
Copy link
Member

dstrukt commented May 16, 2024

Shouldn't this be the X not the ... for the Vault SS?

Otherwise, sent the remaining icons via DM. Will get my review in here shortly!

@dennisreimann
Copy link
Member Author

The dots are for the "waiting" states, like waiting for the connection or user inout. It was a "?" before, but I think the dots work better here.

Copy link
Member

@dstrukt dstrukt left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

tACK! Changes LGTM, assuming there will be no issues with the latest icon additions, and can always apply a patch if there's any strange errors that arise.

The only regression I've noticed is on the app side, with the invoices tab being changed to the other document looking icon, instead of the below (which is what it should be):

Screen Shot 2024-05-16 at 9 48 54 PM

@dennisreimann
Copy link
Member Author

Ok, now everything is replaced and Font Awesome is removed 🎉

@dstrukt
Copy link
Member

dstrukt commented May 18, 2024

final tACK

this is satisfying

Screen Shot 2024-05-18 at 12 34 52 PM

@NicolasDorier NicolasDorier merged commit fc9d4f9 into btcpayserver:master May 19, 2024
4 checks passed
@dennisreimann dennisreimann deleted the design branch May 20, 2024 10:34
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
UI / UX Front-end issues, for front-end designers
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Consolidate and improve iconography across app
3 participants