const LogoContainer = styled.div` display: flex; column-gap: 0.5rem; align-items: center; ${({ justify }) => justify && "justify-content: center;"} `; const TaskChainNameContainer = styled.div` display: flex; column-gap: 0.5rem; align-items: center; color: #fff; font-size: 20.923px; font-style: normal; font-weight: 700; line-height: 150%; padding-right: 0.875rem; `; const OrganizationNameContainer = () => { return <TaskChainNameContainer>Boards</TaskChainNameContainer>; }; return ( <LogoContainer> <svg width="28" height="28" viewBox="0 0 28 28" fill="none" xmlns="http://www.w3.org/2000/svg"> <rect width="28" height="28" fill="#1E1E1E"/> <g id="Frame 20" clip-path="url(#clip0_0_1)"> <rect width="1440" height="900" transform="translate(-76 -26)" fill="#0E0E10"/> <g id="Group 2"> <g id="Group 1"> <rect id="Rectangle 3" width="28" height="28" rx="6" fill="#D0FC42"/> <path id="Subtract" fillRule="evenodd" clipRule="evenodd" d="M24.1568 13.9999C24.1568 8.69352 19.8554 4.39209 14.549 4.39209C9.2426 4.39209 4.94117 8.69352 4.94117 13.9999C4.93884 15.7503 5.41672 17.4677 6.32278 18.9653L5.46576 21.8784C5.41655 22.0456 5.41331 22.223 5.45639 22.392C5.49946 22.5609 5.58725 22.7151 5.71053 22.8384C5.83381 22.9617 5.98802 23.0495 6.15696 23.0926C6.3259 23.1356 6.50333 23.1324 6.67058 23.0832L9.58368 22.2262C11.0811 23.1326 12.7986 23.6105 14.549 23.6078C15.4677 23.6078 16.3564 23.4788 17.1977 23.238C17.1509 22.8993 17.1267 22.5534 17.1267 22.2017C17.1267 18.2267 20.2197 14.974 24.1303 14.719C24.1479 14.4816 24.1568 14.2418 24.1568 13.9999ZM10.1672 12.9809C10.4375 12.7106 10.804 12.5588 11.1863 12.5588C11.5685 12.5588 11.9351 12.7106 12.2053 12.9809C12.4756 13.2511 12.6274 13.6177 12.6274 13.9999C12.6274 14.3822 12.4756 14.7487 12.2053 15.019C11.9351 15.2893 11.5685 15.4411 11.1863 15.4411C10.804 15.4411 10.4375 15.2893 10.1672 15.019C9.89693 14.7487 9.74509 14.3822 9.74509 13.9999C9.74509 13.6177 9.89693 13.2511 10.1672 12.9809ZM16.8927 12.9809C17.163 12.7106 17.5295 12.5588 17.9118 12.5588C18.294 12.5588 18.6605 12.7106 18.9308 12.9809C19.2011 13.2511 19.3529 13.6177 19.3529 13.9999C19.3529 14.3822 19.2011 14.7487 18.9308 15.019C18.6605 15.2893 18.294 15.4411 17.9118 15.4411C17.5295 15.4411 17.163 15.2893 16.8927 15.019C16.6224 14.7487 16.4706 14.3822 16.4706 13.9999C16.4706 13.6177 16.6224 13.2511 16.8927 12.9809Z" fill="#111111"/> </g> </g> </g> <defs> <clipPath id="clip0_0_1"> <rect width="1440" height="900" fill="white" transform="translate(-76 -26)"/> </clipPath> </defs> </svg> <OrganizationNameContainer /> </LogoContainer> );