Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Improve readability of minimal tags #657

Closed
pkwi opened this issue Feb 9, 2017 · 3 comments
Closed

Improve readability of minimal tags #657

pkwi opened this issue Feb 9, 2017 · 3 comments

Comments

@pkwi
Copy link
Contributor

pkwi commented Feb 9, 2017

Change text colour for minimal tags to improve contrast and readability.

Light theme:

Current

screen shot 2017-02-09 at 7 36 29 pm

Proposal

screen shot 2017-02-09 at 7 38 34 pm

Default: no change
Primary: blue2 > blue1
Success: green2 > green1
Warning: orange2 > orange1
Danger: red2 > red1

Dark Theme:

Current

screen shot 2017-02-09 at 7 40 03 pm

Proposal

screen shot 2017-02-09 at 7 41 48 pm

Default: no change
Primary: blue4 > blue5
Success: green4 > green5
Warning: orange4 > orange5
Danger: red4 > red5

@llorca
Copy link
Contributor

llorca commented Feb 9, 2017

This means changing the defaults in $pt-intent-text-colors. Colored text and colored icon next to each other will look even more different (2 shades difference vs 1 shade at the moment). We need better intent management in Sass!

@pkwi
Copy link
Contributor Author

pkwi commented Feb 15, 2017

This is for minimal tags only. It doesn't mean we have to change the defaults. I'm sure there are ways to split these two.

@llorca
Copy link
Contributor

llorca commented Feb 15, 2017

No, this isn't actually about minimal tags. It's about the value of $pt-intent-text-colors/$pt-dark-intent-text-colors and will impact any component that's using intent text colors:

@each $intent, $color in $pt-intent-colors {
  &.pt-intent-#{$intent} {
    background-color: rgba($color, 0.2);
    color: map-get($pt-intent-text-colors, $intent);

    .pt-dark & {
      color: map-get($pt-dark-intent-text-colors, $intent);
    }
  }
}

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

No branches or pull requests

3 participants