bug(input): placeholder text inside toolbar is difficult to read #7987

Activity

1. robertmesserle

   added

   type: bug

   g3: reportedThe issue was reported by an internal or external product team.The issue was reported by an internal or external product team.

   required for sync

   on Apr 11, 2016
2. robertmesserle

   changed the title [-]bug(input): placeholder text inside header is difficult to read[/-] [+]bug(input): placeholder text inside toolbar is difficult to read[/+] on Apr 11, 2016
3. robertmesserle

   modified the milestone: 1.1.0 on Apr 13, 2016
4. ThomasBurleson

   added

   P0: criticalCritical issues that must be addressed immediately.Critical issues that must be addressed immediately.

   on Apr 21, 2016
5. ThomasBurleson

   assigned

   EladBezalel

   on Apr 21, 2016
6. devversion commented on May 7, 2016

   

   devversion

   on May 7, 2016

   Last edited by devversion

   Member

   More actions

   Just writing it here. I'm currently looking for a good / the right solution.

   The placeholder currently uses the foreground-1 hue, which is actually for disabled texts and also looking as same as in the specs. (Not chosen by me)

   The foreground palettes are supporting Dark and Light themes, which means that those palettes are not caring about the primary / accent / warn color.

         self.foregroundPalette = self.isDark ? LIGHT_FOREGROUND : DARK_FOREGROUND;
         self.foregroundShadow = self.isDark ? DARK_SHADOW : LIGHT_SHADOW;

   So, as shown in your screenshot, you're using Indigo, which is likely dark.
   But as the foreground palette is not caring about the primary color, it will be still dark and not good to read.

   I think we need to find another palette / solution.

   For comparison in Material 2. See here
7. EladBezalel commented on May 31, 2016

   

   EladBezalel

   on May 31, 2016

   Member

   More actions

   @devversion any update on this?
8. epelc commented on Jun 9, 2016

   

   epelc

   on Jun 9, 2016

   Contributor

   More actions

   @devversion I think the real problem here is that the forground-*'s only support light or dark. There needs to be a foreground-opposite or something similar for when you are ontop of a background that is opposite of the normal isDark.

   Would be nice to get this fixed. Hopefully it'll also fix the same issue with md-select in dark toolbars.
9. EladBezalel

   added

   ui: theme

   on Jun 11, 2016
10. clshortfuse commented on Jun 14, 2016

    

    clshortfuse

    on Jun 14, 2016

    Last edited by clshortfuse

    Contributor

    More actions

    I have somewhat a solution for this, but I can't find a neat way to get it all working as I want. Right now I was thinking of doing adding support for

    foreground-1-contrast
foregroundLight-1-contrast
foregroundDark-2-contrast-0.50

    The problem is, though you can force light and dark, that's not really much of the solution. The reality is that contrast and foreground are somewhat same thing.

    Right now, contrast == foreground-1 but no ability to select any other levels of foreground. I have a solution ready, but I'm just trying to get it all working without breaking other changes. The idea of using foreground-1 syntax instead of foreground1 is the root of my issue.

    Edit: I figured it out. I'm going to deprecate foreground-* and -contrast. Instead, I'm going to add:

    • contrastPrimary
    • contrastSecondary
    • contrastDisabled | contrastHint | contrastIcon
    • contrastDivider.

    Any reference to -contrast would be replaced with contrastPrimary. foreground-* values would be replaced with the specified contrast level and background color. ie: foreground-1 becomes background-default-contrastPrimary

    👍React with 👍1Reacted by Michael Prentice
11. ThomasBurleson commented on Jun 23, 2016

    

    ThomasBurleson

    on Jun 23, 2016

    Contributor

    More actions

    @EladBezalel - ping!
12. EladBezalel commented on Jun 23, 2016

    

    EladBezalel

    on Jun 23, 2016

    Member

    More actions

    @clshortfuse let's pair on this one as well, your PR can solve this?
13. 17 remaining items

    Load more
14. Splaktar

    modified the milestones: Future, 1.1.10 on May 4, 2018
15. Splaktar

    modified the milestones: 1.1.10, 1.1.11 on Jun 19, 2018
16. Splaktar

    added a commit that references this issue on Jul 20, 2018

    fix(toolbar): input placeholders and ink need more contrast

    ...

    This issue will close once commit b5cb673 is merged into the 'master' branch.

    b5cb673
17. Splaktar

    added

    has: Pull RequestA PR has been created to address this issueA PR has been created to address this issue

    and removed

    has: Pull RequestA PR has been created to address this issueA PR has been created to address this issue

    on Jul 20, 2018
18. Splaktar

    modified the milestones: 1.1.11, 1.2.0 on Oct 20, 2018
19. Splaktar

    added

    - Breaking Change

    on Oct 20, 2018
20. Splaktar

    added a commit that references this issue on Aug 26, 2019

    fix(toolbar): input placeholders and ink need more contrast

    ...

    This issue will close once commit 67a8034 is merged into the 'master' branch.

    67a8034
21. Splaktar

    added a commit that references this issue on Jul 1, 2020

    fix(toolbar): input placeholders and ink need more contrast

    ...

    This issue will close once commit fe260da is merged into the 'master' branch.

    fe260da
22. Splaktar

    closed this as completedin #11378on Jul 1, 2020
23. Splaktar

    added a commit that references this issue on Jul 1, 2020

    fix(toolbar): input placeholders and ink need more contrast

    ...

    This issue will close once commit a82fc93 is merged into the 'master' branch.

    a82fc93
24. Splaktar

    added

    resolution: fixed

    on Jul 1, 2020