const { onClick } = props const AddBoardsContainer = styled.div` display: flex; flex-direction: row; justify-content: space-between; `; const AddBoardText = styled.text` color: #777583; font-family: Helvetica Neue; font-size: 16px; font-weight: 700; line-height: 150%; `; const AddBoardButton = styled.button` background-color: transparent; border: none; `; const AddBoardIcon = styled.div` color: #777583; :hover { color: #FFFFFF; } `; return ( <AddBoardsContainer> <AddBoardText>Your boards</AddBoardText> <AddBoardButton onClick={onClick} > <AddBoardIcon> <i class="bi bi-plus-circle"></i> </AddBoardIcon> </AddBoardButton> </AddBoardsContainer> );