Merge pull request #4238 from tulibraries/BL-1843-several-fonts-are-l…

…oaded-with-settings-that-hide-text-while-they-are-loading Bl-1843 several fonts are loaded with settings that hide text while they are loading
tulibraries · Feb 21, 2024 · f121ba6 · f121ba6
2 parents 8fdcbbc + 93fa680
commit f121ba6
Show file tree

Hide file tree

Showing 4 changed files with 10 additions and 3 deletions.
diff --git a/app/assets/stylesheets/application.scss b/app/assets/stylesheets/application.scss
@@ -26,6 +26,3 @@
 @import "partials/*";
 @import "tucob";
 @import "icons";
-
-@import url("https://fonts.googleapis.com/css?family=PT+Sans");
-@import url('https://fonts.googleapis.com/css2?family=PT+Sans:wght@700&display=swap');
diff --git a/app/assets/stylesheets/icons.css.erb b/app/assets/stylesheets/icons.css.erb
@@ -3,13 +3,15 @@ button.collapse-button .avail-label:after, button#filter-mobile:after {
   font-family: "Font Awesome 5 Free";
   font-weight: 900;
   padding-left: 0.625rem;
+  font-display: swap;
 }
 
 button.collapse-button.collapsed .avail-label:after, button#filter-mobile.collapsed:after {
   content:"\f054";
   font-family: "Font Awesome 5 Free";
   font-weight: 900;
   padding-left: 0.625rem;
+  font-display: swap;
 }
 
 .lib-guides-recommender-bento [data-toggle="collapse"] i:before{
@@ -30,6 +32,7 @@ a.asrs-request:after {
   font-weight: 900;
   float: right;
   padding-right: 0.625rem;
+  font-display: swap;
 }
 
 a.booking-request[aria-expanded="true"]::after,

diff --git a/app/assets/stylesheets/partials/_facets.scss b/app/assets/stylesheets/partials/_facets.scss
@@ -187,6 +187,7 @@ span.constraint-value {
     float: right;
 		padding-top: 0.625rem;
     transform: rotate(90deg);
+    font-display: swap;
   }
 
   &.collapsed {

diff --git a/app/assets/stylesheets/partials/_typography.scss b/app/assets/stylesheets/partials/_typography.scss
@@ -9,11 +9,13 @@
 @font-face {
   font-family: Faustina-Bold;
   src: font-url('Faustina-SemiBold.ttf') format('truetype');
+  font-display: swap;
 }
 
 @font-face {
   font-family: 'Roboto';
   src: font-url('Roboto-Regular.ttf') format('truetype');
+  font-display: swap;
 }
 
 @font-face {
@@ -25,17 +27,21 @@
 @font-face {
   font-family: 'Roboto Light';
   src: font-url('Roboto-Light.ttf') format('truetype');
+  font-display: swap;
 }
 
 @font-face {
   font-family: 'Roboto Bold';
   src: font-url('Roboto-Bold.ttf') format('truetype');
+  font-display: swap;
 }
 
 .roboto {
   font-family: Roboto Condensed;
+  font-display: swap;
 }
 
 .faustina {
   font-family: Faustina;
+  font-display: swap;
 }