Skip to content

Add contrast colors Sass map#23440

Closed
jacobmllr95 wants to merge 7 commits intotwbs:v4-devfrom
jacobmllr95:add-contrast-colors-sass-map
Closed

Add contrast colors Sass map#23440
jacobmllr95 wants to merge 7 commits intotwbs:v4-devfrom
jacobmllr95:add-contrast-colors-sass-map

Conversation

@jacobmllr95
Copy link
Copy Markdown
Contributor

This commit adds a $contrast-colors Sass map to the variables. This makes it possible to define a custom contrast color for a given color. Closes #23418.

Let's say someone wants the color for btn-secondary to be black:

$contrast-colors: (
  $gray-600: $black
);

bootstrap-v4-beta-btn-secondary-black-color

Or if you want to restore the Bootstrap v4 Alpha colors:

$blue:   #0275d8;
$green:  #5cb85c;
$teal:   #5bc0de;
$yellow: #ffd500;
$red:    #d9534f;

$theme-colors: (
  secondary: $white
);

$contrast-colors: (
  $blue: $white,
  $white: $gray-600,
  $green: $white,
  $cyan: $white,
  $yellow: $white,
  $red: $white
);

bootstrap-v4-alpha-button-syles

@mdo
Copy link
Copy Markdown
Member

mdo commented Oct 19, 2017

Closing for a simpler approach of adding vars for these two colors: #24426. It's not the per-theme-color approach as here, but it provides some flexibility.

@mdo mdo closed this Oct 19, 2017
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants