const Container = styled.div` display: flex; flex-wrap: wrap; gap: 30px 36px; color: #fff; `; const templates = [ { src: "bluebiu.near/widget/ZKEVM-all-in-one", bannerImg: "https://ipfs.near.social/ipfs/bafkreicwk2fqkrtkwhyioz7l6tkgmduxsw4ey7t6pd7isahu3bex7etbgu", }, { src: "guessme.near/widget/ZKEVMSwap.zkevm-bridge", bannerImg: "https://ipfs.near.social/ipfs/bafkreievrd4imhglvabvg2vgcqxmpk4vog6p3dw5cy3rsay4ocsyu3y7w4", }, { src: "guessme.near/widget/ZKEVMSwap.zkevm-swap", bannerImg: "https://ipfs.near.social/ipfs/bafkreihwkwijwsazh5dp3rxc2lwgi4algusd3b447o3xcfcnndbgaura3q", }, { src: "guessme.near/widget/ZKEVM.GAMMA", bannerImg: "https://ipfs.near.social/ipfs/bafkreih77ecmgng2fpy6mblk2aipt3agwm3anjldcyktx2j6kssggpelue", }, { src: "guessme.near/widget/ZKEVM.AAVE", bannerImg: "https://ipfs.near.social/ipfs/bafkreibmqzfwki7zye6ruqi3hifgexs6g5nv4qvzcmrm73lnra5mbkdrxe", }, ]; return ( <Container> {templates.map(({ src, bannerImg }, index) => ( <Widget src="guessme.near/widget/ZKEVM.Template-card" key={index} props={{ src, bannerImg, }} /> ))} <Widget src="guessme.near/widget/ZKEVMWarmUp.generage-uuid" /> </Container> );