Merge pull request #993 from web3ui/feat/aptos-network

[Illustration,Crypto Card,Crypto Logo]: Aptos network
web3ui · Jan 4, 2023 · a48dd75 · a48dd75
2 parents d506933 + 8658bad
commit a48dd75
Show file tree

Hide file tree

Showing 8 changed files with 66 additions and 1 deletion.
diff --git a/.changeset/swift-plants-boil.md b/.changeset/swift-plants-boil.md
@@ -0,0 +1,5 @@
+---
+'@web3uikit/core': patch
+---
+
+Add aptos network illustration, crypto logo, crypto card
diff --git a/packages/core/src/interfaces/logo.ts b/packages/core/src/interfaces/logo.ts
@@ -41,6 +41,12 @@ export const chainLogoData = {
     },
     /* PLOP_INJECT_CHAIN */
 
+    aptos : {
+        name:'aptos',
+        color:'#041836',
+    },
+
+
     palm : {
         name:'palm',
         color:'#6818AA',

diff --git a/packages/core/src/lib/CryptoCards/CryptoCards.stories.tsx b/packages/core/src/lib/CryptoCards/CryptoCards.stories.tsx
@@ -91,6 +91,13 @@ Optimism.args = {
 };
 
 /* PLOP_INJECT_CHAIN */
+export const Aptos = Template.bind({});
+Aptos.args = {
+    chain: 'aptos',
+    chainType: 'Network',
+    bgColor: chainLogoData['aptos'].color,
+    btnText: 'View Endpoints',
+};
 export const Palm = Template.bind({});
 Palm.args = {
     chain: 'palm',

diff --git a/packages/core/src/lib/CryptoLogos/CryptoLogos.stories.tsx b/packages/core/src/lib/CryptoLogos/CryptoLogos.stories.tsx
@@ -73,6 +73,11 @@ Optimism.args = {
 };
 
 /* PLOP_INJECT_CHAIN */
+export const Aptos = Template.bind({});
+Aptos.args = {
+    chain: 'aptos',
+    size: '48px',
+};
 export const Palm = Template.bind({});
 Palm.args = {
     chain: 'palm',

diff --git a/packages/core/src/lib/Illustrations/Illustration.stories.tsx b/packages/core/src/lib/Illustrations/Illustration.stories.tsx
@@ -76,6 +76,10 @@ Optimism.args = {
 };
 
 /* PLOP_INJECT_CHAIN */
+export const Aptos = BackgroundColoredTemplate.bind({});
+Aptos.args = {
+    logo: 'aptos',
+};
 export const Palm = BackgroundColoredTemplate.bind({});
 Palm.args = {
     logo: 'palm',

diff --git a/packages/core/src/lib/Illustrations/images/chains/aptos.tsx b/packages/core/src/lib/Illustrations/images/chains/aptos.tsx
@@ -0,0 +1,32 @@
+import React from 'react';
+import { ILogoProps } from '../../types';
+
+const aptos: React.FC<ILogoProps> = ({ width = '120', height = '160' }) => {
+    return (
+        <svg
+            width={width}
+            height={height}
+            viewBox="0 0 120 160"
+            fill="none"
+            xmlns="http://www.w3.org/2000/svg"
+        >
+            <path
+                d="M110.875 75.7853H109.828C97.6176 75.7853 85.4076 75.7758 73.1996 75.7987C71.8215 75.8006 70.7492 75.3285 69.8661 74.2887C68.8378 73.0788 67.7751 71.8957 66.7123 70.7144C65.2157 69.0515 63.4228 69.0267 61.8517 70.6513C60.571 71.9759 59.2999 73.3101 58.0384 74.6557C57.3255 75.4164 56.494 75.7949 55.4275 75.7949C40.2931 75.7796 25.1587 75.7853 10.0223 75.7834C9.74328 75.7834 9.46422 75.7586 8.98828 75.7375C9.31513 73.6388 9.55405 71.5994 9.96883 69.5962C10.3549 67.7365 10.9532 65.9245 11.4062 64.0781C11.5935 63.3173 11.9834 63.1243 12.7461 63.1262C28.5495 63.151 44.3509 63.13 60.1543 63.1606C62.4117 63.1644 64.2275 62.4687 65.6381 60.67C66.4199 59.6723 67.2953 58.7415 68.1688 57.8183C69.524 56.3866 71.3379 56.4306 72.6548 57.9024C73.7367 59.1084 74.8396 60.2992 75.8736 61.5474C76.8484 62.7229 78.0736 63.1568 79.5645 63.1549C88.7526 63.1357 97.9426 63.1568 107.131 63.1262C107.972 63.1224 108.314 63.3575 108.572 64.1775C109.747 67.9142 110.55 71.7122 110.871 75.7872L110.875 75.7853Z"
+                fill="white"
+            />
+            <path
+                d="M13.9671 102.303C11.9926 98.2397 10.6221 94.0366 9.77539 89.5295C10.2246 89.5295 10.5954 89.5295 10.9662 89.5295C21.3967 89.5295 31.8271 89.518 42.2576 89.5391C44.3334 89.5429 46.0211 88.849 47.3476 87.232C48.1944 86.2018 49.0889 85.2098 49.9968 84.2311C51.3329 82.7918 53.1812 82.7957 54.4962 84.2369C55.6106 85.4563 56.723 86.6815 57.7857 87.9469C58.7395 89.0861 59.9303 89.5371 61.3887 89.5352C77.2571 89.5219 93.1255 89.5276 108.992 89.5276C109.368 89.5276 109.745 89.5276 110.185 89.5276C109.393 93.8492 108.053 97.8918 106.262 101.799C105.985 102.405 105.546 102.305 105.087 102.305C96.0556 102.305 87.0243 102.305 77.993 102.305C70.3608 102.305 62.7286 102.286 55.0983 102.322C53.5463 102.33 52.3421 101.831 51.3577 100.629C50.3714 99.4248 49.3125 98.2818 48.2708 97.1235C46.9156 95.6154 45.1094 95.5523 43.6892 96.9858C42.3035 98.385 41.0056 99.8797 39.553 101.206C38.9662 101.743 38.0774 102.246 37.3224 102.254C29.5659 102.33 21.8076 102.3 13.9633 102.3L13.9671 102.303Z"
+                fill="white"
+            />
+            <path
+                d="M100.663 49.4363C98.1627 49.4363 95.6607 49.4363 93.1605 49.4363C92.4935 49.4363 91.8245 49.4306 91.1574 49.4363C89.9762 49.4497 88.9937 49.0101 88.2081 48.1347C87.0422 46.833 85.8992 45.5123 84.7217 44.2202C83.357 42.7216 81.5374 42.6872 80.1325 44.1284C78.8691 45.4243 77.6114 46.7298 76.39 48.0659C75.5203 49.0177 74.5073 49.4516 73.1961 49.4497C55.5845 49.4268 37.971 49.4344 20.3595 49.4344C20.0135 49.4344 19.6675 49.4344 19.0215 49.4344C27.7776 38.2394 38.8751 31.303 52.748 29.5101C72.3665 26.9756 88.3075 33.9464 100.77 49.0789C100.733 49.1974 100.697 49.3159 100.661 49.4344L100.663 49.4363Z"
+                fill="white"
+            />
+            <path
+                d="M22.7715 114.994C24.8817 114.812 26.3859 113.759 27.6226 112.186C28.3279 111.289 29.1288 110.465 29.8933 109.613C31.1988 108.157 33.0605 108.111 34.387 109.538C35.467 110.702 36.5335 111.882 37.5389 113.109C38.5653 114.365 39.8268 114.871 41.4458 114.869C59.6269 114.843 77.8081 114.852 95.9912 114.852C96.3658 114.852 96.7424 114.852 97.117 114.852C88.4316 124.191 77.7928 129.685 65.1528 130.87C48.5351 132.427 34.4252 126.938 22.7715 114.992V114.994Z"
+                fill="white"
+            />
+        </svg>
+    );
+};
+export default aptos;
diff --git a/packages/core/src/lib/Illustrations/images/chains/index.ts b/packages/core/src/lib/Illustrations/images/chains/index.ts
@@ -42,6 +42,11 @@ const optimismLogo: ILogoImport = {
     component: lazy(() => import('./optimism')),
 };
 /* PLOP_INJECT_CHAIN_1 */
+const aptosLogo: ILogoImport = {
+    name: 'aptos',
+    component: lazy(() => import('./aptos')),
+};
+
 const palmLogo: ILogoImport = {
     name: 'palm',
     component: lazy(() => import('./palm')),
@@ -60,5 +65,6 @@ export default {
     roninLogo,
     optimismLogo,
     /* PLOP_INJECT_CHAIN_2 */
+    aptosLogo,
     palmLogo,
 };
diff --git a/packages/core/src/lib/Select/SelectBeta/SelectBeta.styles.ts b/packages/core/src/lib/Select/SelectBeta/SelectBeta.styles.ts
@@ -167,7 +167,7 @@ const DivStyledOverlay = styled.div`
     bottom: 0;
     display: none;
     left: 0;
-    position: fixed;
+    position: absolute;
     right: 0;
     top: 0;
     z-index: 2;