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 box-decoration-break utilities #3911

Merged
merged 1 commit into from Apr 2, 2021
Merged

Conversation

adamwathan
Copy link
Member

This PR adds support for the CSS box-decoration-break property which controls how other properties are applied to text when it wraps.

See the MDN documentation for more information about how it works.

The new APIs are:

Class CSS
decoration-slice box-decoration-break: slice
decoration-clone box-decoration-break: clone

Only responsive variants are enabled for these utilities by default.

@adamwathan adamwathan merged commit 8c07172 into master Apr 2, 2021
@adamwathan adamwathan deleted the box-decoration-break branch April 2, 2021 20:04
@mikker
Copy link

mikker commented Apr 2, 2021

For the curious, check out the effect for example on HEY's user quotes:

CleanShot 2021-04-02 at 22 46 59@2x

And here with the property disabled:

CleanShot 2021-04-02 at 22 48 48@2x

See how the corners aren't nicely rounded and the gradient breaks over the line breaks?

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.

None yet

2 participants