Skip to content

Commit

Permalink
chore(styles): drop deprecated word-wrap property (#854)
Browse files Browse the repository at this point in the history
According to [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/overflow-wrap):

> The property was originally a nonstandard and unprefixed Microsoft extension called word-wrap, and was implemented by most browsers with the same name. It has since been renamed to overflow-wrap, with word-wrap being an alias.

I think we can safely ditch `word-wrap` for `overflow-wrap` everywhere and save a few bytes.
  • Loading branch information
dancormier authored Aug 24, 2022
1 parent af6f7c0 commit 0fb0623
Show file tree
Hide file tree
Showing 4 changed files with 6 additions and 12 deletions.
2 changes: 1 addition & 1 deletion docs/_data/typography.json
Original file line number Diff line number Diff line change
Expand Up @@ -235,7 +235,7 @@
},
{
"class": "break-word",
"output": "word-break: break-word; word-wrap: break-word; overflow-wrap: break-word; hyphens: auto;",
"output": "word-break: break-word; overflow-wrap: break-word; hyphens: auto;",
"define": "A utility class combining all word-break strategies when you absolutely must break a word."
},
{
Expand Down
2 changes: 1 addition & 1 deletion lib/css/atomic/misc.less
Original file line number Diff line number Diff line change
Expand Up @@ -157,7 +157,7 @@
padding: 0;
position: absolute;
width: 1px;
word-wrap: normal;
overflow-wrap: normal;
}

// ============================================================================
Expand Down
6 changes: 0 additions & 6 deletions lib/css/atomic/typography.less
Original file line number Diff line number Diff line change
Expand Up @@ -196,27 +196,22 @@ p {
// -- Overflow Wrap
.ow-normal {
overflow-wrap: normal !important;
word-wrap: normal !important;
}

.ow-break-word {
overflow-wrap: break-word !important;
word-wrap: break-word !important;
}

.ow-inherit {
overflow-wrap: inherit !important;
word-wrap: inherit !important;
}

.ow-initial {
overflow-wrap: initial !important;
word-wrap: initial !important;
}

.ow-unset {
overflow-wrap: unset !important;
word-wrap: unset !important;
}

// -- Hyphenation
Expand All @@ -231,7 +226,6 @@ p {
// -- Break word
.break-word {
word-break: break-word !important;
word-wrap: break-word !important;
overflow-wrap: break-word !important;
-webkit-hyphens: auto !important;
-moz-hyphens: auto !important;
Expand Down
8 changes: 4 additions & 4 deletions lib/css/components/prose.less
Original file line number Diff line number Diff line change
Expand Up @@ -18,14 +18,14 @@
// Base styling
font-size: 15px; // Force a font size that doesn’t change at the smallest breakpoint
line-height: var(--s-prose-line-height);
word-wrap: break-word;
overflow-wrap: break-word;

p {
margin-bottom: var(--s-prose-spacing);
}

pre {
word-wrap: normal;
overflow-wrap: normal;
}

code {
Expand Down Expand Up @@ -54,10 +54,10 @@
}

li {
word-wrap: break-word;
overflow-wrap: break-word;

pre {
word-wrap: normal;
overflow-wrap: normal;
}
}

Expand Down

0 comments on commit 0fb0623

Please sign in to comment.