feat: improve word wrap (#4506)

packages/vant-doc/src/component/Block.vue

@@ -22,7 +22,7 @@ export default {
     box-sizing: border-box;
 
     pre {
-      word-break: break-all;
+      word-wrap: break-word;
     }
   }
 }

packages/vant-doc/src/style/highlight.less

@@ -11,7 +11,7 @@ code {
   font-family: @van-doc-code-font-family;
   line-height: 24px;
   white-space: pre-wrap;
-  word-break: break-all;
+  word-wrap: break-word;
 }
 
 pre {

src/card/index.less

@@ -40,7 +40,7 @@
 
   &__title,
   &__desc {
-    word-break: break-all;
+    word-wrap: break-word;
   }
 
   &__title {

src/dialog/index.less

@@ -35,6 +35,7 @@
     // allow newline charactor
     white-space: pre-wrap;
     text-align: center;
+    word-wrap: break-word;
     -webkit-overflow-scrolling: touch;
 
     &--has-title {

src/grid-item/index.less

@@ -51,7 +51,7 @@
   &__text {
     color: @grid-item-text-color;
     font-size: @grid-item-text-font-size;
-    word-break: break-all;
+    word-wrap: break-word;
   }
 
   &__icon + &__text {

src/notice-bar/index.less

@@ -57,6 +57,7 @@
       &__content {
         position: relative;
         white-space: normal;
+        word-wrap: break-word;
       }
     }
   }

src/notify/index.less

@@ -9,6 +9,7 @@
   // allow newline charactor
   white-space: pre-wrap;
   text-align: center;
+  word-wrap: break-word;
 
   &--primary {
     background-color: @notify-primary-background-color;

src/sidebar-item/index.less

@@ -8,7 +8,7 @@
   color: @sidebar-text-color;
   font-size: @sidebar-font-size;
   line-height: @sidebar-line-height;
-  word-break: break-all;
+  word-wrap: break-word;
   background-color: @sidebar-background-color;
   border-left: 3px solid transparent;
   user-select: none;

src/sku/index.less

@@ -75,7 +75,7 @@
     font-weight: 500;
     font-size: 22px;
     vertical-align: middle;
-    word-break: break-all;
+    word-wrap: break-word;
   }
 
   &__goods-price {

src/toast/index.less

@@ -22,7 +22,7 @@
   // allow newline charactor
   white-space: pre-wrap;
   text-align: center;
-  word-break: break-all;
+  word-wrap: break-word;
   background-color: @toast-background-color;
   border-radius: @toast-border-radius;
   transform: translate3d(-50%, -50%, 0);