Fix wrong font in chips and tabs (#10825)

Fix wrong font in chips and tabs

---------

Co-authored-by: Félix Malfait <felix@twenty.com>

packages/twenty-chrome-extension/src/options/modules/ui/input/components/TextInput.tsx

@@ -42,7 +42,6 @@ const StyledInput = styled.input`
   flex: 1;
   border: none;
   outline: none;
-  font-family: Arial, sans-serif;
   font-size: 14px;
 
   &::placeholder {

packages/twenty-front/src/modules/command-menu/components/CommandMenuContextChip.tsx

@@ -7,6 +7,7 @@ const StyledChip = styled.button<{
   withText: boolean;
   onClick?: () => void;
 }>`
+  all: unset;
   align-items: center;
   justify-content: center;
   background: ${({ theme }) => theme.background.transparent.light};
@@ -19,6 +20,7 @@ const StyledChip = styled.button<{
   /* If the chip has text, we add extra padding to have a more balanced design */
   padding: 0
     ${({ theme, withText }) => (withText ? theme.spacing(2) : theme.spacing(1))};
+  font-family: inherit;
   font-size: ${({ theme }) => theme.font.size.sm};
   font-weight: ${({ theme }) => theme.font.weight.medium};
   line-height: ${({ theme }) => theme.text.lineHeight.lg};

packages/twenty-front/src/modules/ui/layout/tab/components/Tab.tsx

@@ -22,6 +22,7 @@ type TabProps = {
 const StyledTab = styled('button', {
   shouldForwardProp: (prop) => isPropValid(prop) && prop !== 'active',
 })<{ active?: boolean; disabled?: boolean; to?: string }>`
+  all: unset;
   align-items: center;
   border-bottom: 1px solid ${({ theme }) => theme.border.color.light};
   border-color: ${({ theme, active }) =>
@@ -37,6 +38,7 @@ const StyledTab = styled('button', {
   border-left: none;
   border-right: none;
   border-top: none;
+  font-family: inherit;
 
   display: flex;
   gap: ${({ theme }) => theme.spacing(1)};