chore: change header action button to improve positioning

leather-io · Feb 28, 2024 · e996078 · e996078
1 parent 3fa9b34
commit e996078
Show file tree

Hide file tree

Showing 3 changed files with 5 additions and 7 deletions.
diff --git a/src/app/pages/send/choose-crypto-asset/choose-crypto-asset.tsx b/src/app/pages/send/choose-crypto-asset/choose-crypto-asset.tsx
@@ -1,7 +1,7 @@
 import toast from 'react-hot-toast';
 import { useNavigate } from 'react-router-dom';
 
-import { Flex, styled } from 'leather-styles/jsx';
+import { styled } from 'leather-styles/jsx';
 
 import { AllTransferableCryptoAssetBalances } from '@shared/models/crypto-asset-balance.model';
 import { RouteUrls } from '@shared/route-urls';

diff --git a/src/app/ui/components/containers/headers/header-action-button.tsx b/src/app/ui/components/containers/headers/header-action-button.tsx
@@ -1,5 +1,5 @@
 import { HomePageSelectors } from '@tests/selectors/home.selectors';
-import { Grid } from 'leather-styles/jsx';
+import { Flex } from 'leather-styles/jsx';
 
 interface HeaderActionButtonProps {
   icon?: React.JSX.Element;
@@ -12,7 +12,7 @@ export function HeaderActionButton({
   onAction,
 }: HeaderActionButtonProps) {
   return (
-    <Grid
+    <Flex
       _hover={{
         bg: isWaitingOnPerformedAction ? 'unset' : 'ink.component-background-hover',
         cursor: isWaitingOnPerformedAction ? 'unset' : 'pointer',
@@ -23,14 +23,12 @@ export function HeaderActionButton({
       height="headerContainerHeight"
       onClick={isWaitingOnPerformedAction ? undefined : onAction}
       opacity={isWaitingOnPerformedAction ? '0.3' : 'unset'}
-      placeItems="center"
-      position="relative"
       transition="transition"
       userSelect="none"
       p="space.02"
       zIndex={999}
     >
       {icon}
-    </Grid>
+    </Flex>
   );
 }
diff --git a/tests/selectors/home.selectors.ts b/tests/selectors/home.selectors.ts
@@ -1,5 +1,5 @@
 export enum HomePageSelectors {
-  HeaderActionBtn = 'drawer-header-action-btn',
+  HeaderActionBtn = 'header-action-btn',
   HomePageContainer = 'home-page-container',
   ReceiveCryptoAssetBtn = 'receive-crypto-asset-btn',
   ReceiveBtcNativeSegwitQrCodeBtn = 'receive-native-segwit-qr-code-btn',