fix icon sizs

Author: macalinao

packages/example/src/App.tsx

@@ -1,4 +1,3 @@
-import { css } from "@emotion/react";
 import { WalletKitProvider } from "@gokiprotocol/walletkit";
 
 import { Body } from "./Body";
@@ -23,10 +22,6 @@ const App: React.FC = () => {
         name: "My App",
         icon: (
           <img
-            css={css`
-              width: 48px;
-              height: 48px;
-            `}
             src="https://goki.so/assets/android-chrome-256x256.png"
             alt="icon"
           />

packages/walletkit/package.json

@@ -28,7 +28,8 @@
     "@types/react-dom": "18.0.5",
     "bn.js": "^5.2.1",
     "react": "^18.1.0",
-    "react-dom": "^18.1.0"
+    "react-dom": "^18.1.0",
+    "typescript": "^4.7.2"
   },
   "dependencies": {
     "@react-spring/web": "^9.4.5",

packages/walletkit/src/components/WalletSelectorModal/WalletStepIntro/index.tsx

@@ -1,3 +1,4 @@
+import { css } from "@emotion/react";
 import styled from "@emotion/styled";
 
 import { ButtonWithFooter } from "../ButtonWithFooter";
@@ -21,7 +22,19 @@ export const WalletStepIntro: React.FC<Props> = ({
         <AppIcons>
           <SolanaIcon />
           <ConnectDots />
-          {appIcon}
+          <div
+            css={css`
+              width: 48px;
+              height: 48px;
+              & > img,
+              & > svg {
+                width: 100%;
+                height: 100%;
+              }
+            `}
+          >
+            {appIcon}
+          </div>
         </AppIcons>
       </AppIconsWrapper>
       <Instruction>

yarn.lock

@@ -3785,6 +3785,7 @@ __metadata:
     react-dom: "npm:^18.1.0"
     react-use-gesture: "npm:^9.1.3"
     tslib: "npm:^2.4.0"
+    typescript: "npm:^4.7.2"
   peerDependencies:
     "@emotion/react": ^11
     "@emotion/styled": ^11