Skip to content

homescreen_icon: Swap All-Messages icon from 'globe' to 'list'. - #5471

Closed
dootMaster wants to merge 2 commits into
zulip:mainfrom
dootMaster:iconChange5303
Closed

dootMaster wants to merge 2 commits into
zulip:mainfrom
dootMaster:iconChange5303

Conversation

@dootMaster

@dootMaster dootMaster commented Aug 20, 2022 •

Copy link
Copy Markdown

to match mobile's All Messages icon with the one found in web Zulip.

Previous Mobile:
Screen Shot 2022-07-30 at 5 41 14 PM

Browser:
Screen Shot 2022-08-19 at 8 19 26 PM

Update Mobile:
Screen Shot 2022-08-19 at 5 57 20 PM

Fixes: #5303

Leslie Ngo added 2 commits August 19, 2022 20:04
to ready the component for icon swap. TopTabButtonGeneral can
consume the SpecificIconType component, which can return icons from
FontAwesome collection. TopTabButton currently returns icons from
the Feather collection.
to match mobile's All Messages icon with the one found in web Zulip.

Fixes: zulip#5303
@dootMaster

dootMaster commented Aug 20, 2022 •

Copy link
Copy Markdown
Author

@chrisbobbe @alya @gnprice

Regarding the previous PR review from Chris:

Thanks, @dootMaster!
One nit: the web app uses Font Awesome for this icon, and this PR would use Feather.
The difference is pretty small; the order of short and long lines is just reversed:

But we might as well use exactly the same icon while we're making this change.

I've swapped the Feather icon for the FontAwesome one, but I noticed the new list icon from the FontAwesome collection doesn't quite match the aesthetic of the rest of the icons. The lines are bolder. What do ya'll think?

Here's Feather's list icon from my last PR for convenience:
Screen Shot 2022-07-30 at 5 41 49 PM

@dootMaster

dootMaster commented Aug 24, 2022 •

Copy link
Copy Markdown
Author

One solution would be to to invert the old Feather list icon via the transform in the style prop. I'm going to try it and post the result.

@dootMaster

dootMaster commented Aug 24, 2022 •

Copy link
Copy Markdown
Author

Here's what I came up with:
Screen Shot 2022-08-23 at 6 55 15 PM

I did this by swapping back to Feather in the makeIcon function and passing in [{ scaleY: -1 }] to the transform.

@chrisbobbe

chrisbobbe commented Aug 27, 2022 •

Copy link
Copy Markdown
Member

One solution would be to to invert the old Feather list icon via the transform in the style prop. I'm going to try it and post the result.

Huh, interesting! Sure, that seems fine; thanks for the screenshot!

@gnprice

gnprice commented Aug 29, 2022

Copy link
Copy Markdown
Member

Agreed -- @dootMaster, I'd be glad to see a version of this PR that does what you showed in that last screenshot 🙂

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Use "list" icon for all-messages, matching web's new icon there

3 participants