Use woff2 versions of fonts

themes/default/public/css/lufi.css

@@ -33,31 +33,31 @@
 
 @font-face {
   font-family: "Roboto";
-  src: url("../font/roboto/Roboto-Thin.ttf") format("truetype");
+  src: url("../font/roboto/Roboto-Thin.woff2") format("woff2");
   font-weight: 200;
 }
 
 @font-face {
   font-family: "Roboto";
-  src: url("../font/roboto/Roboto-Light.ttf") format("truetype");
+  src: url("../font/roboto/Roboto-Light.woff2") format("woff2");
   font-weight: 300;
 }
 
 @font-face {
   font-family: "Roboto";
-  src: url("../font/roboto/Roboto-Regular.ttf") format("truetype");
+  src: url("../font/roboto/Roboto-Regular.woff2") format("woff2");
   font-weight: 400;
 }
 
 @font-face {
   font-family: "Roboto";
-  src: url("../font/roboto/Roboto-Medium.ttf") format("truetype");
+  src: url("../font/roboto/Roboto-Medium.woff2") format("woff2");
   font-weight: 500;
 }
 
 @font-face {
   font-family: "Roboto";
-  src: url("../font/roboto/Roboto-Bold.ttf") format("truetype");
+  src: url("../font/roboto/Roboto-Bold.woff2") format("woff2");
   font-weight: 700;
 }
 
@@ -178,6 +178,14 @@ a.button {
   background: var(--icon-color);
 }
 
+.icon.hide-source {
+  width: 2rem;
+  height: 2rem;
+  mask: url("../icon/hide-source.svg");
+  mask-repeat: no-repeat;
+  background: var(--icon-color);
+}
+
 .icon.mail {
   width: 2rem;
   height: 2rem;