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

Add maps for all colors, document how to extend color utilities #32319

Merged
merged 5 commits into from
Jul 6, 2021

Conversation

mdo
Copy link
Member

@mdo mdo commented Dec 3, 2020

The goal of this PR is to give folks the tools they need to extend our full color palette into any number of utilities, from color to background-color and beyond. I've added the maps to the _variables.scss file as our existing color variables all live there right now. I've also added some docs guidance for how to put it to use to the Customize > Color page. This also includes adding a new map-merge-multiple() function for combining several Sass maps, since otherwise we'd need to do nested maps for each merge.

/cc @twbs/css-review


Closes #32236, closes #33412.

Preview: https://deploy-preview-32319--twbs-bootstrap.netlify.app/docs/5.0/customize/color/#generating-utilities

mdo added 2 commits June 23, 2021 18:10
- Moves color maps into _variables.scss for now (felt weird to split them out when the variables are there)
- Adds a new function, map-merge-multiple(), and updates docs that reference combo-map
- Updates code snippet and docs guidance about how to extend the color utils to handle this
@mdo mdo force-pushed the extend-colors branch from 321f09e to 6d4fe94 Compare June 24, 2021 01:44
@mdo mdo marked this pull request as ready for review June 24, 2021 01:45
@mdo mdo requested a review from a team as a code owner June 24, 2021 01:45
Copy link
Member

@ffoodd ffoodd left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

A function name to change in the docs, but that's great!

site/content/docs/5.0/customize/color.md Outdated Show resolved Hide resolved
@mdo mdo merged commit 47bbd94 into main Jul 6, 2021
@mdo mdo deleted the extend-colors branch July 6, 2021 21:31
marvin-hinkley-vortx pushed a commit to Vortx-Inc/bootstrap that referenced this pull request Aug 18, 2021
…#32319)

* Add maps for all colors, document how to extend color utilities

* Updates to make this more functional for v5

- Moves color maps into _variables.scss for now (felt weird to split them out when the variables are there)
- Adds a new function, map-merge-multiple(), and updates docs that reference combo-map
- Updates code snippet and docs guidance about how to extend the color utils to handle this

* Update site/content/docs/5.0/customize/color.md

Co-authored-by: Gaël Poupard <ffoodd@users.noreply.github.com>
Co-authored-by: XhmikosR <xhmikosr@gmail.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
4 participants