AdguardForAndroid icon indicating copy to clipboard operation
AdguardForAndroid copied to clipboard

Improve surface and system bar color

Open robifr opened this issue 1 year ago • 1 comments

Current surface color (pop-up dialog, card, bottom navigation, etc.) looks bad and quite inconsistent together with the background color.

  1. Pop-up dialog color with dark material theme is hardly distinguishable with the background color. Screenshot_2024-01-24-12-35-19-043_com adguard android-edit
    For both white and white material theme it could be improved later with a new surface color. I was thinking to use the same color as white themed system navigation bar color (#F3F3F3). But we have to consider whether the color is suitable or not. I'm afraid people start to think the dialog is disabled. Screenshot_2024-01-24-13-04-06-750_com adguard android-edit

  2. Card surface color on the homepage for both dark and dark material theme is good and colorful. Screenshot_2024-01-24-12-51-52-961_com adguard android-edit Screenshot_2024-01-24-12-52-10-916_com adguard android-edit
    Not so much for white and white material theme, its bland. For white material theme, we could use the same yellow color as the dark material theme. For white theme, it could be improved later considering the issue I have talked before. Screenshot_2024-01-24-13-11-32-883_com adguard android-edit Screenshot_2024-01-24-12-51-36-486_com adguard android-edit


Now for system status bar, I believe it should have use the same color as toolbar or background if there's none. System navigation bar — classic Android three menu buttons — use the same color as bottom navigation bar or background if there's none. Bottom navigation bar — AdGuard navigation — should have use a different color than background. At least thats how most Android apps are implemented. Few example are Play Store, Gmail, WhatsApp, anything.

  1. This system bar color on dark theme is good. It blends with their surrounding — background color. Screenshot_2024-01-24-12-55-54-539_com adguard android-edit
    However for white and dark theme... Screenshot_2024-01-24-12-55-23-726_com adguard android-edit Screenshot_2024-01-24-12-55-42-116_com adguard android-edit

  2. Both bottom and system navigation bar on dark theme is good. It has a color difference from the background, whilst having the same color for both navigation. Screenshot_2024-01-24-12-41-37-439_com adguard android-edit
    However on dark material theme, all the color are same. Screenshot_2024-01-24-12-58-06-580_com adguard android-edit
    On white theme, it's quite inconsistent. I guess it safe to use the same color for bottom navigation bar color as the system navigation bar. Screenshot_2024-01-24-12-41-51-437_com adguard android-edit

robifr avatar Jan 24 '24 07:01 robifr

@robifr thanks for the detailed information! We will fix it in the next updates

maxikuzmin avatar Jan 29 '24 14:01 maxikuzmin