Skip to content

Conversation

@adamwathan
Copy link
Member

@adamwathan adamwathan commented Feb 14, 2019

Note: This PR is only about changing the name of the core plugins themselves, not the classes generated by the core plugins. Even though the leading plugin will be renamed to lineHeight, the classes it generates will still be .leading-{modifier}.

As part of 1.0 I want to make the core plugin names more consistent and guessable. After way too much deliberation I've decided it makes the most sense to stick with singular names, and match the CSS property (or module name) where possible.

For example, fonts will change to fontFamily, backgroundColors will change to backgroundColor, svgStroke will change to stroke, etc.

Certain core plugins will continue to be responsible for multiple CSS properties, and those plugins will be named after the parent CSS module when possible. For example, the flexbox plugin will still be responsible for align-items, justify-content, flex-direction, etc., and in the future a grid or gridLayout plugin would likely be responsible for many of the CSS grid properties.

Other core plugins may be split into multiple plugins in order to give them better names, like we may split textStyle into separate textTransform, textDecoration, fontStyle, and fontSmoothing plugins (although we may not.)

This is one of the biggest breaking changes for 1.0 but I think it's better than being stuck with a bunch of inconsistent names forever. This break will only affect your actual config file, and won't require making any changes in your actual HTML.

To Do:

  • Change backgroundColors to backgroundColor
  • Change borderColors to borderColor
  • Change borderWidths to borderWidth
  • Change fonts to fontFamily
  • Change fontWeights to fontWeight
  • Change leading to lineHeight
  • Change lists to listStyle
  • Change shadows to boxShadow
  • Change svgFill to fill
  • Change svgStroke to stroke
  • Change textColors to color or textColor
  • Change textSizes to fontSize
  • Change textStyle to textTransform, textDecoration, fontStyle, and fontSmoothing
  • Change tracking to letterSpacing

@vitorfield vitorfield marked this pull request as ready for review February 14, 2019 19:59
@benface
Copy link
Contributor

benface commented Feb 14, 2019

  • Change lists to listStyle

Are you also planning on adding list style type utilities by any chance? :)

@adamwathan
Copy link
Member Author

Are you also planning on adding list style type utilities by any chance? :)

Yeah I think I want to trash the whole list-reset class and just provide list style utilities instead.

@adamwathan
Copy link
Member Author

Reverted the changes to leading and tracking for now, still unsure what to do there but it seemed really unintuitive to change tracking values in a key called letterSpacing. Maybe it's fine but I kinda think calling the plugins leading and tracking is fine too.

Going to open a separate issue to discuss potential new names for the leading and tracking classes, having a hard time deciding what to do there.

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

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants