Skip to content

Commit

Permalink
chore: Minor ui fix prior to publish
Browse files Browse the repository at this point in the history
  • Loading branch information
@ape-fede
ape-fede committed Feb 15, 2023
1 parent 235e5b2 commit 8e662b1
Show file tree
Hide file tree
Showing 3 changed files with 46 additions and 130 deletions.
120 changes: 18 additions & 102 deletions src/__tests__/widgets/walletmodal.test.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -63,7 +63,7 @@ it("renders ConnectModal correctly", () => {
style="z-index: 1; opacity: 1; transform: none; user-select: none;"
>
<div
class="css-16py1c1-PrioritizedWallets"
class="css-1g7mmo7-PrioritizedWallets"
>
<div
class="css-jqjmc4-PrioritizedWallets"
Expand Down Expand Up @@ -460,7 +460,7 @@ it("renders ConnectModal correctly", () => {
class="css-1wgf5ji-PrioritizedWallets"
>
<button
class="css-ce5ixq-WalletCard"
class="css-clu8l3-WalletCard"
id="wallet-connect-"
>
<div
Expand Down Expand Up @@ -598,12 +598,12 @@ it("renders ConnectModal correctly", () => {
</svg>
</div>
<span
class="css-1i08j67-WalletCard"
class="css-ojmvxc-WalletCard"
/>
</button>
<button
class="css-ce5ixq-WalletCard"
class="css-clu8l3-WalletCard"
id="wallet-connect-"
>
<div
Expand Down Expand Up @@ -642,12 +642,12 @@ it("renders ConnectModal correctly", () => {
</svg>
</div>
<span
class="css-1i08j67-WalletCard"
class="css-ojmvxc-WalletCard"
/>
</button>
<button
class="css-ce5ixq-WalletCard"
class="css-clu8l3-WalletCard"
id="wallet-connect-"
>
<div
Expand All @@ -656,111 +656,27 @@ it("renders ConnectModal correctly", () => {
<svg
class="sc-bdfBQB kA-DbXw"
color="text"
viewBox="0 0 218 256"
viewBox="0 0 96 96"
width="100%"
xmlns="http://www.w3.org/2000/svg"
>
<defs>
<lineargradient
id="linearGradient-1"
x1="0%"
x2="100%"
y1="50.7055163%"
y2="50.7055163%"
>
<stop
offset="0%"
stop-color="#FF5500"
/>
<stop
offset="40.9877232%"
stop-color="#FF5500"
/>
<stop
offset="58.1981215%"
stop-color="#FF2000"
/>
<stop
offset="100%"
stop-color="#FF2000"
/>
</lineargradient>
<lineargradient
id="linearGradient-2"
x1="2.1484375%"
x2="100%"
y1="50.7055163%"
y2="50.7055163%"
>
<stop
offset="0%"
stop-color="#FF452A"
/>
<stop
offset="100%"
stop-color="#FF2000"
/>
</lineargradient>
<path
d="M170.272109,25.3359387 L147.968109,0.00010893617 L108.800109,0.00010893617 L69.6321088,0.00010893617 L47.3281088,25.3359387 C47.3281088,25.3359387 27.7441088,19.8891302 18.4961088,29.1487047 C18.4961088,29.1487047 44.6081088,26.7886026 53.5841088,41.4040238 C53.5841088,41.4040238 77.7921088,46.0338111 81.0561088,46.0338111 C84.3201088,46.0338111 91.3921088,43.3104068 97.9201088,41.1316834 C104.448109,38.95296 108.800109,38.9371643 108.800109,38.9371643 C108.800109,38.9371643 113.152109,38.95296 119.680109,41.1316834 C126.208109,43.3104068 133.280109,46.0338111 136.544109,46.0338111 C139.808109,46.0338111 164.016109,41.4040238 164.016109,41.4040238 C172.992109,26.7886026 199.104109,29.1487047 199.104109,29.1487047 C189.856109,19.8891302 170.272109,25.3359387 170.272109,25.3359387"
id="path-3"
/>
</defs>
<g
fill="none"
fill-rule="evenodd"
id="starting-collection"
stroke="none"
stroke-width="1"
>
<g
id="Build-Icons"
transform="translate(-70.000000, -350.000000)"
>
<g
id="build-icons/Stable"
transform="translate(50.000000, 350.000000)"
>
<g
id="Logo"
transform="translate(20.114286, 0.000000)"
>
<path
d="M209.984109,61.2848749 L215.968109,46.5784919 C215.968109,46.5784919 208.352109,38.4082791 199.104109,29.1487047 C189.856109,19.8891302 170.272109,25.3359387 170.272109,25.3359387 L147.968109,0.00010893617 L108.800109,0.00010893617 L69.6321088,0.00010893617 L47.3281088,25.3359387 C47.3281088,25.3359387 27.7441088,19.8891302 18.4961088,29.1487047 C9.2481088,38.4082791 1.6321088,46.5784919 1.6321088,46.5784919 L7.6161088,61.2848749 L0.0001088,83.0721089 C0.0001088,83.0721089 22.3993088,168.017811 25.0241088,178.391258 C30.1921088,198.81679 33.7281088,206.714662 48.4161088,217.063598 C63.1041088,227.412534 89.7601088,245.387003 94.1121088,248.110407 C98.4641088,250.833811 103.904109,255.472858 108.800109,255.472858 C113.696109,255.472858 119.136109,250.833811 123.488109,248.110407 C127.840109,245.387003 154.496109,227.412534 169.184109,217.063598 C183.872109,206.714662 187.408109,198.81679 192.576109,178.391258 C195.200365,168.017811 217.600109,83.0721089 217.600109,83.0721089 L209.984109,61.2848749 Z"
fill="url(#linearGradient-1)"
id="Head"
/>
<path
d="M164.016109,41.4040238 C164.016109,41.4040238 192.704493,76.1274281 192.704493,83.5487047 C192.704493,90.9699813 189.095597,92.9286536 185.467117,96.7866281 C181.838637,100.644603 165.991373,117.49376 163.956269,119.657232 C161.921165,121.821249 157.684493,125.101862 160.176557,131.006747 C162.668621,136.911632 166.344973,144.425505 162.256813,152.046679 C158.168109,159.667854 151.164109,164.754628 146.676109,163.913641 C142.188109,163.072109 131.648109,157.557215 127.772109,155.038066 C123.896109,152.518917 111.611501,142.374781 111.611501,138.493386 C111.611501,134.612534 124.310093,127.643888 126.655821,126.0605 C129.002637,124.477658 139.703117,118.349454 139.922349,115.944143 C140.141037,113.538288 140.057805,112.832926 136.899885,106.889369 C133.741965,100.945266 128.054989,93.0136238 129.001549,87.7362111 C129.948109,82.459343 139.119949,79.7152409 145.665357,77.2402111 C152.209677,74.765726 164.811437,70.0918196 166.385229,69.3652153 C167.960109,68.6380664 167.553197,67.945777 162.783949,67.4931472 C158.015789,67.0405174 144.483245,65.2419813 138.382285,66.9446536 C132.281325,68.647326 121.858285,71.2378281 121.013997,72.6115132 C120.169709,73.9851983 119.424973,74.0314962 120.292109,78.7702196 C121.158701,83.508943 125.622765,106.24719 126.055789,110.285998 C126.489357,114.324807 127.336909,116.994832 122.987629,117.990509 C118.637805,118.986186 111.316109,120.715003 108.800109,120.715003 C106.284109,120.715003 98.9618688,118.986186 94.6125888,117.990509 C90.2627648,116.994832 91.1103168,114.324807 91.5438848,110.285998 C91.9774528,106.24719 96.4409728,83.508943 97.3081088,78.7702196 C98.1747008,74.0314962 97.4299648,73.9851983 96.5862208,72.6115132 C95.7419328,71.2378281 85.3183488,68.647326 79.2173888,66.9446536 C73.1164288,65.2419813 59.5844288,67.0405174 54.8157248,67.4931472 C50.0470208,67.945777 49.6401088,68.6380664 51.2144448,69.3652153 C52.7887808,70.0918196 65.3905408,74.765726 71.9348608,77.2402111 C78.4797248,79.7152409 87.6521088,82.459343 88.5986688,87.7362111 C89.5452288,93.0136238 83.8577088,100.945266 80.7003328,106.889369 C77.5424128,112.832926 77.4586368,113.538288 77.6778688,115.944143 C77.8965568,118.349454 88.5975808,124.477658 90.9438528,126.0605 C93.2901248,127.643888 105.988173,134.612534 105.988173,138.493386 C105.988173,142.374781 93.7041088,152.518917 89.8281088,155.038066 C85.9521088,157.557215 75.4121088,163.072109 70.9241088,163.913641 C66.4361088,164.754628 59.4321088,159.667854 55.3434048,152.046679 C51.2552448,144.425505 54.9315968,136.911632 57.4231168,131.006747 C59.9151808,125.101862 55.6790528,121.821249 53.6434048,119.657232 C51.6088448,117.49376 35.7610368,100.644603 32.1325568,96.7866281 C28.5040768,92.9286536 24.8957248,90.9699813 24.8957248,83.5487047 C24.8957248,76.1274281 53.5841088,41.4040238 53.5841088,41.4040238 C53.5841088,41.4040238 77.7921088,46.0338111 81.0561088,46.0338111 C84.3201088,46.0338111 91.3921088,43.3104068 97.9201088,41.1316834 C104.448109,38.95296 108.800109,38.9371643 108.800109,38.9371643 C108.800109,38.9371643 113.152109,38.95296 119.680109,41.1316834 C126.208109,43.3104068 133.280109,46.0338111 136.544109,46.0338111 C139.808109,46.0338111 164.016109,41.4040238 164.016109,41.4040238 Z M142.509504,174.227935 C144.28512,175.341263 143.202016,177.439918 141.584704,178.584837 C139.966848,179.729757 118.228064,196.584361 116.118432,198.447169 C114.008256,200.310523 110.908,203.387425 108.8,203.387425 C106.692,203.387425 103.5912,200.310523 101.481568,198.447169 C99.371392,196.584361 77.633152,179.729757 76.015296,178.584837 C74.39744,177.439918 73.31488,175.341263 75.090496,174.227935 C76.866656,173.115152 82.422528,170.306233 90.08912,166.333876 C97.754624,162.362063 107.308896,158.985042 108.8,158.985042 C110.291104,158.985042 119.844832,162.362063 127.511424,166.333876 C135.177472,170.306233 140.733344,173.115152 142.509504,174.227935 Z"
fill="#FFFFFF"
id="Face"
/>
<mask
fill="white"
id="mask-4"
>
<use
xlink:href="#path-3"
/>
</mask>
<use
fill="url(#linearGradient-2)"
id="Top-Head"
xlink:href="#path-3"
/>
</g>
</g>
</g>
</g>
<path
d="M96 48C96 21.4903 74.5097 0 48 0C21.4903 0 0 21.4903 0 48C0 74.5097 21.4903 96 48 96C74.5097 96 96 74.5097 96 48Z"
fill="#3389FB"
/>
<path
d="M29.6927 35.4245C39.8036 25.5252 56.1965 25.5252 66.3074 35.4245L67.5242 36.6159C68.0298 37.1109 68.0298 37.9134 67.5242 38.4084L63.3616 42.4839C63.1088 42.7314 62.699 42.7314 62.4462 42.4839L60.7717 40.8444C53.7181 33.9384 42.282 33.9384 35.2284 40.8444L33.4351 42.6002C33.1823 42.8477 32.7725 42.8477 32.5197 42.6002L28.3571 38.5247C27.8515 38.0297 27.8515 37.2272 28.3571 36.7322L29.6927 35.4245ZM74.9161 43.8532L78.6208 47.4805C79.1264 47.9755 79.1264 48.778 78.6208 49.2729L61.9159 65.6288C61.4103 66.1237 60.5907 66.1237 60.0851 65.6288C60.0851 65.6288 60.0851 65.6288 60.0851 65.6288L48.229 54.0206C48.1026 53.8968 47.8977 53.8968 47.7713 54.0206C47.7713 54.0206 47.7713 54.0206 47.7713 54.0206L35.9153 65.6288C35.4098 66.1237 34.5902 66.1237 34.0846 65.6288C34.0846 65.6288 34.0846 65.6288 34.0846 65.6288L17.3792 49.2727C16.8736 48.7778 16.8736 47.9753 17.3792 47.4803L21.0839 43.853C21.5895 43.3581 22.4091 43.3581 22.9146 43.853L34.771 55.4614C34.8974 55.5851 35.1023 55.5851 35.2287 55.4614C35.2287 55.4614 35.2287 55.4614 35.2287 55.4614L47.0844 43.853C47.59 43.358 48.4096 43.358 48.9152 43.853C48.9152 43.853 48.9152 43.853 48.9152 43.853L60.7715 55.4614C60.8979 55.5851 61.1028 55.5851 61.2292 55.4614L73.0854 43.8532C73.5909 43.3583 74.4105 43.3583 74.9161 43.8532Z"
fill="white"
/>
</svg>
</div>
<span
class="css-1i08j67-WalletCard"
class="css-ojmvxc-WalletCard"
/>
</button>
<button
class="css-1ega2o0-PrioritizedWallets"
class="css-130lwyq-PrioritizedWallets"
>
<div
class="css-iq0afh-PrioritizedWallets"
Expand All @@ -776,7 +692,7 @@ it("renders ConnectModal correctly", () => {
</div>
</div>
<span
class="css-div3zz-PrioritizedWallets"
class="css-1cq9yfe-PrioritizedWallets"
/>
</button>
Expand Down
14 changes: 7 additions & 7 deletions src/widgets/WalletModal/components/styles.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,7 @@ const styles: Record<
flexWrap: "wrap",
position: "absolute",
width: "100%",
maxWidth: ["248px", "248px", "580px"],
maxWidth: ["240px", "240px", "580px"],
flexDirection: "column",
justifyContent: "space-between",
height: ["325px", "325px", "390px"],
Expand Down Expand Up @@ -54,13 +54,13 @@ const styles: Record<
mb: "-15px",
maxHeight: ["273px", "273px", "335px"],
overflowY: "auto",
width: ["248px", "248px", "580px"],
width: ["240px", "240px", "580px"],
},
prioritizedContainer: {
flexWrap: "wrap",
position: "absolute",
width: "100%",
maxWidth: ["248px", "248px", "580px"],
maxWidth: ["240px", "240px", "580px"],
},
infoContainer: {
flexWrap: "wrap",
Expand All @@ -86,13 +86,13 @@ const styles: Record<
mt: ["15px", "15px", "30px"],
},
button: {
width: ["112px", "112px", "128px"],
width: ["110px", "110px", "128px"],
flexDirection: "column",
minHeight: ["84px", "84px", "114px"],
justifyContent: "flex-start",
mb: "15px",
mr: ["5px", "5px", "15px"],
padding: "0",
padding: "0 12px",
background: "white4",
fontSize: ["12px", "12px", "16px"],
},
Expand All @@ -107,8 +107,8 @@ const styles: Record<
justifyContent: "center",
},
walletName: {
lineHeight: "18px",
mt: "6px",
lineHeight: ["14px", "14px", "18px"],
mt: ["3px", "3px", "6px"],
fontSize: ["12px", "12px", "14px"],
fontWeight: 700,
},
Expand Down
42 changes: 21 additions & 21 deletions src/widgets/WalletModal/config.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -26,23 +26,13 @@ const connectors: Config[] = [
connectorId: ConnectorNames.Injected,
},
{
title: "Brave Wallet",
icon: Brave,
connectorId: ConnectorNames.Injected,
},
{
title: "Social Login",
icon: TorusWallet,
connectorId: ConnectorNames.Torus,
},
{
title: "WalletConnect",
title: "Wallet Connect",
icon: WalletConnect,
connectorId: ConnectorNames.WalletConnect,
},
{
title: "SafePal Wallet",
icon: SafePalWallet,
title: "Bitkeep",
icon: Bitkeep,
connectorId: ConnectorNames.Injected,
},
{
Expand All @@ -51,15 +41,30 @@ const connectors: Config[] = [
connectorId: ConnectorNames.Injected,
},
{
title: "Coinbase Wallet",
icon: Coinbase,
connectorId: ConnectorNames.Walletlink,
title: "SafePal Wallet",
icon: SafePalWallet,
connectorId: ConnectorNames.Injected,
},
{
title: "Binance Chain Wallet",
icon: BinanceChain,
connectorId: ConnectorNames.BSC,
},
{
title: "Brave Wallet",
icon: Brave,
connectorId: ConnectorNames.Injected,
},
{
title: "Social Login",
icon: TorusWallet,
connectorId: ConnectorNames.Torus,
},
{
title: "Coinbase Wallet",
icon: Coinbase,
connectorId: ConnectorNames.Walletlink,
},
{
title: "Unstoppable Domains",
icon: Unstoppable,
Expand All @@ -75,11 +80,6 @@ const connectors: Config[] = [
icon: OntoWallet,
connectorId: ConnectorNames.Injected,
},
{
title: "Bitkeep",
icon: Bitkeep,
connectorId: ConnectorNames.Injected,
},
{
title: "MathWallet",
icon: MathWallet,
Expand Down

0 comments on commit 8e662b1

Please sign in to comment.