loading up the forgejo repo on tangled to test page performance
0
fork

Configure Feed

Select the types of activity you want to include in your feed.

Forbid deprecated `break-word` in CSS (#30934)

Forbid
[deprecated](https://drafts.csswg.org/css-text-3/#word-break-property)
`break-word` and fix all occurences.

Regarding `overflow-wrap: break-word` vs `overflow-wrap: anywhere`:

Example of difference: https://jsfiddle.net/silverwind/1va6972r/

[Here](https://stackoverflow.com/questions/77651244) it says:

> The differences between normal, break-word and anywhere are only clear
if you are using width: min-content on the element containing the text,
and you also set a max-width. A pretty rare scenario.

I don't think this difference will make any practical impact as we are
not hitting this rare scenario.

(cherry picked from commit 5556782ebeb1ca4d17e2fff434b11651887b9899)

authored by

silverwind and committed by
Earl Warren
51f6c3a0 38ea77eb

+5 -7
+1 -1
stylelint.config.js
··· 150 150 'declaration-property-unit-allowed-list': null, 151 151 'declaration-property-unit-disallowed-list': {'line-height': ['em']}, 152 152 'declaration-property-value-allowed-list': null, 153 - 'declaration-property-value-disallowed-list': null, 153 + 'declaration-property-value-disallowed-list': {'word-break': ['break-word']}, 154 154 'declaration-property-value-no-unknown': true, 155 155 'font-family-name-quotes': 'always-where-recommended', 156 156 'font-family-no-duplicate-names': true,
+1 -2
web_src/css/features/console.css
··· 5 5 color: var(--color-console-fg); 6 6 font-family: var(--fonts-monospace); 7 7 border-radius: var(--border-radius); 8 - word-break: break-word; 9 - overflow-wrap: break-word; 8 + overflow-wrap: anywhere; 10 9 } 11 10 12 11 .console img { max-width: 100%; }
-1
web_src/css/helpers.css
··· 5 5 6 6 .gt-word-break { 7 7 word-wrap: break-word !important; 8 - word-break: break-word; /* compat: Safari */ 9 8 overflow-wrap: anywhere; 10 9 } 11 10
+1 -1
web_src/css/repo.css
··· 418 418 } 419 419 420 420 .repository.file.list .non-diff-file-content .plain-text pre { 421 - word-break: break-word; 421 + overflow-wrap: anywhere; 422 422 white-space: pre-wrap; 423 423 } 424 424
+2 -2
web_src/css/shared/flex-list.css
··· 59 59 color: var(--color-text); 60 60 font-size: 16px; 61 61 font-weight: var(--font-weight-semibold); 62 - word-break: break-word; 62 + overflow-wrap: anywhere; 63 63 min-width: 0; 64 64 } 65 65 ··· 74 74 flex-wrap: wrap; 75 75 gap: .25rem; 76 76 color: var(--color-text-light-2); 77 - word-break: break-word; 77 + overflow-wrap: anywhere; 78 78 } 79 79 80 80 .flex-item .flex-item-body a {