From 2e4fe651276862fd72f2b1697347764b4006f082 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?J=C3=B6rn-Michael=20Miehe?=
 <40151420+ldericher@users.noreply.github.com>
Date: Mon, 12 Sep 2022 11:07:24 +0000
Subject: [PATCH] add separate CSS for fonts

---
 ui/src/App.vue          | 112 +++-------------------------------------
 ui/src/assets/fonts.css |  71 +++++++++++++++++++++++++
 2 files changed, 77 insertions(+), 106 deletions(-)
 create mode 100644 ui/src/assets/fonts.css

diff --git a/ui/src/App.vue b/ui/src/App.vue
index 9b71466..c9a6e0a 100644
--- a/ui/src/App.vue
+++ b/ui/src/App.vue
@@ -25,126 +25,26 @@ export default class App extends Vue {
 }
 </script>
 
-<style>
-@font-face {
-  font-family: "Lubalin Graph";
-  src: url("//db.onlinewebfonts.com/t/60eaf3171fce0c04eb9b3e08bba9bf05.eot");
-  src: url("//db.onlinewebfonts.com/t/60eaf3171fce0c04eb9b3e08bba9bf05.eot?#iefix")
-      format("embedded-opentype"),
-    url("//db.onlinewebfonts.com/t/60eaf3171fce0c04eb9b3e08bba9bf05.woff2")
-      format("woff2"),
-    url("//db.onlinewebfonts.com/t/60eaf3171fce0c04eb9b3e08bba9bf05.woff")
-      format("woff"),
-    url("//db.onlinewebfonts.com/t/60eaf3171fce0c04eb9b3e08bba9bf05.ttf")
-      format("truetype"),
-    url("//db.onlinewebfonts.com/t/60eaf3171fce0c04eb9b3e08bba9bf05.svg#Lubalin BQ")
-      format("svg");
-  font-weight: bold;
-  font-style: normal;
-}
+<style lang="scss">
+@import "@/assets/fonts.css";
 
-@font-face {
-  font-family: "Lubalin Graph";
-  src: url("//db.onlinewebfonts.com/t/ad42b6e73cbf720f172faa6355b69ec8.eot");
-  src: url("//db.onlinewebfonts.com/t/ad42b6e73cbf720f172faa6355b69ec8.eot?#iefix")
-      format("embedded-opentype"),
-    url("//db.onlinewebfonts.com/t/ad42b6e73cbf720f172faa6355b69ec8.woff2")
-      format("woff2"),
-    url("//db.onlinewebfonts.com/t/ad42b6e73cbf720f172faa6355b69ec8.woff")
-      format("woff"),
-    url("//db.onlinewebfonts.com/t/ad42b6e73cbf720f172faa6355b69ec8.ttf")
-      format("truetype"),
-    url("//db.onlinewebfonts.com/t/ad42b6e73cbf720f172faa6355b69ec8.svg#LubalinGraph-Book")
-      format("svg");
-  font-weight: normal;
-  font-style: normal;
-}
-
-@font-face {
-  font-family: "Neue Praxis";
-  src: url("//db.onlinewebfonts.com/t/95d43d14f7d8f0f4692f507c86a29e25.eot");
-  src: url("//db.onlinewebfonts.com/t/95d43d14f7d8f0f4692f507c86a29e25.eot?#iefix")
-      format("embedded-opentype"),
-    url("//db.onlinewebfonts.com/t/95d43d14f7d8f0f4692f507c86a29e25.woff2")
-      format("woff2"),
-    url("//db.onlinewebfonts.com/t/95d43d14f7d8f0f4692f507c86a29e25.woff")
-      format("woff"),
-    url("//db.onlinewebfonts.com/t/95d43d14f7d8f0f4692f507c86a29e25.ttf")
-      format("truetype"),
-    url("//db.onlinewebfonts.com/t/95d43d14f7d8f0f4692f507c86a29e25.svg#PraxisEF")
-      format("svg");
-  font-weight: bold;
-  font-style: normal;
-}
-
-@font-face {
-  font-family: "Neue Praxis";
-  src: url("//db.onlinewebfonts.com/t/3d62d4fffdd20ba4608e1b29e0f6fb42.eot");
-  src: url("//db.onlinewebfonts.com/t/3d62d4fffdd20ba4608e1b29e0f6fb42.eot?#iefix")
-      format("embedded-opentype"),
-    url("//db.onlinewebfonts.com/t/3d62d4fffdd20ba4608e1b29e0f6fb42.woff2")
-      format("woff2"),
-    url("//db.onlinewebfonts.com/t/3d62d4fffdd20ba4608e1b29e0f6fb42.woff")
-      format("woff"),
-    url("//db.onlinewebfonts.com/t/3d62d4fffdd20ba4608e1b29e0f6fb42.ttf")
-      format("truetype"),
-    url("//db.onlinewebfonts.com/t/3d62d4fffdd20ba4608e1b29e0f6fb42.svg#PraxisEF")
-      format("svg");
-  font-weight: normal;
-  font-style: normal;
-}
-
-@font-face {
-  font-family: "Neue Demos";
-  src: url("//db.onlinewebfonts.com/t/57c19d4b8c4d1632fc97994508a35f5d.eot");
-  src: url("//db.onlinewebfonts.com/t/57c19d4b8c4d1632fc97994508a35f5d.eot?#iefix")
-      format("embedded-opentype"),
-    url("//db.onlinewebfonts.com/t/57c19d4b8c4d1632fc97994508a35f5d.woff2")
-      format("woff2"),
-    url("//db.onlinewebfonts.com/t/57c19d4b8c4d1632fc97994508a35f5d.woff")
-      format("woff"),
-    url("//db.onlinewebfonts.com/t/57c19d4b8c4d1632fc97994508a35f5d.ttf")
-      format("truetype"),
-    url("//db.onlinewebfonts.com/t/57c19d4b8c4d1632fc97994508a35f5d.svg#DemosEF")
-      format("svg");
-  font-weight: normal;
-  font-style: normal;
-}
-
-@font-face {
-  font-family: "Neue Demos";
-  src: url("//db.onlinewebfonts.com/t/ad75fa70682671bbf5a5cec5f6df1470.eot");
-  src: url("//db.onlinewebfonts.com/t/ad75fa70682671bbf5a5cec5f6df1470.eot?#iefix")
-      format("embedded-opentype"),
-    url("//db.onlinewebfonts.com/t/ad75fa70682671bbf5a5cec5f6df1470.woff2")
-      format("woff2"),
-    url("//db.onlinewebfonts.com/t/ad75fa70682671bbf5a5cec5f6df1470.woff")
-      format("woff"),
-    url("//db.onlinewebfonts.com/t/ad75fa70682671bbf5a5cec5f6df1470.ttf")
-      format("truetype"),
-    url("//db.onlinewebfonts.com/t/ad75fa70682671bbf5a5cec5f6df1470.svg#DemosEF")
-      format("svg");
-  font-weight: normal;
-  font-style: italic;
-}
-
-/* THW Logo font */
+// THW Logo font
 .thw-logo-font {
   font-family: "Lubalin Graph", serif !important;
   font-weight: bold !important;
 }
 
-/* THW Heading font */
+// THW Heading font
 .thw-heading-font {
   font-family: "Neue Praxis", "Roboto", sans-serif !important;
 }
 
-/* THW Text font */
+// THW Text font
 .thw-text-font {
   font-family: "Neue Demos", serif !important;
 }
 
-/* THW Citation font */
+// THW Citation font
 .thw-citation-font {
   font-family: "Neue Demos", serif !important;
   font-style: italic !important;
diff --git a/ui/src/assets/fonts.css b/ui/src/assets/fonts.css
new file mode 100644
index 0000000..8c832b3
--- /dev/null
+++ b/ui/src/assets/fonts.css
@@ -0,0 +1,71 @@
+@font-face {
+    font-family: "Lubalin Graph";
+    src: url("//db.onlinewebfonts.com/t/60eaf3171fce0c04eb9b3e08bba9bf05.eot");
+    src: url("//db.onlinewebfonts.com/t/60eaf3171fce0c04eb9b3e08bba9bf05.eot?#iefix") format("embedded-opentype"),
+        url("//db.onlinewebfonts.com/t/60eaf3171fce0c04eb9b3e08bba9bf05.woff2") format("woff2"),
+        url("//db.onlinewebfonts.com/t/60eaf3171fce0c04eb9b3e08bba9bf05.woff") format("woff"),
+        url("//db.onlinewebfonts.com/t/60eaf3171fce0c04eb9b3e08bba9bf05.ttf") format("truetype"),
+        url("//db.onlinewebfonts.com/t/60eaf3171fce0c04eb9b3e08bba9bf05.svg#Lubalin BQ") format("svg");
+    font-weight: bold;
+    font-style: normal;
+}
+
+@font-face {
+    font-family: "Lubalin Graph";
+    src: url("//db.onlinewebfonts.com/t/ad42b6e73cbf720f172faa6355b69ec8.eot");
+    src: url("//db.onlinewebfonts.com/t/ad42b6e73cbf720f172faa6355b69ec8.eot?#iefix") format("embedded-opentype"),
+        url("//db.onlinewebfonts.com/t/ad42b6e73cbf720f172faa6355b69ec8.woff2") format("woff2"),
+        url("//db.onlinewebfonts.com/t/ad42b6e73cbf720f172faa6355b69ec8.woff") format("woff"),
+        url("//db.onlinewebfonts.com/t/ad42b6e73cbf720f172faa6355b69ec8.ttf") format("truetype"),
+        url("//db.onlinewebfonts.com/t/ad42b6e73cbf720f172faa6355b69ec8.svg#LubalinGraph-Book") format("svg");
+    font-weight: normal;
+    font-style: normal;
+}
+
+@font-face {
+    font-family: "Neue Praxis";
+    src: url("//db.onlinewebfonts.com/t/95d43d14f7d8f0f4692f507c86a29e25.eot");
+    src: url("//db.onlinewebfonts.com/t/95d43d14f7d8f0f4692f507c86a29e25.eot?#iefix") format("embedded-opentype"),
+        url("//db.onlinewebfonts.com/t/95d43d14f7d8f0f4692f507c86a29e25.woff2") format("woff2"),
+        url("//db.onlinewebfonts.com/t/95d43d14f7d8f0f4692f507c86a29e25.woff") format("woff"),
+        url("//db.onlinewebfonts.com/t/95d43d14f7d8f0f4692f507c86a29e25.ttf") format("truetype"),
+        url("//db.onlinewebfonts.com/t/95d43d14f7d8f0f4692f507c86a29e25.svg#PraxisEF") format("svg");
+    font-weight: bold;
+    font-style: normal;
+}
+
+@font-face {
+    font-family: "Neue Praxis";
+    src: url("//db.onlinewebfonts.com/t/3d62d4fffdd20ba4608e1b29e0f6fb42.eot");
+    src: url("//db.onlinewebfonts.com/t/3d62d4fffdd20ba4608e1b29e0f6fb42.eot?#iefix") format("embedded-opentype"),
+        url("//db.onlinewebfonts.com/t/3d62d4fffdd20ba4608e1b29e0f6fb42.woff2") format("woff2"),
+        url("//db.onlinewebfonts.com/t/3d62d4fffdd20ba4608e1b29e0f6fb42.woff") format("woff"),
+        url("//db.onlinewebfonts.com/t/3d62d4fffdd20ba4608e1b29e0f6fb42.ttf") format("truetype"),
+        url("//db.onlinewebfonts.com/t/3d62d4fffdd20ba4608e1b29e0f6fb42.svg#PraxisEF") format("svg");
+    font-weight: normal;
+    font-style: normal;
+}
+
+@font-face {
+    font-family: "Neue Demos";
+    src: url("//db.onlinewebfonts.com/t/57c19d4b8c4d1632fc97994508a35f5d.eot");
+    src: url("//db.onlinewebfonts.com/t/57c19d4b8c4d1632fc97994508a35f5d.eot?#iefix") format("embedded-opentype"),
+        url("//db.onlinewebfonts.com/t/57c19d4b8c4d1632fc97994508a35f5d.woff2") format("woff2"),
+        url("//db.onlinewebfonts.com/t/57c19d4b8c4d1632fc97994508a35f5d.woff") format("woff"),
+        url("//db.onlinewebfonts.com/t/57c19d4b8c4d1632fc97994508a35f5d.ttf") format("truetype"),
+        url("//db.onlinewebfonts.com/t/57c19d4b8c4d1632fc97994508a35f5d.svg#DemosEF") format("svg");
+    font-weight: normal;
+    font-style: normal;
+}
+
+@font-face {
+    font-family: "Neue Demos";
+    src: url("//db.onlinewebfonts.com/t/ad75fa70682671bbf5a5cec5f6df1470.eot");
+    src: url("//db.onlinewebfonts.com/t/ad75fa70682671bbf5a5cec5f6df1470.eot?#iefix") format("embedded-opentype"),
+        url("//db.onlinewebfonts.com/t/ad75fa70682671bbf5a5cec5f6df1470.woff2") format("woff2"),
+        url("//db.onlinewebfonts.com/t/ad75fa70682671bbf5a5cec5f6df1470.woff") format("woff"),
+        url("//db.onlinewebfonts.com/t/ad75fa70682671bbf5a5cec5f6df1470.ttf") format("truetype"),
+        url("//db.onlinewebfonts.com/t/ad75fa70682671bbf5a5cec5f6df1470.svg#DemosEF") format("svg");
+    font-weight: normal;
+    font-style: italic;
+}
\ No newline at end of file