thunder-app / thunder

Thunder - An open-source cross-platform Lemmy client for iOS and Android built with Flutter
https://thunderapp.dev
GNU Affero General Public License v3.0
705 stars 62 forks source link

Use Material 3 Segmented buttons #1321

Open codenyte opened 2 weeks ago

codenyte commented 2 weeks ago

Is Your Feature Request Related to a Problem?

Since most of the app was updated from M2 to M3, I think the same should be done for segmented buttons. They are used in multiple places of the app, for example the Account and Inbox page.

Feature Description

Replace the old Material 2 segmented buttons with the Material 3 version: https://m3.material.io/components/segmented-buttons/

Another thing that has been bothering me for quite a while is this weird grey background for on the accounts page (I highlighted it in red), perhaps this could also be removed? I think it looks really weird and almost seems to be a bug.

Alternative Solutions

N/A

Additional Context

Btw, would it be a good idea to just have one single issue for all Material 3-related things?

micahmo commented 2 weeks ago

Just a note that we might consider using something like tabs in place of where we currently use ChoiceChips and MD2-style segmented buttons (aka ToggleButtons).

For example, here are some mockups for a redesigned search page and here was an initial take at redesigning the user page, both using tabs.

weird grey background for on the accounts page

Hmm, I don't think I can see that. What accent colors are you using?

image
codenyte commented 2 weeks ago

Just a note that we might consider using something like tabs in place of where we currently use ChoiceChips and MD2-style segmented buttons (aka ToggleButtons).

That's a great idea, I just suggested segmented buttons because they are the closest thing to the current design. The mockup looks great btw!

Hmm, I don't think I can see that. What accent colors are you using?

Material You with a fully back (#000000) wallpaper