Use woff2 format for RobotFlex font

Fixes clagnut#3 What a ride! I initially attempt a conversion to woff2 with https://www.fontsquirrel.com/tools/webfont-generator from the original ttf https://github.com/googlefonts/roboto-flex/tree/main/fonts My issue with that option: it was not keeping relevant axis and there are so many of them anyway by default (13! see https://wakamaifondue.com/ for details) so I tried to slice the font prior to that with https://slice-gui.netlify.app/ which did the job but I eventually found the related bug on the Roboto repository googlefonts/roboto-flex#367 and I end up forging that URL: https://fonts.googleapis.com/css2?family=Roboto+Flex:opsz,wght,[email protected],100..1000,-200..150&display=swap Which contains the 3 pertinent grades for our case, then select the URL from the /* latin */ part : https://fonts.gstatic.com/s/robotoflex/v26/NaNeepOXO_NexZs0b5QrzlOHb8wXqDGRY6mZsaJ8__OGfttPZktqc2VdZ80KvCLZaPcSBZtOx2MifRuWR28sPJtUMbsFEK6cRrleUx9Xgbm3WLHa_F4Ep4Fm0PN19Ik5Dntczx0wZGzhPlL1YNMYKbv9_1IQXOw7AiUJVXRrV8cWW4O8LJCoXjCnwSRSaLshNP1d9-EmF8tqHbE.woff2 And there we are :)
davidbgk · Oct 18, 2024 · a93c73e · a93c73e
1 parent e693d52
commit a93c73e
Show file tree

Hide file tree

Showing 3 changed files with 2 additions and 2 deletions.
diff --git a/RobotoFlex.ttf b/RobotoFlex.ttf
diff --git a/RobotoFlex.woff2 b/RobotoFlex.woff2
diff --git a/tods.html b/tods.html
@@ -56,7 +56,7 @@
 
 @font-face {
     font-family: "RobotoFlex";
-    src: url("RobotoFlex.ttf");
+    src: url("RobotoFlex.woff2") format('woff2');
     font-weight: 1 1000;
     font-stretch: 50% 200%;
     font-style: normal;
@@ -338,4 +338,4 @@ <h2>Heading</h2>
 </script>
 
 </body>
-</html>
+</html>