chore: removing attached styles and updating some text components

MetaMask · Sep 15, 2024 · d5b7b4e · d5b7b4e
1 parent a1c695e
commit d5b7b4e
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 30 deletions.
diff --git a/ui/pages/confirmations/components/signature-request-original/index.scss b/ui/pages/confirmations/components/signature-request-original/index.scss
@@ -50,8 +50,6 @@
   }
 
   &__content__title {
-    @include design-system.H3;
-
     display: flex;
     justify-content: center;
     color: var(--color-default-text);
@@ -85,21 +83,6 @@
     margin-bottom: 16px;
   }
 
-  &__notice,
-  &__warning {
-    @include design-system.H6;
-
-    text-align: center;
-    margin-top: 21px;
-    margin-bottom: 11px;
-    width: 100%;
-  }
-
-  &__notice {
-    color: var(--color-text-alternative);
-    padding: 0 10px;
-  }
-
   &__rows {
     border-top: 1px solid var(--color-border-default);
     display: flex;
@@ -112,8 +95,6 @@
   }
 
   &__row-title {
-    @include design-system.H5;
-
     width: 80px;
     color: var(--color-text-alternative);
     margin-top: 12px;
@@ -122,8 +103,6 @@
   }
 
   &__row-value {
-    @include design-system.H6;
-
     color: var(--color-text-alternative);
     width: 100%;
     overflow-wrap: break-word;

diff --git a/...nfirmations/components/signature-request-original/signature-request-original.component.js b/...nfirmations/components/signature-request-original/signature-request-original.component.js
@@ -1,6 +1,5 @@
 import React, { Component } from 'react';
 import PropTypes from 'prop-types';
-import classnames from 'classnames';
 import { ObjectInspector } from 'react-inspector';
 import { ethErrors, serializeError } from 'eth-rpc-errors';
 import { SubjectType } from '@metamask/permission-controller';
@@ -32,11 +31,11 @@ import {
 } from '../../../../helpers/constants/design-system';
 import {
   ButtonLink,
-  Text,
   ///: BEGIN:ONLY_INCLUDE_IF(build-mmi)
   Box,
   Icon,
   IconName,
+  Text,
   ///: END:ONLY_INCLUDE_IF
 } from '../../../../components/component-library';
 
@@ -200,21 +199,25 @@ export default class SignatureRequestOriginal extends Component {
         <Text
           className="request-signature__content__title"
           variant={TextVariant.headingMd}
-          fontWeight={FontWeight.Bold}
         >
           {this.context.t('sigRequest')}
         </Text>
         <Text
           className="request-signature__content__subtitle"
-          variant={TextVariant.bodySm}
           color={TextColor.textAlternative}
           textAlign={TextAlign.Center}
-          margin={12}
-          marginTop={3}
+          margin={4}
         >
           {this.context.t('signatureRequestGuidance')}
         </Text>
-        <Text className="request-signature__notice">{notice}</Text>
+        <Text
+          className="request-signature__notice"
+          color={TextColor.textAlternative}
+          textAlign={TextAlign.Center}
+          marginBottom={4}
+        >
+          {notice}
+        </Text>
         <div className="request-signature__rows">
           {rows.map(({ name, value }, index) => {
             if (typeof value === 'boolean') {
@@ -226,10 +229,13 @@ export default class SignatureRequestOriginal extends Component {
                 className="request-signature__row"
                 key={`request-signature-row-${index}`}
               >
-                <Text className="request-signature__row-title" variant={TextVariant.bodyMd}>
+                <Text className="request-signature__row-title">
                   {sanitizeString(`${name}:`)}
                 </Text>
-                <Text className="request-signature__row-value" variant={TextVariant.bodyMd}>
+                <Text
+                  variant={TextVariant.bodySm}
+                  className="request-signature__row-value"
+                >
                   {sanitizeString(value)}
                 </Text>
               </div>