[Fixed] #7921 Message text overflow removed redundant title (#10485)

* fixed message text overflow

* reverted and removed mesage title inside message--root

* fixed margin problem in sign message

* removed dead css

* fixed large left padding on data signing

ui/app/components/app/signature-request/signature-request-message/index.scss

@@ -29,35 +29,27 @@
     overflow: auto;
     padding-left: 12px;
     padding-right: 12px;
-    width: 360px;
 
     @media screen and (min-width: 576px) {
       width: auto;
     }
   }
 
-  &__type-title {
-    @include H6;
-
-    margin-left: 12px;
-    margin-top: 6px;
-    margin-bottom: 10px;
-  }
-
   &--node,
   &--node-leaf {
-    padding-left: 0.8rem;
+    padding-left: 0.3rem;
 
     &-label {
       color: #5b5d67;
+      margin-left: 0.5rem;
     }
 
     &-value {
       color: black;
       margin-left: 0.5rem;
-      text-overflow: ellipsis;
-      white-space: nowrap;
+      white-space: pre-line;
       overflow: hidden;
+      word-wrap: break-word;
     }
   }
 

ui/app/components/app/signature-request/signature-request-message/signature-request-message.component.js

@@ -47,9 +47,6 @@ export default class SignatureRequestMessage extends PureComponent {
           {this.context.t('signatureRequest1')}
         </div>
         <div className="signature-request-message--root">
-          <div className="signature-request-message__type-title">
-            {this.context.t('signatureRequest1')}
-          </div>
           {this.renderNode(data)}
         </div>
       </div>