Make many small frontend fixes (icons update, paddings, font-sizes) (#132)

This commit is contained in:
Charles Bochet
2023-05-21 18:52:23 +02:00
committed by GitHub
parent 5adc5b833c
commit 3370499ad8
30 changed files with 178 additions and 129 deletions

View File

@ -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>

View File

@ -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>
);
}