Skip to content

Commit d5af77d

Browse files
lochielochie
authored
add: zora + base logos (#418)
* zora + base logos * base goerli
1 parent 3db9c75 commit d5af77d

File tree

2 files changed

+282
-0
lines changed

2 files changed

+282
-0
lines changed

‎packages/connectkit/src/assets/chains.tsx‎

Lines changed: 247 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -602,8 +602,254 @@ const Metis = ({ testnet, ...props }: { testnet?: boolean }) => (
602602
</svg>
603603
);
604604

605+
const Base = ({ testnet, ...props }: { testnet?: boolean }) => (
606+
<svg
607+
{...props}
608+
width="44"
609+
height="44"
610+
viewBox="0 0 44 44"
611+
fill="none"
612+
xmlns="http://www.w3.org/2000/svg"
613+
style={{
614+
background: testnet
615+
? 'linear-gradient(180deg, #8995A9 0%, #424D5F 99.48%)'
616+
: '#0052FF',
617+
}}
618+
>
619+
<path
620+
d="M21.9756 36C29.721 36 36 29.732 36 22C36 14.268 29.721 8 21.9756 8C14.6271 8 8.59871 13.6419 8 20.8232H26.5371V23.1768H8C8.59871 30.3581 14.6271 36 21.9756 36Z"
621+
fill="white"
622+
/>
623+
</svg>
624+
);
625+
const Zora = ({ testnet, ...props }: { testnet?: boolean }) => (
626+
<svg
627+
{...props}
628+
width="44"
629+
height="44"
630+
viewBox="0 0 44 44"
631+
fill="none"
632+
xmlns="http://www.w3.org/2000/svg"
633+
style={{
634+
filter: testnet ? 'grayscale(1)' : 'none',
635+
}}
636+
>
637+
<mask
638+
id="ck_zora_mask_a"
639+
style={{
640+
maskType: 'alpha',
641+
}}
642+
maskUnits="userSpaceOnUse"
643+
x="0"
644+
y="0"
645+
width="44"
646+
height="44"
647+
>
648+
<path
649+
d="M22 44C34.1503 44 44 34.1503 44 22C44 9.84974 34.1503 0 22 0C9.84974 0 0 9.84974 0 22C0 34.1503 9.84974 44 22 44Z"
650+
fill="#D9D9D9"
651+
/>
652+
</mask>
653+
<g mask="url(#ck_zora_mask_a)">
654+
<path
655+
d="M51.4558 -9.56445H-6.78906V48.6804H51.4558V-9.56445Z"
656+
fill="#A1723A"
657+
/>
658+
<g filter="url(#ck_zora_filter_a)">
659+
<path
660+
d="M23.6807 43.0752C36.6464 43.0752 47.157 32.5675 47.157 19.6058C47.157 6.64397 36.6464 -3.86365 23.6807 -3.86365C10.7152 -3.86365 0.20459 6.64397 0.20459 19.6058C0.20459 32.5675 10.7152 43.0752 23.6807 43.0752Z"
661+
fill="#531002"
662+
/>
663+
</g>
664+
<g filter="url(#ck_zora_filter_b)">
665+
<path
666+
d="M26.2112 35.6464C36.7271 35.6464 45.2521 27.1185 45.2521 16.5988C45.2521 6.07904 36.7271 -2.44885 26.2112 -2.44885C15.6953 -2.44885 7.17041 6.07904 7.17041 16.5988C7.17041 27.1185 15.6953 35.6464 26.2112 35.6464Z"
667+
fill="#2B5DF0"
668+
/>
669+
</g>
670+
<g filter="url(#ck_zora_filter_c)">
671+
<path
672+
d="M25.8644 36.7348C36.8276 36.7348 45.7149 27.8444 45.7149 16.8777C45.7149 5.91084 36.8276 -2.97949 25.8644 -2.97949C14.9015 -2.97949 6.01416 5.91084 6.01416 16.8777C6.01416 27.8444 14.9015 36.7348 25.8644 36.7348Z"
673+
fill="url(#paint0_radial_3914_1946)"
674+
/>
675+
</g>
676+
<g filter="url(#ck_zora_filter_d)">
677+
<path
678+
d="M29.1567 21.8779C34.6797 21.8779 39.1567 17.4008 39.1567 11.8779C39.1567 6.35509 34.6797 1.87793 29.1567 1.87793C23.6338 1.87793 19.1567 6.35509 19.1567 11.8779C19.1567 17.4008 23.6338 21.8779 29.1567 21.8779Z"
679+
fill="#FCB8D4"
680+
/>
681+
</g>
682+
<g filter="url(#ck_zora_filter_e)">
683+
<path
684+
d="M29.15 15.8642C31.3555 15.8642 33.1432 14.0765 33.1432 11.871C33.1432 9.66562 31.3555 7.87781 29.15 7.87781C26.9445 7.87781 25.1567 9.66562 25.1567 11.871C25.1567 14.0765 26.9445 15.8642 29.15 15.8642Z"
685+
fill="white"
686+
/>
687+
</g>
688+
<g filter="url(#ck_zora_filter_f)">
689+
<path
690+
d="M26.4967 51.7416C46.3151 51.7416 62.3811 35.6757 62.3811 15.8573C62.3811 -3.96109 46.3151 -20.0271 26.4967 -20.0271C6.67829 -20.0271 -9.3877 -3.96109 -9.3877 15.8573C-9.3877 35.6757 6.67829 51.7416 26.4967 51.7416Z"
691+
fill="url(#paint1_radial_3914_1946)"
692+
fillOpacity="0.9"
693+
/>
694+
</g>
695+
</g>
696+
<defs>
697+
<filter
698+
id="ck_zora_filter_a"
699+
x="-5.23758"
700+
y="-9.30581"
701+
width="57.837"
702+
height="57.8232"
703+
filterUnits="userSpaceOnUse"
704+
colorInterpolationFilters="sRGB"
705+
>
706+
<feFlood floodOpacity="0" result="BackgroundImageFix" />
707+
<feBlend
708+
mode="normal"
709+
in="SourceGraphic"
710+
in2="BackgroundImageFix"
711+
result="shape"
712+
/>
713+
<feGaussianBlur
714+
stdDeviation="2.72108"
715+
result="effect1_foregroundBlur_3914_1946"
716+
/>
717+
</filter>
718+
<filter
719+
id="ck_zora_filter_b"
720+
x="-3.71395"
721+
y="-13.3332"
722+
width="59.8503"
723+
height="59.8639"
724+
filterUnits="userSpaceOnUse"
725+
colorInterpolationFilters="sRGB"
726+
>
727+
<feFlood floodOpacity="0" result="BackgroundImageFix" />
728+
<feBlend
729+
mode="normal"
730+
in="SourceGraphic"
731+
in2="BackgroundImageFix"
732+
result="shape"
733+
/>
734+
<feGaussianBlur
735+
stdDeviation="5.44218"
736+
result="effect1_foregroundBlur_3914_1946"
737+
/>
738+
</filter>
739+
<filter
740+
id="ck_zora_filter_c"
741+
x="1.93251"
742+
y="-7.06114"
743+
width="47.864"
744+
height="47.8775"
745+
filterUnits="userSpaceOnUse"
746+
colorInterpolationFilters="sRGB"
747+
>
748+
<feFlood floodOpacity="0" result="BackgroundImageFix" />
749+
<feBlend
750+
mode="normal"
751+
in="SourceGraphic"
752+
in2="BackgroundImageFix"
753+
result="shape"
754+
/>
755+
<feGaussianBlur
756+
stdDeviation="2.04082"
757+
result="effect1_foregroundBlur_3914_1946"
758+
/>
759+
</filter>
760+
<filter
761+
id="ck_zora_filter_d"
762+
x="10.9935"
763+
y="-6.28533"
764+
width="36.3265"
765+
height="36.3265"
766+
filterUnits="userSpaceOnUse"
767+
colorInterpolationFilters="sRGB"
768+
>
769+
<feFlood floodOpacity="0" result="BackgroundImageFix" />
770+
<feBlend
771+
mode="normal"
772+
in="SourceGraphic"
773+
in2="BackgroundImageFix"
774+
result="shape"
775+
/>
776+
<feGaussianBlur
777+
stdDeviation="4.08163"
778+
result="effect1_foregroundBlur_3914_1946"
779+
/>
780+
</filter>
781+
<filter
782+
id="ck_zora_filter_e"
783+
x="19.7146"
784+
y="2.43564"
785+
width="18.8707"
786+
height="18.8708"
787+
filterUnits="userSpaceOnUse"
788+
colorInterpolationFilters="sRGB"
789+
>
790+
<feFlood floodOpacity="0" result="BackgroundImageFix" />
791+
<feBlend
792+
mode="normal"
793+
in="SourceGraphic"
794+
in2="BackgroundImageFix"
795+
result="shape"
796+
/>
797+
<feGaussianBlur
798+
stdDeviation="2.72108"
799+
result="effect1_foregroundBlur_3914_1946"
800+
/>
801+
</filter>
802+
<filter
803+
id="ck_zora_filter_f"
804+
x="-13.4693"
805+
y="-24.1087"
806+
width="79.9318"
807+
height="79.9321"
808+
filterUnits="userSpaceOnUse"
809+
colorInterpolationFilters="sRGB"
810+
>
811+
<feFlood floodOpacity="0" result="BackgroundImageFix" />
812+
<feBlend
813+
mode="normal"
814+
in="SourceGraphic"
815+
in2="BackgroundImageFix"
816+
result="shape"
817+
/>
818+
<feGaussianBlur
819+
stdDeviation="2.04082"
820+
result="effect1_foregroundBlur_3914_1946"
821+
/>
822+
</filter>
823+
<radialGradient
824+
id="paint0_radial_3914_1946"
825+
cx="0"
826+
cy="0"
827+
r="1"
828+
gradientUnits="userSpaceOnUse"
829+
gradientTransform="translate(29.2127 11.2756) rotate(128.228) scale(37.4897 37.4867)"
830+
>
831+
<stop offset="0.286458" stopColor="#387AFA" />
832+
<stop offset="0.647782" stopColor="#387AFA" stopOpacity="0" />
833+
</radialGradient>
834+
<radialGradient
835+
id="paint1_radial_3914_1946"
836+
cx="0"
837+
cy="0"
838+
r="1"
839+
gradientUnits="userSpaceOnUse"
840+
gradientTransform="translate(26.4967 15.8573) rotate(90) scale(35.8844 35.8844)"
841+
>
842+
<stop offset="0.598958" stopOpacity="0" />
843+
<stop offset="0.671875" />
844+
<stop offset="0.734375" stopOpacity="0" />
845+
</radialGradient>
846+
</defs>
847+
</svg>
848+
);
849+
605850
export default {
606851
UnknownChain,
852+
Base,
607853
Ethereum,
608854
Polygon,
609855
Optimism,
@@ -625,4 +871,5 @@ export default {
625871
Filecoin,
626872
Metis,
627873
IoTeX,
874+
Zora,
628875
};

‎packages/connectkit/src/constants/chainConfigs.tsx‎

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -73,6 +73,11 @@ export const chainConfigs: Chain[] = [
7373
name: 'Optimism Goerli',
7474
logo: <Logos.Optimism testnet />,
7575
},
76+
{
77+
id: 11155420,
78+
name: 'Optimism Sepolia',
79+
logo: <Logos.Optimism testnet />,
80+
},
7681
{
7782
id: 137,
7883
name: 'Polygon',
@@ -283,4 +288,34 @@ export const chainConfigs: Chain[] = [
283288
name: 'IoTeX Testnet',
284289
logo: <Logos.IoTeX testnet />,
285290
},
291+
{
292+
id: 8_453,
293+
name: 'Base',
294+
logo: <Logos.Base />,
295+
},
296+
{
297+
id: 84_531,
298+
name: 'Base Goerli',
299+
logo: <Logos.Base testnet />,
300+
},
301+
{
302+
id: 84_532,
303+
name: 'Base Sepolia',
304+
logo: <Logos.Base testnet />,
305+
},
306+
{
307+
id: 7777777,
308+
name: 'Zora',
309+
logo: <Logos.Zora />,
310+
},
311+
{
312+
id: 999999999,
313+
name: 'Zora Sepolia',
314+
logo: <Logos.Zora testnet />,
315+
},
316+
{
317+
id: 999,
318+
name: 'Zora Goerli Testnet',
319+
logo: <Logos.Zora testnet />,
320+
},
286321
];

0 commit comments

Comments
 (0)