Add styled component rule (#1261)

* Add StyledComponent rule

* update doc

* update doc

* update doc
This commit is contained in:
Weiko
2023-08-17 20:58:02 -07:00
committed by GitHub
parent 390e70a196
commit 9b34a0ff3d
70 changed files with 433 additions and 354 deletions

View File

@ -14,7 +14,7 @@ const StyledContainer = styled.div`
padding: ${({ theme }) => theme.spacing(3)};
`;
const Content = styled.div`
const StyledContent = styled.div`
display: flex;
flex: 1;
flex-direction: column;
@ -22,11 +22,11 @@ const Content = styled.div`
margin-left: ${({ theme }) => theme.spacing(3)};
`;
const NameText = styled.span`
const StyledNameText = styled.span`
color: ${({ theme }) => theme.font.color.primary};
`;
const EmailText = styled.span`
const StyledEmailText = styled.span`
color: ${({ theme }) => theme.font.color.tertiary};
`;
@ -50,10 +50,10 @@ export function WorkspaceMemberCard({ workspaceMember, accessory }: OwnProps) {
type="squared"
size="xl"
/>
<Content>
<NameText>{workspaceMember.user.displayName}</NameText>
<EmailText>{workspaceMember.user.email}</EmailText>
</Content>
<StyledContent>
<StyledNameText>{workspaceMember.user.displayName}</StyledNameText>
<StyledEmailText>{workspaceMember.user.email}</StyledEmailText>
</StyledContent>
{accessory}
</StyledContainer>