Make many small frontend fixes (icons update, paddings, font-sizes) (#132)
This commit is contained in:
@ -1,6 +1,6 @@
|
||||
import styled from '@emotion/styled';
|
||||
import ActionBarButton from './ActionBarButton';
|
||||
import { FaTrash } from 'react-icons/fa';
|
||||
import { TbTrash } from 'react-icons/tb';
|
||||
|
||||
type OwnProps = {
|
||||
onDeleteClick: () => void;
|
||||
@ -29,7 +29,7 @@ function ActionBar({ onDeleteClick }: OwnProps) {
|
||||
<StyledContainer>
|
||||
<ActionBarButton
|
||||
label="Delete"
|
||||
icon={<FaTrash />}
|
||||
icon={<TbTrash size={16} />}
|
||||
onClick={onDeleteClick}
|
||||
/>
|
||||
</StyledContainer>
|
||||
|
||||
@ -10,6 +10,7 @@ type OwnProps = {
|
||||
const StyledButton = styled.div`
|
||||
display: flex;
|
||||
cursor: pointer;
|
||||
user-select: none;
|
||||
|
||||
justify-content: center;
|
||||
|
||||
@ -21,15 +22,16 @@ const StyledButton = styled.div`
|
||||
}
|
||||
`;
|
||||
|
||||
const StyledButtonabel = styled.div`
|
||||
const StyledButtonLabel = styled.div`
|
||||
margin-left: ${(props) => props.theme.spacing(2)};
|
||||
font-weight: 500;
|
||||
`;
|
||||
|
||||
function ActionBarButton({ label, icon, onClick }: OwnProps) {
|
||||
return (
|
||||
<StyledButton onClick={onClick}>
|
||||
{icon}
|
||||
<StyledButtonabel>{label}</StyledButtonabel>
|
||||
<StyledButtonLabel>{label}</StyledButtonLabel>
|
||||
</StyledButton>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user