fix: add border radius to lens cmp wrapping cards (#1672)

rainbow-me · Aug 22, 2024 · b0af895 · b0af895
1 parent 6feb229
commit b0af895
Showing 1 changed file with 12 additions and 1 deletion.
diff --git a/src/entries/popup/pages/home/Points/PointsDashboard.tsx b/src/entries/popup/pages/home/Points/PointsDashboard.tsx
@@ -74,11 +74,20 @@ function Card({
 }: PropsWithChildren<BoxProps & MotionProps> & {
   onClick?: () => void;
 }) {
+  const getTabIndex = () => {
+    if (typeof props.tabIndex === 'number') {
+      return props.tabIndex;
+    } else if (props.onClick) {
+      return 0;
+    }
+    return -1;
+  };
   return (
     <Lens
       onClick={props.onClick}
       width={props.width || 'full'}
-      tabIndex={typeof props.tabIndex === 'number' ? props.tabIndex : 0}
+      tabIndex={getTabIndex()}
+      borderRadius={props.borderRadius || '20px'}
     >
       <Box
         as={motion.div}
@@ -317,6 +326,7 @@ function ReferralCode() {
               onTap={copyReferralCode}
               onClick={copyReferralCode}
               style={{ height: 40, willChange: 'transform' }}
+              tabIndex={-1}
             >
               <Text size="16pt" weight="heavy" align="center">
                 {formatReferralCode(data.user.referralCode)}
@@ -334,6 +344,7 @@ function ReferralCode() {
               onTap={() => copyReferralLink(data.user.referralCode)}
               onClick={() => copyReferralLink(data.user.referralCode)}
               style={{ height: 40, willChange: 'transform' }}
+              tabIndex={-1}
             >
               <Inline alignVertical="center" space="8px">
                 <Symbol