const daoId = props.daoId; const profile = daoId && Social.get(`${daoId}/profile/**`, "final"); const BackgroundImage = styled.div` height: 240px; border-radius: 20px 20px 0 0; overflow: hidden; margin: 0 -12px; background: #eceef0; img { object-fit: cover; width: 100%; height: 100%; } @media (max-width: 1200px) { margin: calc(var(--body-top-padding) * -1) -12px 0; border-radius: 0; } @media (max-width: 900px) { height: 100px; } `; return ( <BackgroundImage> {profile.backgroundImage && ( <Widget src="mob.near/widget/Image" props={{ image: profile.backgroundImage, alt: "profile background image", fallbackUrl: "https://ipfs.near.social/ipfs/bafkreibiyqabm3kl24gcb2oegb7pmwdi6wwrpui62iwb44l7uomnn3lhbi", }} /> )} </BackgroundImage> );