[feat] unify tokenTag typo and height for aligning copy button style

Author: blacktoast

apps/extension/src/pages/main/components/token/copy-address-button.tsx

@@ -36,7 +36,7 @@ const getCopyAddressButtonHoverBackgroundColor = (theme: {
 }): string => {
   return theme.mode === "light"
     ? Color(ColorPalette["gray-100"]).alpha(0.5).toString()
-    : ColorPalette["gray-450"];
+    : ColorPalette["gray-500"];
 };
 
 export const CopyAddressButton: FunctionComponent<{

apps/extension/src/pages/main/components/token/token-tag.tsx

@@ -3,7 +3,7 @@ import { FunctionComponent } from "react";
 import { useTheme } from "styled-components";
 import { Tooltip } from "../../../../components/tooltip";
 import { Box } from "../../../../components/box";
-import { BaseTypography } from "../../../../components/typography";
+import { Caption2 } from "../../../../components/typography";
 import { ColorPalette } from "../../../../styles";
 
 export const TokenTag: FunctionComponent<{
@@ -26,20 +26,17 @@ export const TokenTag: FunctionComponent<{
         paddingX="0.375rem"
         paddingTop="0.125rem"
         paddingBottom="0.1875rem"
+        height="1.25rem"
       >
-        <BaseTypography
-          style={{
-            fontWeight: 400,
-            fontSize: "0.6875rem",
-          }}
+        <Caption2
           color={
             theme.mode === "light"
               ? ColorPalette["blue-400"]
               : ColorPalette["gray-200"]
           }
         >
           {text}
-        </BaseTypography>
+        </Caption2>
       </Box>
     </Tooltip>
   );