Martin Koníček

Blog

NextJS - global font with css style module

Showcase image

I was wondering, how to set-up global font module using css style module in NextJS, here is how.

layout.tsx

import { Poppins } from 'next/font/google';

const poppins = Poppins({
  weight: ['700'],
  subsets: ['latin'],
  variable: '--poppins-font',
});

export default function RootLayout({
...
  return (
    <html lang="en">
      <body className={`myclasses ${poppins.variable}`}>
...

page.tsx

import styles from './styles.module.css'

style.module.css

.menu {
  font-family: var(--poppins-font),sans-serif;
}
  • Enabling Low-Range NodePorts Below 1024 in MicroK8s for Traefik Ingress
    Enabling Low-Range NodePorts Below 1024 in MicroK8s for Traefik IngressDiscover how to configure MicroK8s to use NodePorts below 1024, a key step for setting up efficient ingress controllers like Traefik. This guide simplifies the process, ensuring a seamless integration of lower NodePorts in your Kubernetes environment.
  • cs | en