Custom Font not showing up on larger or smaller (mobile screens) only desktop

lawshop1fy
New Member
1 0 0

Hello!

I'm using the Cascade theme, and a custom font called Hobo (terrible name for a font, but what can you do) for the heading and accent. It's showing up on certain screens but not on mobile and also potentially larger screens like an iMac. I'm not very familiar with Cascade so any help would be appreciated!

site is https://idlehour.myshopify.com/

<style>
{{ main_font | font_face: font_display: 'swap' }}
{{ heading_font | @font-face {
font-family: ‘HoboStd’;
src: url('{{ ‘HoboStd.woff’ | asset_url }}') format('woff');
font-weight: normal;
font-style: normal;
}}
{{ accent_font | @font-face {
font-family: ‘HoboStd’;
src: url('{{ ‘HoboStd.woff’ | asset_url }}') format('woff');
font-weight: normal;
font-style: normal;
}}

{%- assign main_font_bolder = main_font | font_modify: 'weight', 'bolder' -%}
{%- assign main_font_italic = main_font | font_modify: 'style', 'italic' -%}
{%- assign main_font_bold_italic = main_font_bold | font_modify: 'style', 'italic' -%}
{% if main_font_bold %}
{{ main_font_bold | font_face: font_display: 'swap' }}
{% endif %}
{% if main_font_italic %}
{{ main_font_italic | font_face: font_display: 'swap' }}
{% endif %}
{% if main_font_bold_italic %}
{{ main_font_bold_italic | font_face: font_display: 'swap' }}
{% endif %}
{% if main_font_bolder %}
{{ main_font_bolder | font_face: font_display: 'swap' }}
{% endif %}
</style>

Lee Anna

0 Likes