From b1a62882d62df7a4d88d4f20a8469a38de6dd475 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:01:48 +0000
Subject: [PATCH] THW Logo layout optimization

---
 ui/src/components/THWLogo.vue | 33 +++++++++++++++------------------
 1 file changed, 15 insertions(+), 18 deletions(-)

diff --git a/ui/src/components/THWLogo.vue b/ui/src/components/THWLogo.vue
index 2cf9877..d6fb70d 100644
--- a/ui/src/components/THWLogo.vue
+++ b/ui/src/components/THWLogo.vue
@@ -1,23 +1,18 @@
 <template>
-  <div class="flex-column">
-    <div class="d-flex">
-      <div class="d-flex justify-end">
-        <span class="d-none d-sm-flex text-right thw-logo-font above mr-2">
-          <slot name="above">
-            Technisches<br />
-            Hilfswerk
-          </slot>
-        </span>
-        <v-img
-          class="d-flex"
-          max-width="56"
-          max-height="56"
-          :src="require('../assets/thw.svg')"
-        />
-      </div>
+  <div class="flex-column text-wrap">
+    <div class="d-flex justify-end">
+      <span class="d-none d-sm-flex text-right thw-logo-font above mr-2">
+        <slot name="above">Technisches Hilfswerk</slot>
+      </span>
+      <v-img
+        class="d-flex"
+        max-width="56"
+        max-height="56"
+        :src="require('../assets/thw.svg')"
+      />
     </div>
     <v-divider class="d-none d-sm-block my-1" />
-    <span class="d-none d-sm-flex text-wrap thw-logo-font below">
+    <span class="d-none d-sm-flex thw-logo-font below">
       <slot>OV Musterstadt</slot>
     </span>
   </div>
@@ -32,7 +27,8 @@ export default class THWLogo extends Vue {}
 
 <style scoped>
 .flex-column {
-  max-width: 240px;
+  min-width: 250px;
+  max-width: 250px;
 }
 
 .v-divider {
@@ -43,6 +39,7 @@ export default class THWLogo extends Vue {}
 .above {
   font-size: 28px;
   line-height: 28px;
+  align-items: center;
 }
 
 .below {