From aa44c4cffe424e6f4805b9799f4b38654c655336 Mon Sep 17 00:00:00 2001
From: ogerly <fridolin@tutanota.com>
Date: Mon, 13 Jun 2022 11:08:19 +0200
Subject: [PATCH] refactor mobile style step 1

---
 frontend/src/components/Auth/AuthNavbar.vue | 12 ++++++++++--
 frontend/src/components/LanguageSwitch2.vue |  4 ++--
 frontend/src/layouts/AuthLayout.vue         |  4 ++--
 3 files changed, 14 insertions(+), 6 deletions(-)

diff --git a/frontend/src/components/Auth/AuthNavbar.vue b/frontend/src/components/Auth/AuthNavbar.vue
index 8063dd330..e1f47e5a7 100644
--- a/frontend/src/components/Auth/AuthNavbar.vue
+++ b/frontend/src/components/Auth/AuthNavbar.vue
@@ -3,7 +3,7 @@
     <b-navbar toggleable="lg" class="pr-4">
       <b-navbar-brand>
         <b-img
-          class="imgLogo position-absolute ml--3 mt--3 p-2 zindex1000"
+          class="imgLogo position-absolute ml--3 mt-lg--2 mt-3 p-2 zindex1000"
           :src="logo"
           width="200"
           alt="..."
@@ -18,7 +18,7 @@
       <b-img class="sheet-img position-absolute d-block d-lg-none zindex1000" :src="sheet"></b-img>
       <b-navbar-toggle target="nav-collapse" class="zindex1000"></b-navbar-toggle>
 
-      <b-collapse id="nav-collapse" is-nav class="mt-5 mt-lg-0">
+      <b-collapse id="nav-collapse" is-nav class="ml-5">
         <b-navbar-nav class="ml-auto" right>
           <b-nav-item :href="`https://gradido.net/${$i18n.locale}`" target="_blank">
             {{ $t('auth.navbar.aboutGradido') }}
@@ -49,10 +49,18 @@ export default {
   color: #383838 !important;
 }
 
+.navbar-toggler {
+  font-size: 2.25rem;
+}
+
 .authNavbar > .router-link-exact-active {
   color: #0e79bc !important;
 }
 
+button.navbar-toggler > span.navbar-toggler-icon {
+  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(4, 112, 6, 1)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
+}
+
 .auth-header {
   font-family: 'Open Sans', sans-serif !important;
 }
diff --git a/frontend/src/components/LanguageSwitch2.vue b/frontend/src/components/LanguageSwitch2.vue
index 317935900..90026f6f6 100644
--- a/frontend/src/components/LanguageSwitch2.vue
+++ b/frontend/src/components/LanguageSwitch2.vue
@@ -4,11 +4,11 @@
       v-for="(lang, index) in locales"
       @click.prevent="saveLocale(lang.code)"
       :key="lang.code"
-      class="pointer pr-3"
+      class="pointer pr-2"
       :class="$store.state.language === lang.code ? 'c-blau' : 'c-grey'"
     >
       {{ lang.name }}
-      <span class="ml-3">{{ locales.length - 1 > index ? $t('math.pipe') : '' }}</span>
+      <span class="ml-2">{{ locales.length - 1 > index ? $t('math.pipe') : '' }}</span>
     </span>
   </div>
 </template>
diff --git a/frontend/src/layouts/AuthLayout.vue b/frontend/src/layouts/AuthLayout.vue
index c886fd7f9..2c95829d1 100644
--- a/frontend/src/layouts/AuthLayout.vue
+++ b/frontend/src/layouts/AuthLayout.vue
@@ -31,8 +31,8 @@
                 <auth-navbar-small />
               </b-col>
             </b-row>
-            <b-row class="mt-5 pl-2 pl-md-0 pl-lg-0">
-              <b-col cols="9">
+            <b-row class="mt-0 mt-md-5 pl-2 pl-md-0 pl-lg-0">
+              <b-col lg="9" md="9" sm="12">
                 <div class="h1 mb--2">{{ $t('welcome') }}</div>
                 <div class="h1 mb-0">{{ $t('WelcomeBy', { name: communityName }) }}</div>
                 <div class="mb-0">{{ $t('1000thanks') }}</div>