'I want to have different fonts for each language. (SCSS)

I want to have different fonts for each language.

But this doesn't work.(hugo 0.90.2)

What's wrong?

@font-face {
  font-family: 'Noto Sans KR';
  @import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@300;400;500;700;900&display=swap');
  unicode-range: U+AC00-D7A3, U+0030-0039;
}
@font-face {
  font-family: 'Poppins';
  @import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;700&display=swap');
  unicode-range: U+0041-005A, U+0061-007A;
}

:root {
  --font-family-heading: 'Poppins', 'Noto Sans KR', sans-serif;
  --font-family-paragraph: Helvetica, 'Noto Sans KR', sans-serif;
  --font-family-mono: monospace, 'Noto Sans KR';
  --base-color: #ffffff;
  --base-offset-color: #eaeaea;
  --highlight-color: #7b16ff;
  --heading-color: #1c1b1d;
  --text-color: #4e5157;
}

my site https://ravenearth.com

csssassfontshugo


Solution 1:[1]

Use the :lang selector for this. An example of this could be:

/* Selects any <p> in English (en) */
p:lang(en) {

}

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Najme

Related Questions