Revert "chore: tweak send page styling (#25982)"

This reverts commit ef38d62.

ui/components/multichain/asset-picker-amount/asset-picker-modal/asset-picker-modal.tsx

@@ -273,14 +273,8 @@ export function AssetPickerModal({
   ]);
 
   const Search = useCallback(
-    ({
-      isNFTSearch = false,
-      props,
-    }: {
-      isNFTSearch?: boolean;
-      props?: React.ComponentProps<typeof Box>;
-    }) => (
-      <Box padding={4} {...props}>
+    ({ isNFTSearch = false }: { isNFTSearch?: boolean }) => (
+      <Box padding={1} paddingLeft={4} paddingRight={4}>
         <TextFieldSearch
           borderRadius={BorderRadius.LG}
           placeholder={t(isNFTSearch ? 'searchNfts' : 'searchTokens')}
@@ -301,6 +295,7 @@ export function AssetPickerModal({
           }}
           endAccessory={null}
           size={TextFieldSearchSize.Lg}
+          marginBottom={1}
         />
       </Box>
     ),
@@ -316,7 +311,7 @@ export function AssetPickerModal({
     >
       <ModalOverlay />
       <ModalContent modalDialogProps={{ padding: 0 }}>
-        <ModalHeader paddingBottom={2} onClose={onClose}>
+        <ModalHeader onClose={onClose}>
           <Text variant={TextVariant.headingSm} textAlign={TextAlign.Center}>
             {t(isDest ? 'sendSelectReceiveAsset' : 'sendSelectSendAsset')}
           </Text>
@@ -327,7 +322,7 @@ export function AssetPickerModal({
             gap={1}
             alignItems={AlignItems.center}
             marginInline="auto"
-            marginBottom={3}
+            marginBottom={4}
           >
             <AvatarToken
               borderRadius={BorderRadius.full}
@@ -342,7 +337,7 @@ export function AssetPickerModal({
         <Box className="modal-tab__wrapper">
           {isDest ? (
             <>
-              <Search props={{ paddingTop: 1 }} />
+              <Search />
               <AssetList
                 handleAssetChange={handleAssetChange}
                 asset={asset}
@@ -357,6 +352,8 @@ export function AssetPickerModal({
               tabsClassName="modal-tab__tabs"
             >
               {
+                // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+                // @ts-ignore
                 <Tab
                   activeClassName="modal-tab__tab--active"
                   className="modal-tab__tab"
@@ -374,6 +371,8 @@ export function AssetPickerModal({
               }
 
               {
+                // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+                // @ts-ignore
                 <Tab
                   activeClassName="modal-tab__tab--active"
                   className="modal-tab__tab"

ui/components/multichain/pages/page/components/header/header.tsx

@@ -30,18 +30,13 @@ interface HeaderProps extends StyleUtilityProps {
    * Additional CSS class provided to the footer
    */
   className?: string;
-  /**
-   * Additional props to pass to the text
-   */
-  textProps?: React.ComponentProps<typeof Text>;
 }
 
 export const Header = ({
   children,
   endAccessory = null,
   startAccessory = null,
   className = '',
-  textProps,
   ...props
 }: HeaderProps) => {
   return (
@@ -61,7 +56,6 @@ export const Header = ({
         paddingInlineStart={8}
         paddingInlineEnd={8}
         ellipsis
-        {...textProps}
       >
         {children}
       </Text>

ui/components/multichain/pages/send/__snapshots__/send.test.js.snap

@@ -28,11 +28,11 @@ exports[`SendPage render and initialization should render correctly even when a
         <div
           class="mm-box"
         >
-          <h4
-            class="mm-box mm-text mm-text--heading-sm mm-text--ellipsis mm-text--text-align-center mm-box--padding-inline-start-8 mm-box--padding-inline-end-8 mm-box--display-block mm-box--color-text-default"
+          <p
+            class="mm-box mm-text mm-text--body-md-bold mm-text--ellipsis mm-text--text-align-center mm-box--padding-inline-start-8 mm-box--padding-inline-end-8 mm-box--display-block mm-box--color-text-default"
           >
-            Send
-          </h4>
+            Send a token
+          </p>
         </div>
       </div>
       <div

ui/components/multichain/pages/send/send.js

@@ -58,7 +58,6 @@ import { AssetPickerAmount } from '../..';
 import useUpdateSwapsState from '../../../../pages/swaps/hooks/useUpdateSwapsState';
 import { getIsDraftSwapAndSend } from '../../../../ducks/send/helpers';
 import { smartTransactionsListSelector } from '../../../../selectors';
-import { TextVariant } from '../../../../helpers/constants/design-system';
 import {
   SendPageAccountPicker,
   SendPageRecipientContent,
@@ -302,9 +301,6 @@ export const SendPage = () => {
   return (
     <Page className="multichain-send-page">
       <Header
-        textProps={{
-          variant: TextVariant.headingSm,
-        }}
         startAccessory={
           <ButtonIcon
             size={ButtonIconSize.Sm}
@@ -314,7 +310,7 @@ export const SendPage = () => {
           />
         }
       >
-        {t('send')}
+        {t('sendAToken')}
       </Header>
       <Content>
         <SendPageAccountPicker />