Skip to main content
13-Aquamarine
July 18, 2023
Question

Typography style in View app-doesn't work

  • July 18, 2023
  • 1 reply
  • 977 views

Hello PTC Community,

Please, advise how I can fix the CSS typography appearance in the View app.

My problem is that the CSS Typography style (either from "resources/... " or Google link) does not appear on the View app.

 

 

 

 

 

1 reply

18-Opal
July 25, 2023

It's hard to see where things are going wrong for you without seeing your actual configuration. But here's what works for me:

 

1) Upload the font files to the project. I'm using OpenType fonts, and they seem to work fine.

ClayHelberg_0-1690320718258.png

 

2) Add @font-face specifications to the top of your Application CSS file. These can be a little tricky, make sure to get the parameters right, especially the src property and all its components:

@font-face {font-family: 'Montserrat'; font-style: normal; font-weight: 400; src: local('Montserrat Regular'), local('Montserrat-Regular'), url(#{$resources}/Uploaded/Montserrat-Regular.otf) format('opentype');}
@font-face {font-family: 'Montserrat'; font-style: normal; font-weight: 500; src: local('Montserrat Medium'), local('Montserrat-Medium'), url(#{$resources}/Uploaded/Montserrat-Medium.otf) format('opentype');}
@font-face {font-family: 'Montserrat'; font-style: normal; font-weight: 700; src: local('Montserrat Bold'), local('Montserrat-Bold'), url(#{$resources}/Uploaded/Montserrat-Bold.otf) format('opentype');}

3) Reference the font files in your style classes as needed

.eacfont { font-family: Montserrat, "Courier New", serif; }

The font shows up as expected in View:

ClayHelberg_1-1690321058864.png