Manage OFN's font through the asset pipeline #5644
Conversation
sauloperez
force-pushed
the
manage-font-with-asset-pipeline
branch
from
b3c7abe
to
2e4a8a5
Compare
| src: font-url('OFN-v2.eot'); | ||
| src: font-url('OFN-v2.eot') format('embedded-opentype'), | ||
| font-url('OFN-v2.woff') format('woff'), | ||
| font-url('OFN-v2.ttf') format('truetype'), |
There was a problem hiding this comment.
I notice the previous versions have suffixes added, but you've removed them. Are they not needed? Eg:
'/OFN-v2.eot?#iefixeslsji' is now: 'OFN-v2.eot'
There was a problem hiding this comment.
I strongly believe that was the pre-asset-pipeline poor-man's asset versioning. That's what the fringerprint came to solve way better. Unless iefixes refers to IE? Googling yielded no results though.
There was a problem hiding this comment.
I think it might be fixes for IE, yes. I have a feeling the multiple file formats are there because they can't all be rendered in all browsers... Maybe we could have a look using Browserstack?
There was a problem hiding this comment.
👍 I added it in the test instructions
| @@ -13,7 +13,7 @@ | |||
| - else | |||
| = favicon_link_tag "/favicon-staging.ico" | |||
| %link{href: "https://fonts.googleapis.com/css?family=Roboto:400,300italic,400italic,300,700,700italic|Oswald:300,400,700", rel: "stylesheet", type: "text/css"} | |||
| %link{href: "/OFN-v2.woff?eslsji", rel: "preload", as: "font", crossorigin: "anonymous"} | |||
| %link{href: font_path("OFN-v2.woff"), rel: "preload", as: "font", crossorigin: "anonymous"} | |||
There was a problem hiding this comment.
Bonus points for keeping the font-preloading suggested by PageSpeed Insights
💯
|
Let's see what testing says. |
sauloperez
force-pushed
the
manage-font-with-asset-pipeline
branch
from
2e4a8a5
to
0c93de8
Compare
filipefurtad0
added
pr-staged-au
|
Hey @sauloperez , I checked the homepage, where some of these fonts appear. It looks good on my system (Ubuntu Firefox/Chrome), mobile (android/iPhone), and in Windows 10 IE/Edge: Browserstack - Windows 10 - IE 11: Browserstack - Windows 10 - Edge 83: Good to go! |
What? Why?
Related to #5643
This file contains the various icons we use in the UI, such as all the icons shown in the dropdowns in the front-office.
Moves this file to the assets folder (away from public/) and references its fingerprinted version.
What should we test?
All the icons should be shown as usual. You can look them up by
ofn-i_in the HTML. It's used as theclassattribute.This needs to be checked across browsers in Browsterstack, mainly the latest version of IE and Edge.
Release notes
Reference OFN's custom font using its fingerprinted path
Changelog Category: Changed