From 29f365e257fc9a7098eba2f32e2e40e291ad13dc Mon Sep 17 00:00:00 2001
From: ogerly <fridolin@tutanota.com>
Date: Fri, 13 May 2022 11:02:54 +0200
Subject: [PATCH] refactor scss to bootstrap scss on element

---
 frontend/src/components/Auth/MobileStart.vue | 24 +++++++++++---------
 frontend/src/layouts/AuthLayout_gdd.vue      | 10 +++-----
 2 files changed, 16 insertions(+), 18 deletions(-)

diff --git a/frontend/src/components/Auth/MobileStart.vue b/frontend/src/components/Auth/MobileStart.vue
index 75c34184c..0602d56ed 100644
--- a/frontend/src/components/Auth/MobileStart.vue
+++ b/frontend/src/components/Auth/MobileStart.vue
@@ -21,7 +21,7 @@
     <b-img
       fluid
       id="img1"
-      class="position-absolute h-100 w-100 overflow-hidden zindex10"
+      class="position-absolute h-100 w-100 overflow-hidden zindex100"
       src="img/template/gold_03.png"
       alt="start background image"
     ></b-img>
@@ -33,7 +33,7 @@
     ></b-img>
     <b-img
       id="img3"
-      class="position-relative w-100"
+      class="position-relative zindex10"
       src="img/template/Foto_01.jpg"
       alt="start background image"
     ></b-img>
@@ -75,18 +75,26 @@ export default {
 }
 
 /* background maske */
-@media screen and (min-width: 1024px) {
+@media screen and (max-width: 1024px) {
   .mobil-start-box #img3 {
-    top: -120px;
+    width: 100%;
+    top: -100px;
   }
 }
 
 @media screen and (max-width: 991px) {
   .mobil-start-box #img3 {
+    width: 100%;
     top: -148px;
   }
 }
 
+@media screen and (max-height: 740px) {
+  .mobil-start-box #img3 {
+    width: 115%;
+  }
+}
+
 @media screen and (max-width: 650px) {
   .mobil-start-box #img3 {
     width: 115%;
@@ -103,13 +111,7 @@ export default {
   }
 }
 
-@media screen and (max-height: 740px) {
-  .mobil-start-box #img3 {
-    width: 115%;
-  }
-}
-
-@media screen and (max-width: 300px) {
+@media screen and (max-width: 310px) {
   .mobil-start-box #img3 {
     width: 145%;
     left: -94px;
diff --git a/frontend/src/layouts/AuthLayout_gdd.vue b/frontend/src/layouts/AuthLayout_gdd.vue
index 3980e3d08..d2f0f748a 100644
--- a/frontend/src/layouts/AuthLayout_gdd.vue
+++ b/frontend/src/layouts/AuthLayout_gdd.vue
@@ -2,7 +2,7 @@
   <div class="auth-template">
     <mobile-start v-if="mobileStart" class="d-inline d-lg-none" @is-mobile-start="isMobileStart" />
     <div class="h-100 align-middle">
-      <navbar class="auth-header" />
+      <navbar class="zindex10" />
 
       <div class="left-content-box position-fixed d-none d-lg-block">
         <div class="bg-img-box position-absolute w-100">
@@ -19,8 +19,8 @@
         <b-col sm="12" md="8" offset-lg="6" lg="6">
           <div class="right-content-box ml-2 ml-sm-4 mr-2 mr-sm-4">
             <b-row class="d-none d-md-block d-lg-none mt-3">
-              <b-col class="zindex1000 mb--4">
-                <navbar-small />
+              <b-col class="mb--4">
+                <navbar-small class="zindex10" />
               </b-col>
             </b-row>
             <b-row class="mt-5 pl-2 pl-md-0 pl-lg-0">
@@ -135,10 +135,6 @@ export default {
 }
 .auth-template {
   overflow-x: hidden;
-  height: 100%;
-}
-.auth-header {
-  z-index: 999;
 }
 
 .bg-txt-box {