From bf648dce6cf1ddc684fd5a1579b21686bcc672f7 Mon Sep 17 00:00:00 2001
From: Jiiks <jiiks@windowslive.com>
Date: Sun, 4 Feb 2018 11:51:35 +0200
Subject: [PATCH 1/3] Remove transforms so fixed positioning actually works.
 Chrome: 20574 wontfix lel

---
 client/src/styles/partials/generic/modals.scss      | 2 +-
 client/src/styles/partials/sidebarview/content.scss | 4 +++-
 client/src/styles/partials/sidebarview/main.scss    | 8 +++++++-
 client/src/ui/components/BdSettings.vue             | 7 ++-----
 4 files changed, 13 insertions(+), 8 deletions(-)

diff --git a/client/src/styles/partials/generic/modals.scss b/client/src/styles/partials/generic/modals.scss
index f5dea896..aacc5be4 100644
--- a/client/src/styles/partials/generic/modals.scss
+++ b/client/src/styles/partials/generic/modals.scss
@@ -1,5 +1,5 @@
 .bd-backdrop {
-    position: absolute;
+    position: fixed;
     right: 0px;
     left: 0px;
     top: 0px;
diff --git a/client/src/styles/partials/sidebarview/content.scss b/client/src/styles/partials/sidebarview/content.scss
index 8a520ed3..62122d2a 100644
--- a/client/src/styles/partials/sidebarview/content.scss
+++ b/client/src/styles/partials/sidebarview/content.scss
@@ -36,7 +36,9 @@
     > div:not(.active) {
         opacity: 0;
         position: absolute;
-        width: 100%;
+        left: 310px;
+        right: 0;
+        // width: 100%;
         height: 100%;
         pointer-events: none;
     }
diff --git a/client/src/styles/partials/sidebarview/main.scss b/client/src/styles/partials/sidebarview/main.scss
index f3e14e12..1bb9541c 100644
--- a/client/src/styles/partials/sidebarview/main.scss
+++ b/client/src/styles/partials/sidebarview/main.scss
@@ -39,9 +39,15 @@
         backface-visibility: hidden;
     }
 
+    &.bd-stop {
+        .bd-content-region {
+            transform: none;
+        }
+    }
+
     &.active {
         .bd-content-region {
-            animation: bd-slidein .6s forwards;
+            animation: bd-slidein .6s;
         }
     }
 }
diff --git a/client/src/ui/components/BdSettings.vue b/client/src/ui/components/BdSettings.vue
index 4be13fa5..5d986ae5 100644
--- a/client/src/ui/components/BdSettings.vue
+++ b/client/src/ui/components/BdSettings.vue
@@ -10,7 +10,7 @@
 
 <template>
     <div class="bd-settings" :class="{active: active}" @keyup="close">
-        <SidebarView :contentVisible="this.activeIndex >= 0" :animating="this.animating">
+        <SidebarView :contentVisible="this.activeIndex >= 0" :animating="this.animating" :class="{'bd-stop': !first}">
             <Sidebar slot="sidebar">
                 <div class="bd-settings-x" @click="close">
                     <MiClose size="17"/>
@@ -101,11 +101,8 @@
                 this.lastActiveIndex = this.activeIndex;
                 this.activeIndex = id;
 
-                if (this.first) {
-                    this.first = false;
-                }
-
                 setTimeout(() => {
+                    this.first = false;
                     this.animating = false;
                     this.lastActiveIndex = -1;
                 }, 400);

From 8a799f29f72734b3eb16f596a4bfc897c36e7486 Mon Sep 17 00:00:00 2001
From: Jiiks <jiiks@windowslive.com>
Date: Sun, 4 Feb 2018 14:00:08 +0200
Subject: [PATCH 2/3] Fullscreen modals fixes #80

---
 client/src/styles/partials/bdsettings/button.scss   |  2 +-
 .../src/styles/partials/bdsettings/sidebarview.scss | 13 +++++++++++++
 client/src/styles/partials/generic/modals.scss      |  3 +++
 client/src/styles/partials/layouts.scss             |  4 ++++
 client/src/ui/components/BdSettings.vue             |  3 +++
 client/src/ui/components/BdSettingsWrapper.vue      |  2 +-
 6 files changed, 25 insertions(+), 2 deletions(-)

diff --git a/client/src/styles/partials/bdsettings/button.scss b/client/src/styles/partials/bdsettings/button.scss
index ae461fdd..ad29c556 100644
--- a/client/src/styles/partials/bdsettings/button.scss
+++ b/client/src/styles/partials/bdsettings/button.scss
@@ -32,7 +32,7 @@
         }
     }
 
-    &.active {
+    &.bd-active {
         background: transparent;
         opacity: 1;
         box-shadow: none;
diff --git a/client/src/styles/partials/bdsettings/sidebarview.scss b/client/src/styles/partials/bdsettings/sidebarview.scss
index 3007087a..15670905 100644
--- a/client/src/styles/partials/bdsettings/sidebarview.scss
+++ b/client/src/styles/partials/bdsettings/sidebarview.scss
@@ -98,3 +98,16 @@
         }
     }
 }
+
+.bd-settings .bd-sidebar-view.bd-stop .bd-content-region {
+	z-index: 3003;
+}
+
+.bd-backdrop {
+	z-index: 3003;
+}
+
+.bd-sidebar .bd-settings-button {
+    position: absolute;
+	top: 0;
+}
diff --git a/client/src/styles/partials/generic/modals.scss b/client/src/styles/partials/generic/modals.scss
index aacc5be4..db893f3f 100644
--- a/client/src/styles/partials/generic/modals.scss
+++ b/client/src/styles/partials/generic/modals.scss
@@ -31,6 +31,7 @@
     box-sizing: border-box;
     pointer-events: none;
     z-index: 9001;
+    justify-content: center;
 }
 
 .bd-modal .bd-modal-inner {
@@ -46,6 +47,8 @@
     flex-grow: 1;
     border-radius: 4px;
     max-height: 100%;
+    max-width: 500px;
+    width: 500px;
 }
 
 .bd-modal .bd-modal-body {
diff --git a/client/src/styles/partials/layouts.scss b/client/src/styles/partials/layouts.scss
index 980ed161..6165c0c9 100644
--- a/client/src/styles/partials/layouts.scss
+++ b/client/src/styles/partials/layouts.scss
@@ -17,3 +17,7 @@
 .bd-flex-spacer {
     flex-grow: 1;
 }
+
+.bd-hide {
+    display: none;
+}
diff --git a/client/src/ui/components/BdSettings.vue b/client/src/ui/components/BdSettings.vue
index 5d986ae5..3e304f33 100644
--- a/client/src/ui/components/BdSettings.vue
+++ b/client/src/ui/components/BdSettings.vue
@@ -12,6 +12,9 @@
     <div class="bd-settings" :class="{active: active}" @keyup="close">
         <SidebarView :contentVisible="this.activeIndex >= 0" :animating="this.animating" :class="{'bd-stop': !first}">
             <Sidebar slot="sidebar">
+                <div class="bd-settings-button bd-active">
+                    <div class="bd-settings-button-btn"></div>
+                </div>
                 <div class="bd-settings-x" @click="close">
                     <MiClose size="17"/>
                     <span class="bd-x-text">ESC</span>
diff --git a/client/src/ui/components/BdSettingsWrapper.vue b/client/src/ui/components/BdSettingsWrapper.vue
index e7c56030..832929d9 100644
--- a/client/src/ui/components/BdSettingsWrapper.vue
+++ b/client/src/ui/components/BdSettingsWrapper.vue
@@ -10,7 +10,7 @@
 
 <template>
     <div class="bd-settings-wrapper" :class="[{active: active}, 'platform-' + this.platform]">
-        <div class="bd-settings-button" :class="{active: active}" @click="showSettings">
+        <div class="bd-settings-button" :class="{'bd-hide': active}" @click="showSettings">
             <div class="bd-settings-button-btn" :class="[{'bd-loading': !loaded}]"></div>
         </div>
         <BdSettings :active="active" :close="hideSettings" />

From 230e9e6560cad00aa133a5cda021c8bc6d9bdeda Mon Sep 17 00:00:00 2001
From: Jiiks <jiiks@windowslive.com>
Date: Sun, 4 Feb 2018 14:08:28 +0200
Subject: [PATCH 3/3] Fix footer save alert

---
 .../styles/partials/bdsettings/plugin-settings-modal.scss  | 6 ------
 client/src/styles/partials/generic/modals.scss             | 7 +++----
 2 files changed, 3 insertions(+), 10 deletions(-)

diff --git a/client/src/styles/partials/bdsettings/plugin-settings-modal.scss b/client/src/styles/partials/bdsettings/plugin-settings-modal.scss
index ea8e9564..cd3e89b1 100644
--- a/client/src/styles/partials/bdsettings/plugin-settings-modal.scss
+++ b/client/src/styles/partials/bdsettings/plugin-settings-modal.scss
@@ -3,13 +3,7 @@
         padding: 0;
     }
 
-    .bd-scroller-wrap .bd-scroller {
-        margin: 0;
-        padding: 0;
-    }
-
     .bd-plugin-settings-body {
-        margin-bottom: 80px;
         padding: 0 15px;
 
         .bd-setting-switch {
diff --git a/client/src/styles/partials/generic/modals.scss b/client/src/styles/partials/generic/modals.scss
index db893f3f..fdc2abae 100644
--- a/client/src/styles/partials/generic/modals.scss
+++ b/client/src/styles/partials/generic/modals.scss
@@ -109,10 +109,8 @@
 
     .bd-modal-footer {
         .bd-footer-alert {
-            position: absolute;
-            bottom: 80px;
-            left: 70px;
-            right: 70px;
+            margin: 10px;
+            height: 0;
             display: flex;
             background-color: rgba(32, 34, 37, 0.9);
             box-shadow: 0 2px 10px 0 rgba(0,0,0,.2);
@@ -129,6 +127,7 @@
             }
 
             &.bd-active {
+                height: auto;
                 opacity: 1;
                 transform: none;
             }