Solo theme: Custom font not working

Themes
1

Hi everyone

I’ve made quite a few changes to the Solo theme to customise my website and it’s looking great, but one thing I don’t seem to be able to work out is how to change the font.

I’ve downloaded the font from Google Fonts, and put the font files in the same folder as the default theme fonts.
I’ve edited /assets/css/fonts.css thusly:

@font-face {
    font-family: Titillium;
    src: local(""), url("../fonts/Titillium-Regular.woff2") format("woff2");
    font-weight: normal;
    font-style: normal;
}

And inserted the reference to Titillium in screens.css:

:root {
    --font-sans: Manrope, -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif;
    --font-serif: Titillium, serif;
    --font-mono: JetBrains Mono, Menlo, Consolas, Monaco, Liberation Mono, Lucida Console, monospace;

Despite removing Libre Baskerville from this list, it’s still the font that appears when I select “elegant serif” in the theme menu.

I have rebuilt the theme using
sudo npm run zip

and uploaded the file as a new theme to Ghost, as well as restarting nginx and ghost.

Is there something I’m missing?

Thanks in advance

2

I was going to tell you you needed to compile your css, but it sounds like you did.

If you open the compiled css file from the server, is the change there? I’m guessing either an error in the build step or you’re getting a stale version from cache