chore: switch font from Jakarta to Inter

Author: ElenaBitire

src/ui/button.test.tsx

@@ -83,7 +83,7 @@ describe('Button component ', () => {
     const button = screen.getByTestId('button');
     // TODO: should be fixed to use haveStyle instead of comparing the class name
     const expectedStyle =
-      'font-[600] font-jakarta text-white dark:text-black text-xl';
+      'font-inter font-semibold text-white dark:text-black text-xl';
     const receivedStyle =
       button.props.children[0].props.children.props.className;
     expect(receivedStyle).toContain(expectedStyle);
@@ -93,7 +93,7 @@ describe('Button component ', () => {
     const button = screen.getByTestId('button');
 
     const expectedStyle =
-      'font-[600] font-jakarta text-secondary-600 text-base';
+      'font-inter font-semibold text-secondary-600 text-base';
     const receivedStyle =
       button.props.children[0].props.children.props.className;
     expect(receivedStyle).toContain(expectedStyle);
@@ -102,7 +102,8 @@ describe('Button component ', () => {
     render(<Button testID="button" label="Submit" disabled />);
     const button = screen.getByTestId('button');
 
-    const expectedStyle = 'font-[600] font-jakarta text-base text-neutral-600';
+    const expectedStyle =
+      'font-inter font-semibold text-base text-neutral-600 dark:text-neutral-600';
     const receivedStyle =
       button.props.children[0].props.children.props.className;
     expect(receivedStyle).toContain(expectedStyle);

src/ui/button.tsx

@@ -6,9 +6,9 @@ import { tv } from 'tailwind-variants';
 
 const button = tv({
   slots: {
-    container: 'flex flex-row items-center justify-center rounded-md my-2 px-4',
-    label: 'text-base font-[600] font-jakarta',
-    indicator: 'text-white h-6',
+    container: 'my-2 flex flex-row items-center justify-center rounded-md px-4',
+    label: 'font-inter text-base font-semibold',
+    indicator: 'h-6 text-white',
   },
 
   variants: {

src/ui/input.tsx

@@ -17,9 +17,9 @@ import { Text } from './text';
 const inputTv = tv({
   slots: {
     container: 'mb-2',
-    label: 'text-grey-100 dark:text-neutral-100 text-lg mb-1',
+    label: 'text-grey-100 mb-1 text-lg dark:text-neutral-100',
     input:
-      'mt-0 border-[0.5px] font-jakarta text-base leading-5 font-[500] px-4 py-3 rounded-xl  bg-neutral-100 border-neutral-300 dark:border-neutral-700 dark:bg-neutral-800 dark:text-white',
+      'mt-0 rounded-xl border-[0.5px] border-neutral-300 bg-neutral-100 px-4 py-3 font-inter text-base  font-medium leading-5 dark:border-neutral-700 dark:bg-neutral-800 dark:text-white',
   },
 
   variants: {

src/ui/text.tsx

@@ -21,7 +21,7 @@ export const Text = ({
   const textStyle = React.useMemo(
     () =>
       twMerge(
-        'text-base text-black  dark:text-white  font-jakarta font-normal',
+        'text-base text-black  dark:text-white  font-inter font-normal',
         className
       ),
     [className]