From 8a991a3a5c9e63d8a64c2c6dfab7448b8a659e2f Mon Sep 17 00:00:00 2001
From: Max Peintner <max@caos.ch>
Date: Fri, 27 Oct 2023 14:41:19 +0200
Subject: [PATCH] fix(console): Load local font asset, remove style override,
 clockskew reactive forms (#6834)

fix: local asset, rm title override, clockskew app-detail

Co-authored-by: Livio Spring <livio.a@gmail.com>
---
 .../apps/app-detail/app-detail.component.html |   3 +-
 .../apps/app-detail/app-detail.component.scss |   4 -
 console/src/styles/lato-font.scss             | 120 +++++++++---------
 3 files changed, 61 insertions(+), 66 deletions(-)

diff --git a/console/src/app/pages/projects/apps/app-detail/app-detail.component.html b/console/src/app/pages/projects/apps/app-detail/app-detail.component.html
index f624128983..4a65860771 100644
--- a/console/src/app/pages/projects/apps/app-detail/app-detail.component.html
+++ b/console/src/app/pages/projects/apps/app-detail/app-detail.component.html
@@ -285,14 +285,13 @@
               <!-- TODO: The 'tickInterval' property no longer exists -->
               <mat-slider
                 color="primary"
-                formControlName="clockSkewSeconds"
                 class="clockskew-slider"
                 thumbLabel
                 [displayWith]="formatClockSkewLabel"
                 min="0"
                 [step]="1"
                 max="5"
-                ><input matSliderThumb />
+                ><input matSliderThumb formControlName="clockSkewSeconds" />
               </mat-slider>
               <cnsl-info-section class="full-width app-desc">
                 <span>{{ 'APP.OIDC.CLOCKSKEW' | translate }}</span>
diff --git a/console/src/app/pages/projects/apps/app-detail/app-detail.component.scss b/console/src/app/pages/projects/apps/app-detail/app-detail.component.scss
index f97a914ebd..3d410e1f5e 100644
--- a/console/src/app/pages/projects/apps/app-detail/app-detail.component.scss
+++ b/console/src/app/pages/projects/apps/app-detail/app-detail.component.scss
@@ -8,10 +8,6 @@
   $button-disabled-text-color: map-get($foreground, disabled-button);
   $divider-color: map-get($foreground, dividers);
 
-  .title {
-    margin-bottom: 1rem;
-  }
-
   .metadata-option {
     margin-top: 0.5rem;
     margin-bottom: 0.5rem;
diff --git a/console/src/styles/lato-font.scss b/console/src/styles/lato-font.scss
index d8e92641bf..85fccbeded 100644
--- a/console/src/styles/lato-font.scss
+++ b/console/src/styles/lato-font.scss
@@ -1,69 +1,69 @@
-@import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&display=swap'); // @font-face {
-//   font-family: Lato;
-//   font-style: normal;
-//   font-weight: 400;
-//   src: url(../assets/fonts/lato/Lato-Regular.ttf) format('truetype');
-// }
+@font-face {
+  font-family: Lato;
+  font-style: normal;
+  font-weight: 400;
+  src: url(../assets/fonts/lato/Lato-Regular.ttf) format('truetype');
+}
 
-// @font-face {
-//   font-family: Lato;
-//   font-style: normal;
-//   font-weight: 900;
-//   src: url(../assets/fonts/lato/Lato-Black.ttf) format('truetype');
-// }
+@font-face {
+  font-family: Lato;
+  font-style: normal;
+  font-weight: 900;
+  src: url(../assets/fonts/lato/Lato-Black.ttf) format('truetype');
+}
 
-// @font-face {
-//   font-family: Lato;
-//   font-style: italic;
-//   font-weight: 900;
-//   src: url(../assets/fonts/lato/Lato-BlackItalic.ttf) format('truetype');
-// }
+@font-face {
+  font-family: Lato;
+  font-style: italic;
+  font-weight: 900;
+  src: url(../assets/fonts/lato/Lato-BlackItalic.ttf) format('truetype');
+}
 
-// @font-face {
-//   font-family: Lato;
-//   font-style: normal;
-//   font-weight: 700;
-//   src: url(../assets/fonts/lato/Lato-Bold.ttf) format('truetype');
-// }
+@font-face {
+  font-family: Lato;
+  font-style: normal;
+  font-weight: 700;
+  src: url(../assets/fonts/lato/Lato-Bold.ttf) format('truetype');
+}
 
-// @font-face {
-//   font-family: Lato;
-//   font-style: italic;
-//   font-weight: 700;
-//   src: url(../assets/fonts/lato/Lato-BoldItalic.ttf) format('truetype');
-// }
+@font-face {
+  font-family: Lato;
+  font-style: italic;
+  font-weight: 700;
+  src: url(../assets/fonts/lato/Lato-BoldItalic.ttf) format('truetype');
+}
 
-// @font-face {
-//   font-family: Lato;
-//   font-style: italic;
-//   font-weight: 400;
-//   src: url(../assets/fonts/lato/Lato-Italic.ttf) format('truetype');
-// }
+@font-face {
+  font-family: Lato;
+  font-style: italic;
+  font-weight: 400;
+  src: url(../assets/fonts/lato/Lato-Italic.ttf) format('truetype');
+}
 
-// @font-face {
-//   font-family: Lato;
-//   font-style: normal;
-//   font-weight: 300;
-//   src: url(../assets/fonts/lato/Lato-Light.ttf) format('truetype');
-// }
+@font-face {
+  font-family: Lato;
+  font-style: normal;
+  font-weight: 300;
+  src: url(../assets/fonts/lato/Lato-Light.ttf) format('truetype');
+}
 
-// @font-face {
-//   font-family: Lato;
-//   font-style: italic;
-//   font-weight: 300;
-//   src: url(../assets/fonts/lato/Lato-LightItalic.ttf) format('truetype');
-// }
+@font-face {
+  font-family: Lato;
+  font-style: italic;
+  font-weight: 300;
+  src: url(../assets/fonts/lato/Lato-LightItalic.ttf) format('truetype');
+}
 
-// @font-face {
-//   font-family: Lato;
-//   font-style: normal;
-//   font-weight: 100;
-//   src: url(../assets/fonts/lato/Lato-Thin.ttf) format('truetype');
-// }
+@font-face {
+  font-family: Lato;
+  font-style: normal;
+  font-weight: 100;
+  src: url(../assets/fonts/lato/Lato-Thin.ttf) format('truetype');
+}
 
-// @font-face {
-//   font-family: Lato;
-//   font-style: italic;
-//   font-weight: 100;
-//   src: url(../assets/fonts/lato/Lato-ThinItalic.ttf) format('truetype');
-// }
+@font-face {
+  font-family: Lato;
+  font-style: italic;
+  font-weight: 100;
+  src: url(../assets/fonts/lato/Lato-ThinItalic.ttf) format('truetype');
+}