I have currently downloaded this repository:
https://github.com/adrianhajdin/portfolio_website
from this tutorial:
https://www.youtube.com/watch?v=OPaLnMw2i_0&list=LL&index=3&ab_channel=JavaScriptMastery
It is a Next Js project using react that is customizable, I am however having issues with importing my own custom fonts as it does not seem to support regular CSS.
The only options that I see for changing the fonts are in these settings here:
I cannot seem to import a custom font family locally using CSS. If I try to add a style.css in the same repository and reference my font family in the module export nothing happens.
Does anyone know how to resolve this?
which ever file you are using as global.css or index.css first import it like this in that file
@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600&display=swap');
@tailwind base;
@tailwind components;
@tailwind utilities;
// rest of your css if have
then goto `tailwind.config.js and use it like this:
module.exports = {
content: ['./pages/**/*.{js,ts,jsx,tsx}', './components/**/*.{js,ts,jsx,tsx}'],
theme: {
extend: {
fontFamily: {
sans: ['Poppins', 'sans-serif'],
body: ['Poppins', 'sans-serif'],
},
},
},
plugins: [],
};