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/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/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 f5dea896..fdc2abae 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; @@ -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 { @@ -106,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); @@ -126,6 +127,7 @@ } &.bd-active { + height: auto; opacity: 1; transform: none; } 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/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..3e304f33 100644 --- a/client/src/ui/components/BdSettings.vue +++ b/client/src/ui/components/BdSettings.vue @@ -10,8 +10,11 @@