Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0

Custom Font only shows up when opening Design/Custom CSS. Not on live site


preinmann

Question

I've imported a custom font and it only shows, when the page is being viewed with the "Custom CSS" page open. On the live site, or with another page open in Squarespace, the h1 and h2 fonts don't display correctly. See for yourselves here: https://www.svamae.com/test

Here the CSS I've added under Custom CSS:


@font-face {
font-family: 'Airbnb Cereal App Book';
font-style: normal;
font-weight: normal;
src: local('Airbnb Cereal App Book'), url('https://static1.squarespace.com/static/5d1c5598b57288000189eb6d/t/5d8753ede7a89537827e6f0a/1569149934367/AirbnbCerealBook.woff') format('woff');
}

@font-face {
font-family: 'Airbnb Cereal App Light';
font-style: normal;
font-weight: normal;
src: local('Airbnb Cereal App Light'), url('https://static1.squarespace.com/static/5d1c5598b57288000189eb6d/t/5d8753fe1d47f936914afb20/1569149951081/AirbnbCerealLight.woff') format('woff');
}

@font-face {
font-family: 'Airbnb Cereal App Medium';
font-style: normal;
font-weight: normal;
src: local('Airbnb Cereal App Medium'), url('https://static1.squarespace.com/static/5d1c5598b57288000189eb6d/t/5d8753e21d47f936914afa03/1569149923170/AirbnbCerealMedium.woff') format('woff');
}

@font-face {
font-family: 'Airbnb Cereal App Bold';
font-style: normal;
font-weight: normal;
src: local('Airbnb Cereal App Bold'), url('https://static1.squarespace.com/static/5d1c5598b57288000189eb6d/t/5d8753ce68af88237828efed/1569149902585/AirbnbCerealBold.woff') format('woff');
}

@font-face {
font-family: 'Airbnb Cereal App Extra Bold';
font-style: normal;
font-weight: normal;
src: local('Airbnb Cereal App Extra Bold'), url('https://static1.squarespace.com/static/5d1c5598b57288000189eb6d/t/5d8753f81d47f936914afaf1/1569149944845/AirbnbCerealExtraBold.woff') format('woff');
}

@font-face {
font-family: 'Airbnb Cereal App Black';
font-style: normal;
font-weight: normal;
src: local('Airbnb Cereal App Black'), url('https://static1.squarespace.com/static/5d1c5598b57288000189eb6d/t/5d8753b414ffd35492a0c69c/1569149877286/AirbnbCerealBlack.woff') format('woff');
}

h1 {
 font-family: 'Airbnb Cereal App  Black' !important;
   font-size: 34px;
   font-weight: 700;
   letter-spacing: -0.8px;
   color: #2b2b2b;
}

h1 strong {
 font-weight: bold;
 font-family: 'Airbnb Cereal App  Light' !important;
 color: #767676; 
 line-height: 10px;
 font-weight: 100;
 font-size: 32px;
 letter-spacing: -0.8px;
 margin-bottom: 32px;
 }
h2 {
 font-family: 'Airbnb Cereal App  Light' !important;
 color: #767676;
 line-height: 40px;
 font-weight: 100;
 font-size: 34px;
 letter-spacing: -0.8px;
 margin-bottom: 32px;
}
h3 {
 font-family: 'Airbnb Cereal App light' !important;
 color: #767676; 
 line-height: 15px;
 letter-spacing: -0.5px;

}

Thanks for any input - I've ran out of ideas on how to fix this…

Edited by preinmann
Initial Revision
Link to post
  • Answers 2
  • Created
  • Last Reply

Top Posters For This Question

Top Posters For This Question

2 answers to this question

Recommended Posts

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...