New issue
Advanced search Search tips
Note: Color blocks (like or ) mean that a user may not be available. Tooltip shows the reason.

Issue 723040 link

Starred by 1 user

Issue metadata

Status: Fixed
Owner:
Closed: Mar 2018
Cc:
Components:
EstimatedDays: ----
NextAction: ----
OS: Android
Pri: 3
Type: ----

Blocking:
issue 723025



Sign in to add a comment

[Snowflake] Unify general text styles (disabled, blue text, grays)

Project Member Reported by k...@chromium.org, May 16 2017

Issue description

As part of Snowflake, we would like to unify the following text styles:
+ Change all #34343, #444, and #333 text colors to Material Primary Grey 600 - 87% black - #DE000000  (except in the toolbar/omnibox)
+ Change all grey disabled text colors to Material Grey - 38% Black - #61000000
+ Change all blue text links that are Regular 14pt and smaller to #3367D6 - Except on the Incognito page. (Recents, Connection info, Page info, chooser, Settings > Save passwords (All Medium weight text links can stay at #4285F4)

Note: This is the most general of bugs so feel free to request breaking it out if it is too big.
 

Comment 1 by k...@chromium.org, May 16 2017

Cc: hannahs@chromium.org
Wanted to add an edit to:
"+ Change all blue text links that are Regular 14pt and smaller to #3367D6 - Except on the Incognito page. (Recents, Connection info, Page info, chooser, Settings > Save passwords (All Medium weight text links can stay at #4285F4)"

In light of a thread I wanted to clarify that this only applies to blue text on white backgrounds, and shouldn't affect incognito states or omnibox suggestions as they are 1/2 bold.

4285F4
Do we also need to unify descriptive text color from #646464 to 54% black?
Cc: hwi@chromium.org
+Hwi

I'm only aware if a one instance of #646464 (in infobars as secondary text) so I can't confidently say this should be a universal change.

hwi@ I intentionally didn't touch any of the infobar specs because I knew you spent so much time / research to create the guidelines for those, but let me know if you think we should update the text to 54% black instead.

huayinz@, would it be difficult for you to list any other instances where this appears?
With a quick code search, I see FREs, payments, promo dialogs, and infobars are using #646464 as descriptive text color. There might be more.

https://cs.chromium.org/search/?q=descriptive_text_color&sq=package:chromium&type=cs

https://cs.chromium.org/search/?q=%23646464+lang:xml&sq=package:chromium&type=cs

Comment 6 by hwi@chromium.org, Jul 31 2017

Please include inforbars to the unification effort. Thanks!


Should we change pure black text color to 87% black?

https://cs.chromium.org/search/?q=fre_text_color&sq=package:chromium&type=cs
For accessibility reasons we use Google Blue 700 for any blue text that is Regular (or thinner) 16sp or smaller, and we use Google Blue 500 for any blue text that is Medium (or bolder) 14sp. We also do not use type smaller than 12sp (also for accessibility).

And yes, the Material spec does not use 100% black for any text so we can remove this style and use 87% black instead.
Owner: huayinz@chromium.org
Status: Assigned (was: Available)
Screenshots
account_signin_blue_700.png
139 KB View Download
aw_snap_blue_700.png
74.0 KB View Download
ntp_learn_more_blue_700.png
1.6 MB View Download
recent_tabs_blue_700.png
127 KB View Download
save_password_blue_700.png
133 KB View Download
setting_learn_more_blue_700.png
147 KB View Download
signin_view_blue700_black_87.png
69.2 KB View Download
ToS_blue_700_black_87.png
136 KB View Download
Omnibox suggestion color to blue 700 in standard mode.
omnibox_dark_blue_700.png
122 KB View Download
omnibox_light_blue.png
167 KB View Download
hannahs@ - This dialog has 18sp blue link text, do you think the text size should be changed? I changed the color to blue 700 together with others for code simplicity. If this is not okay, I can always change it back.
other_forms_of_browsing_data_dialog.png
126 KB View Download
Hey Becky! Thanks so much for all the fast work! Everything looks good to me except 	omnibox_dark_blue_700.png Let's keep the suggestions at Google Blue 500 (since it's using mostly bold text).  

I've actually never seen that dialog before so thanks for capturing this!!! Lets use the same text styles as the ones we're using in the Data saver promo with Regular 23 at 87% for the title and Regular 14sp at 54% with 20 line height for the body copy. 

Thanks!
I thought the title should be Med 20sp like the "Add to Home Screen" dialog?
add_to_homescreen_dialog.png
148 KB View Download
Oh interesting, if that's more in parity with what the default Android dialog style is then let's go with that! Thanks!
screenshot of other forms of history dialog attached
other_forms_of_browsing_data_dialog_new.png
115 KB View Download
Project Member

Comment 16 by bugdroid1@chromium.org, Sep 8 2017

The following revision refers to this bug:
  https://chromium.googlesource.com/chromium/src.git/+/7d40ceab7039f28583f99693b3aa651fa71aeb52

commit 7d40ceab7039f28583f99693b3aa651fa71aeb52
Author: Becky Zhou <huayinz@chromium.org>
Date: Fri Sep 08 21:27:24 2017

[Snowflake] Unify small blue link text and grey text

+ Change blue link text no larger than Reg 16sp or Med 14sp 
  to google blue 700
+ Change "powered by chrome" in CCT to black 54
+ Change #333, #000 to black 87 (except omnibox and toolbar)

Bug:  723040 ,  723051 
Change-Id: I2c6b05bb6b7539c90c75b8aa790186f6ad23ad50
Reviewed-on: https://chromium-review.googlesource.com/646582
Commit-Queue: Becky Zhou <huayinz@chromium.org>
Reviewed-by: Ted Choc <tedchoc@chromium.org>
Reviewed-by: Theresa <twellington@chromium.org>
Cr-Commit-Position: refs/heads/master@{#500684}
[modify] https://crrev.com/7d40ceab7039f28583f99693b3aa651fa71aeb52/chrome/android/java/res/layout/contextual_search_promo_view.xml
[modify] https://crrev.com/7d40ceab7039f28583f99693b3aa651fa71aeb52/chrome/android/java/res/layout/contextual_suggestions_card.xml
[modify] https://crrev.com/7d40ceab7039f28583f99693b3aa651fa71aeb52/chrome/android/java/res/layout/download_manager_ui_space_widget.xml
[modify] https://crrev.com/7d40ceab7039f28583f99693b3aa651fa71aeb52/chrome/android/java/res/layout/find_in_page.xml
[modify] https://crrev.com/7d40ceab7039f28583f99693b3aa651fa71aeb52/chrome/android/java/res/layout/fre_data_reduction_proxy.xml
[modify] https://crrev.com/7d40ceab7039f28583f99693b3aa651fa71aeb52/chrome/android/java/res/layout/fre_tosanduma.xml
[modify] https://crrev.com/7d40ceab7039f28583f99693b3aa651fa71aeb52/chrome/android/java/res/layout/lightweight_fre_tos.xml
[modify] https://crrev.com/7d40ceab7039f28583f99693b3aa651fa71aeb52/chrome/android/java/res/layout/new_tab_page_all_dismissed.xml
[modify] https://crrev.com/7d40ceab7039f28583f99693b3aa651fa71aeb52/chrome/android/java/res/layout/new_tab_page_snippets_card.xml
[modify] https://crrev.com/7d40ceab7039f28583f99693b3aa651fa71aeb52/chrome/android/java/res/layout/new_tab_page_snippets_card_large_thumbnail.xml
[modify] https://crrev.com/7d40ceab7039f28583f99693b3aa651fa71aeb52/chrome/android/java/res/layout/new_tab_page_status_card.xml
[modify] https://crrev.com/7d40ceab7039f28583f99693b3aa651fa71aeb52/chrome/android/java/res/layout/other_forms_of_history_dialog.xml
[modify] https://crrev.com/7d40ceab7039f28583f99693b3aa651fa71aeb52/chrome/android/java/res/layout/page_info.xml
[modify] https://crrev.com/7d40ceab7039f28583f99693b3aa651fa71aeb52/chrome/android/java/res/layout/page_info_permission_row.xml
[modify] https://crrev.com/7d40ceab7039f28583f99693b3aa651fa71aeb52/chrome/android/java/res/layout/powered_by_chrome_footer.xml
[modify] https://crrev.com/7d40ceab7039f28583f99693b3aa651fa71aeb52/chrome/android/java/res/layout/recent_tabs_group_item.xml
[modify] https://crrev.com/7d40ceab7039f28583f99693b3aa651fa71aeb52/chrome/android/java/res/layout/recent_tabs_list_item.xml
[modify] https://crrev.com/7d40ceab7039f28583f99693b3aa651fa71aeb52/chrome/android/java/res/layout/sad_tab.xml
[modify] https://crrev.com/7d40ceab7039f28583f99693b3aa651fa71aeb52/chrome/android/java/res/layout/signin_promo_view_impl.xml
[modify] https://crrev.com/7d40ceab7039f28583f99693b3aa651fa71aeb52/chrome/android/java/res/values-v17/styles.xml
[modify] https://crrev.com/7d40ceab7039f28583f99693b3aa651fa71aeb52/chrome/android/java/res/values/colors.xml
[modify] https://crrev.com/7d40ceab7039f28583f99693b3aa651fa71aeb52/chrome/android/java/res/values/dimens.xml
[modify] https://crrev.com/7d40ceab7039f28583f99693b3aa651fa71aeb52/chrome/android/java/src/org/chromium/chrome/browser/BluetoothChooserDialog.java
[modify] https://crrev.com/7d40ceab7039f28583f99693b3aa651fa71aeb52/chrome/android/java/src/org/chromium/chrome/browser/history/HistoryAdapter.java
[modify] https://crrev.com/7d40ceab7039f28583f99693b3aa651fa71aeb52/chrome/android/java/src/org/chromium/chrome/browser/ntp/RecentTabsGroupView.java
[modify] https://crrev.com/7d40ceab7039f28583f99693b3aa651fa71aeb52/chrome/android/java/src/org/chromium/chrome/browser/page_info/ConnectionInfoPopup.java
[modify] https://crrev.com/7d40ceab7039f28583f99693b3aa651fa71aeb52/chrome/android/java/src/org/chromium/chrome/browser/page_info/PageInfoPopup.java
[modify] https://crrev.com/7d40ceab7039f28583f99693b3aa651fa71aeb52/chrome/android/java/src/org/chromium/chrome/browser/preferences/HyperlinkPreference.java
[modify] https://crrev.com/7d40ceab7039f28583f99693b3aa651fa71aeb52/chrome/android/java/src/org/chromium/chrome/browser/preferences/LearnMorePreference.java
[modify] https://crrev.com/7d40ceab7039f28583f99693b3aa651fa71aeb52/chrome/android/java/src/org/chromium/chrome/browser/preferences/password/SavePasswordsPreferences.java
[modify] https://crrev.com/7d40ceab7039f28583f99693b3aa651fa71aeb52/chrome/android/java/src/org/chromium/chrome/browser/widget/findinpage/FindToolbarPhone.java
[modify] https://crrev.com/7d40ceab7039f28583f99693b3aa651fa71aeb52/chrome/test/data/android/render_tests/ArticleSnippetsTest.download_snippet_placeholder.Nexus_5-19.png
[modify] https://crrev.com/7d40ceab7039f28583f99693b3aa651fa71aeb52/chrome/test/data/android/render_tests/ArticleSnippetsTest.download_snippet_thumbnail.Nexus_5-19.png
[modify] https://crrev.com/7d40ceab7039f28583f99693b3aa651fa71aeb52/chrome/test/data/android/render_tests/ArticleSnippetsTest.signin_promo.Nexus_5-19.png
[modify] https://crrev.com/7d40ceab7039f28583f99693b3aa651fa71aeb52/chrome/test/data/android/render_tests/NewTabPageTest.new_tab_page.Nexus_5-19.png
[modify] https://crrev.com/7d40ceab7039f28583f99693b3aa651fa71aeb52/chrome/test/data/android/render_tests/NewTabPageTest.new_tab_page_scrolled.Nexus_5-19.png
[modify] https://crrev.com/7d40ceab7039f28583f99693b3aa651fa71aeb52/ui/android/java/res/values-v17/styles.xml
[modify] https://crrev.com/7d40ceab7039f28583f99693b3aa651fa71aeb52/ui/android/java/src/org/chromium/ui/text/NoUnderlineClickableSpan.java

Status: Fixed (was: Assigned)

Sign in to add a comment