Use `overflow-wrap: anywhere` to replace `word-break: break-all` (#34126)

templates/status/500.tmpl

@@ -38,7 +38,7 @@
 					{{if .ErrorMsg}}
 					<div class="tw-mt-8">
 						<p>{{ctx.Locale.Tr "error.occurred"}}:</p>
-						<pre class="tw-whitespace-pre-wrap tw-break-all">{{.ErrorMsg}}</pre>
+						<pre class="tw-whitespace-pre-wrap tw-wrap-anywhere">{{.ErrorMsg}}</pre>
 					</div>
 					{{end}}
 					<div class="tw-mt-8 tw-text-center">

web_src/css/base.css

@@ -878,7 +878,6 @@ overflow-menu .ui.label {
 .code-inner {
   font: 12px var(--fonts-monospace);
   white-space: pre-wrap;
-  word-break: break-all;
   overflow-wrap: anywhere;
   line-height: inherit; /* needed for inline code preview in markup */
 }

web_src/css/markup/content.css

@@ -447,8 +447,7 @@
   margin: 0;
   font-size: 100%;
   white-space: pre-wrap;
-  word-break: break-all;
+  overflow-wrap: anywhere;
-  overflow-wrap: break-word;
   background: transparent;
   border: 0;
 }

web_src/css/repo.css

@@ -1724,8 +1724,7 @@ tbody.commit-list {
   line-height: 18px;
   margin: 1em;
   white-space: pre-wrap;
-  word-break: break-all;
+  overflow-wrap: anywhere;
-  overflow-wrap: break-word;
 }
 
 .content-history-detail-dialog .header .avatar {

web_src/js/components/RepoActionView.vue

@@ -955,7 +955,6 @@ export default defineComponent({
 
 .job-step-logs .job-log-line .log-msg {
   flex: 1;
-  word-break: break-all;
   white-space: break-spaces;
   margin-left: 10px;
   overflow-wrap: anywhere;