fix #7781 made kanban board title and checkbox 24px (#7815)

# issue: #7781 

- [x] titlechip to 24px
- [x] checkbox to 24px
![Screenshot 2024-10-18
134759](https://github.com/user-attachments/assets/e9d347e3-41b8-4b0d-a072-d139ed982971)
![Screenshot 2024-10-18
134708](https://github.com/user-attachments/assets/8b83f6dd-96ac-4a4e-b6ae-85d3e2923fb9)

packages/twenty-front/src/modules/ui/input/components/Checkbox.tsx

@@ -52,7 +52,10 @@ const StyledInputContainer = styled.div<InputProps>`
 
   cursor: ${({ disabled }) => (disabled ? 'not-allowed' : 'pointer')};
   display: flex;
-  padding: ${({ theme }) => theme.spacing(1)};
+  padding: ${({ theme, checkboxSize }) =>
+    checkboxSize === CheckboxSize.Large
+      ? theme.spacing(1.5)
+      : theme.spacing(1.25)};
   position: relative;
   ${({ hoverable, isChecked, theme, indeterminate, disabled }) => {
     if (!hoverable || disabled === true) return '';
@@ -126,10 +129,9 @@ const StyledInput = styled.input<InputProps>`
   }
 
   & + label > svg {
-    --padding: ${({ checkboxSize }) =>
-      checkboxSize === CheckboxSize.Large ? '2px' : '1px'};
+    --padding: 0px;
     --size: ${({ checkboxSize }) =>
-      checkboxSize === CheckboxSize.Large ? '16px' : '12px'};
+      checkboxSize === CheckboxSize.Large ? '20px' : '14px'};
     height: var(--size);
     left: var(--padding);
     position: absolute;

packages/twenty-ui/src/display/chip/components/Chip.tsx

@@ -66,7 +66,7 @@ const StyledContainer = withTheme(styled.div<
   display: inline-flex;
   justify-content: center;
   gap: ${({ theme }) => theme.spacing(1)};
-  height: ${({ theme }) => theme.spacing(3)};
+  height: ${({ theme }) => theme.spacing(4)};
   max-width: ${({ maxWidth }) =>
     maxWidth
       ? `calc(${maxWidth}px - 2 * var(--chip-horizontal-padding))`