mirror of
https://github.com/hazemKrimi/crimson-quirks-ui.git
synced 2026-05-02 02:30:29 +00:00
Hazem Krimi
42 lines
938 B
TypeScript
42 lines
938 B
TypeScript
import styled, { css } from 'styled-components';
|
|
|
|
type WrapperProps = {
|
|
color?: 'client' | 'productOwner' | 'developer' | 'admin' | string;
|
|
size?: 'small' | 'big';
|
|
};
|
|
|
|
export const Wrapper = styled.div<WrapperProps>`
|
|
user-select: none;
|
|
border-radius: 50%;
|
|
background: ${({ theme, color }) =>
|
|
color ? theme.colors[color].main : theme.colors.client.main};
|
|
color: ${({ theme }) => theme.colors.white.main};
|
|
display: inline-grid;
|
|
justify-content: center;
|
|
align-items: center;
|
|
font-weight: bold;
|
|
|
|
${({ size }) => {
|
|
switch (size) {
|
|
case 'small':
|
|
return css`
|
|
width: 25px;
|
|
height: 25px;
|
|
font-size: 12px;
|
|
`;
|
|
case 'big':
|
|
return css`
|
|
width: 50px;
|
|
height: 50px;
|
|
font-size: 24px;
|
|
`;
|
|
default:
|
|
return css`
|
|
width: 25px;
|
|
height: 25px;
|
|
font-size: 12px;
|
|
`;
|
|
}
|
|
}}
|
|
`;
|