Skip to content
New issue

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

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

Already on GitHub? # to your account

feat(chore): color list for each component separately #2088

Merged
merged 6 commits into from
Sep 23, 2021

Conversation

lubber-de
Copy link
Member

@lubber-de lubber-de commented Aug 26, 2021

Description

This PR allows to define a color list for each component individually out of the central colors.less file.

For example, now it is possible to have only red, blue and orange buttons, but only yellow labels and no colors for message at all. See example below.

All of this can be defined in the central variation.variables file as before (or in custom theme file)

Before this change you were only able to reduce the whole color list by modifying the colors.less file and change the available colors for all components at once.

Tip for reviewers:

For an easier overview add ?w=1 to the review URL which will ignore all the whitespace changes. github also has an option for this via the gear icon
image

Testcase

Example config for the above mentioned different colors per component

// Only red, blue and orange buttons
@variationMessageColors: red, blue, orange;
// Only yellow labels
@variationLabelColors: yellow;
// No colors for message at all
@variationMessageColors: false;

Example to reduce the colors in all components inside the variation.variables file only without the need to modify the colors.less (unless one needs totally new color names of course)

// Simply adjust the central variable
// only green and black for all components
@variationAllColors: green, black;

I also applied the same logic for states and consequences:

// Only info and warning textstates
@variationTextStates: info, warning;

// only Error form states
@variationFormStates: error;

// No dropdrop formstates
@variationDropdownStates: false;

// only positive and negative message consequences
@variationMessageConsequences: positive, negative;

The default theme will still build all colors into every component as before.

@lubber-de lubber-de added type/feat Any feature requests or improvements lang/css Anything involving CSS state/awaiting-reviews Pull requests which are waiting for reviews state/awaiting-docs Pull requests which need doc changes/additions tag/breaking-change Any pull request which is waiting for a breaking change release labels Aug 26, 2021
@lubber-de lubber-de added this to the 2.9.0 milestone Aug 26, 2021
@lubber-de
Copy link
Member Author

Use this link for an easier review and ignore whitespace changes
https://github.com/fomantic/Fomantic-UI/pull/2088/files?w=1

@lubber-de
Copy link
Member Author

lubber-de commented Sep 17, 2021

@exoego I merged the previous PR #,2106 so this one can be reviewed again, please.
As before, for easier review hide the whitespace changes
https://github.com/fomantic/Fomantic-UI/pull/2088/files?w=1

@lubber-de lubber-de merged commit cab3172 into fomantic:develop Sep 23, 2021
@lubber-de lubber-de deleted the individualColors branch September 23, 2021 16:24
@lubber-de lubber-de removed the state/awaiting-reviews Pull requests which are waiting for reviews label Sep 23, 2021
@lubber-de
Copy link
Member Author

Doc hint added by fomantic/Fomantic-UI-Docs#377

@lubber-de lubber-de added state/has-docs A issue/PR which requires documentation changes and has the corresponding PR open in the docs repo and removed state/awaiting-docs Pull requests which need doc changes/additions labels Oct 1, 2022
# for free to join this conversation on GitHub. Already have an account? # to comment
Labels
lang/css Anything involving CSS state/has-docs A issue/PR which requires documentation changes and has the corresponding PR open in the docs repo tag/breaking-change Any pull request which is waiting for a breaking change release type/feat Any feature requests or improvements
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants