Merge pull request #46 from MGarcia93/addFontInter

Add font inter
Afordin · Jul 13, 2023 · 0b744a3 · 0b744a3
2 parents 9b5b536 + 1439235
commit 0b744a3
Show file tree

Hide file tree

Showing 4 changed files with 61 additions and 42 deletions.
diff --git a/public/global.css b/public/global.css
@@ -2,23 +2,60 @@
 @tailwind base;
 @tailwind components;
 @tailwind utilities;
-@layer base {
-    @font-face {
-        font-family: Messapia;
-        font-weight: 400;
-        src: url(fonts\messapia\Messapia-Regular.otf) format('otf');
-    }
-    @font-face {
-        font-family: Messapia;
-        font-weight: 700;
-        src: url(fonts\messapia\Messapia-Bold.otf) format('otf');
-    }
-    @font-face {
-        font-family: 'Inter';
-        font-weight: 500;
-        src: url(fonts/Inter/Inter-Regular.otf) format('otf');
-    }
+
+@font-face {
+    font-family: Messapia;
+    font-weight: 400;
+    src: url('public/fonts/messapia/Messapia-Regular.otf') format('opentype');
+}
+@font-face {
+    font-family: Messapia;
+    font-weight: 700;
+    src: url('public/fonts/messapia/Messapia-Bold.otf') format('opentype');
+}
+@font-face {
+    font-family: 'Inter';
+    font-weight: 300;
+    src: url('public/fonts/Inter/Inter-Light.otf') format('opentype');
+    font-style: normal;
+    font-display: swap;
+}
+@font-face {
+    font-family: 'Inter';
+    font-weight: 400;
+    src: url('fonts/Inter/Inter-Regular.otf') format('opentype');
+    font-style: normal;
+    font-display: swap;
+}
+@font-face {
+    font-family: 'Inter';
+    font-weight: 500;
+    src: url('public/fonts/Inter/Inter-Medium.ttf') format('truetype');
+    font-style: normal;
+    font-display: swap;
+}
+@font-face {
+    font-family: 'Inter';
+    font-weight: 600;
+    src: url('public/fonts/Inter/Inter-SemiBold.ttf') format('truetype');
+    font-style: normal;
+    font-display: swap;
+}
+@font-face {
+    font-family: 'Inter';
+    font-weight: 700;
+    src: url('public/fonts/Inter/Inter-Bold.ttf') format('truetype');
+    font-style: normal;
+    font-display: swap;
+}
+@font-face {
+    font-family: 'Inter';
+    font-weight: 800;
+    src: url('public/fonts/Inter/Inter-Black.ttf') format('truetype');
+    font-style: normal;
+    font-display: swap;
 }
+
 @layer utilities {
     .color-gradient {
         @apply from-[#FEAC5E] via-[#C779D0] to-[#4BC0C8];

diff --git a/src/components/ScheduleItem.tsx b/src/components/ScheduleItem.tsx
@@ -4,13 +4,13 @@ import { getLocalTime } from '../utils/getLocalTime'
 interface Props {
     item: typeItem
 }
-export default function ScheduleItem ({
+export default function ScheduleItem({
     item: { date, name, speaker, type },
 }: Props) {
     const { time } = useMemo(() => getLocalTime(date), [date])
     return (
-        <article>
-            <h3 className='flex flex-col md:flex-row font-bold gap-4 items-center  text-2xl leading-8 mb-2'>
+        <article className="font-Inter">
+            <h3 className="flex flex-col md:flex-row font-bold gap-4 items-center  text-2xl leading-8 mb-2">
                 <span
                     className={`md:max-w-[80%] ${
                         type === 'presentation'
@@ -21,12 +21,12 @@ export default function ScheduleItem ({
                     {name}
                 </span>
 
-                <span className='text-[#ffddaf] md:border-l-4 md:pl-4 md:border-gray-500'>
+                <span className="text-[#ffddaf] md:border-l-4 md:pl-4 md:border-gray-500">
                     {time}hs
                 </span>
             </h3>
             {type === 'presentation' && (
-                <p className='text-gray-500 font-semibold'>{speaker}</p>
+                <p className="text-gray-500 font-semibold">{speaker}</p>
             )}
         </article>
     )

diff --git a/src/pages/index.astro b/src/pages/index.astro
@@ -47,7 +47,7 @@ const ogTitle =
 	</title>
 
 	<body
-		class="bg-[url('/bg_section.webp')] bg-fixed bg-cover bg-center container m-auto font-Inter"
+		class="bg-[url('/bg_section.webp')] bg-fixed bg-cover bg-center container m-auto"
 	>
 		<Header />
 		<main>

diff --git a/tailwind.config.cjs b/tailwind.config.cjs
@@ -6,27 +6,9 @@ module.exports = {
         extend: {
             fontFamily: {
                 sans: ['Messapia', 'Helvetica'],
+                Inter: ['Inter', 'sans-serif'],
             },
         },
     },
-    plugins: [
-        plugin(function ({ addBase }) {
-            addBase({
-                '@font-face': {
-                    fontFamily: 'Messapia',
-                    fontWheight: '400',
-                    src: 'url(/fonts/messapia/Messapia-Regular.otf)',
-                },
-            })
-        }),
-        plugin(function ({ addBase }) {
-            addBase({
-                '@font-face': {
-                    fontFamily: 'Messapia',
-                    fontWheight: '700',
-                    src: "url(/fonts/messapia/Messapia-Bold.otf) format('otf')",
-                },
-            })
-        }),
-    ],
+    plugins: [],
 }