diff --git a/dev/App/Abstract.js b/dev/App/Abstract.js index c4d0f930b..9935e995e 100644 --- a/dev/App/Abstract.js +++ b/dev/App/Abstract.js @@ -3,7 +3,6 @@ import ko from 'ko'; import { doc, elementById, - leftPanelDisabled, Settings } from 'Common/Globals'; @@ -97,11 +96,6 @@ export class AbstractApp { initOnStartOrLangChange(); - leftPanelDisabled(ThemeStore.isMobile()); - addEventListener('resize', () => leftPanelDisabled(ThemeStore.isMobile() || 767 >= innerWidth)); - - leftPanelDisabled.valueHasMutated(); - LanguageStore.populate(); ThemeStore.populate(); } diff --git a/dev/App/User.js b/dev/App/User.js index 46131cb33..7184a9ff8 100644 --- a/dev/App/User.js +++ b/dev/App/User.js @@ -898,6 +898,8 @@ class AppUser extends AbstractApp { bootstart() { super.bootstart(); + addEventListener('resize', () => leftPanelDisabled(ThemeStore.isMobile() || 1000 > innerWidth)); + AppStore.populate(); SettingsStore.populate(); NotificationStore.populate(); diff --git a/dev/Stores/Theme.js b/dev/Stores/Theme.js index ee3a0fee7..fa1b1f0c0 100644 --- a/dev/Stores/Theme.js +++ b/dev/Stores/Theme.js @@ -1,5 +1,5 @@ import ko from 'ko'; -import { $htmlCL } from 'Common/Globals'; +import { $htmlCL, leftPanelDisabled } from 'Common/Globals'; export const ThemeStore = { themes: ko.observableArray(), @@ -17,6 +17,8 @@ export const ThemeStore = { this.userBackgroundName(Settings.get('UserBackgroundName')); this.userBackgroundHash(Settings.get('UserBackgroundHash')); } + + leftPanelDisabled(this.isMobile()); } }; diff --git a/dev/Styles/@Admin.less b/dev/Styles/@Admin.less index 25edfce86..65c42afd6 100644 --- a/dev/Styles/@Admin.less +++ b/dev/Styles/@Admin.less @@ -23,7 +23,7 @@ @import "Ui.less"; @import "Main.less"; -@import "Layout.less"; +@import "LayoutAdmin.less"; @import "Components.less"; @import "Login.less"; @import "Ask.less"; diff --git a/dev/Styles/Admin.less b/dev/Styles/Admin.less index 7eae4dbbf..1eb54beb8 100644 --- a/dev/Styles/Admin.less +++ b/dev/Styles/Admin.less @@ -107,10 +107,6 @@ } } - .b-settings-content { - padding: 20px; - padding-left: 30px; - } } .btn.btn-logout { diff --git a/dev/Styles/Layout.less b/dev/Styles/Layout.less index 00df9f74a..01a4bb684 100644 --- a/dev/Styles/Layout.less +++ b/dev/Styles/Layout.less @@ -5,7 +5,7 @@ background-position: center; } -#rl-center, #rl-top, #rl-bottom, #rl-left, #rl-right { +#rl-center, #rl-top, #rl-left, #rl-right { position: absolute; top: 0; right: 0; @@ -48,14 +48,8 @@ html.rl-mobile { z-index: 2; } -#rl-bottom { - top: auto; - z-index: 1; -} - #rl-left { width: @rlLeftWidth; - min-width: 60px; } /* @@ -131,7 +125,7 @@ html:not(.rl-left-panel-disabled) #rl-left.resizable > .resizer, top: 0; bottom: 0; left: 0; - width: 500px; + width: 50%; } #rl-sub-right { @@ -139,7 +133,7 @@ html:not(.rl-left-panel-disabled) #rl-left.resizable > .resizer, top: 0; bottom: 0; right: 0; - left: 500px; + left: 50%; .b-message-view-backdrop { position: absolute; @@ -187,6 +181,14 @@ html:not(.rl-left-panel-disabled) #rl-left.resizable > .resizer, // -webkit-overflow-scrolling: touch; } +.b-settings-content { + padding:20px 20px 20px 30px; +} + +/* desktop */ +@media screen and (min-width: 1000px) { +} + /* desktop-large */ @media screen and (min-width: 1401px) { #rl-left { @@ -198,30 +200,11 @@ html:not(.rl-left-panel-disabled) #rl-left.resizable > .resizer, } #rl-sub-left { - width: 500px; + width: 40%; } #rl-sub-right { - left: 500px; - } -} - -/* desktop */ -@media screen and (min-width: 1000px) and (max-width: 1400px) { - #rl-left { - width: @rlLeftWidth; - } - - #rl-right { - left: @rlLeftWidth; - } - - #rl-sub-left { - width: 400px; - } - - #rl-sub-right { - left: 400px; + left: 40%; } } @@ -235,17 +218,9 @@ html:not(.rl-left-panel-disabled) #rl-left.resizable > .resizer, left: 155px; } - #rl-sub-left { - width: 310px; + .b-settings-content { + padding: 10px 10px 10px 20px; } - - #rl-sub-right { - left: 310px; - } -} - -/* tablet */ -@media screen and (min-width: 768px) and (max-width: 999px) { } .hidden-on-ctrl-btn, @@ -272,10 +247,6 @@ html.rl-left-panel-disabled { opacity: 0.3; } - .visibility-hidden-on-panel-disabled { - visibility: hidden; - } - .hide-on-panel-disabled { display: none; } diff --git a/dev/Styles/LayoutAdmin.less b/dev/Styles/LayoutAdmin.less new file mode 100644 index 000000000..b92c44dbb --- /dev/null +++ b/dev/Styles/LayoutAdmin.less @@ -0,0 +1,105 @@ + +.UserBackground body { + background-size: contain; + background-repeat: no-repeat; + background-position: center; +} + +#rl-center, #rl-top, #rl-left, #rl-right { + position: absolute; + top: 0; + right: 0; + bottom: 0; + left: 0; + padding: 0; + margin: 0; + border: 0; + z-index: 0; +} + +#rl-content { + height: 100%; + width: 100%; +} + +#rl-center { + min-width: 600px; + min-height: 400px; +} + +#rl-top { + bottom: auto; + z-index: 2; +} + +#rl-left { + width: @rlLeftWidth; +} + +#rl-right { + z-index: 1; + left: @rlLeftWidth; +} + +#rl-popups > .rl-view-model { + position: fixed; + top: 0; + bottom: 0; + left: 0; + right: 0; + z-index: 1100; + overflow: auto; + background-color: rgba(0,0,0,0.3); +// -webkit-overflow-scrolling: touch; +} + +.b-settings-content { + padding:20px 20px 20px 30px; +} + +/* desktop */ +@media screen and (min-width: 1000px) { + .toggleLeft { + display: none; + } +} + +/* desktop-large */ +@media screen and (min-width: 1401px) { + #rl-left { + width: @rlLeftWidth + 20; + } + + #rl-right { + left: @rlLeftWidth + 20; + } +} + +/* mobile and tablet */ +@media screen and (max-width: 999px) { + .b-settings-content { + padding: 10px 10px 10px 20px; + } + + #rl-center { + min-width: 250px; + min-height: 250px; + } + + html:not(.rl-left-panel-disabled) #rl-right { + right: 5-@rlLeftWidth; + } + + html.rl-left-panel-disabled { + #rl-left { + width: 0px !important; + + .opacity-on-panel-disabled { + opacity: 0.3; + } + } + #rl-right { + left: 5px !important; + } + } +} diff --git a/dev/Styles/MessageView.less b/dev/Styles/MessageView.less index 43466f6b3..c05b39fc3 100644 --- a/dev/Styles/MessageView.less +++ b/dev/Styles/MessageView.less @@ -591,7 +591,7 @@ html .messageItem .line-loading { html.rl-message-fullscreen { - #rl-left, #rl-bottom { + #rl-left { display: none !important; } diff --git a/dev/Styles/Settings.less b/dev/Styles/Settings.less index 3e19fe55c..06bffca4f 100644 --- a/dev/Styles/Settings.less +++ b/dev/Styles/Settings.less @@ -109,11 +109,6 @@ } } - .b-settings-content { - padding: 20px; - padding-left: 30px; - } - td { padding: 4px 8px; line-height: 30px; diff --git a/dev/Styles/_BootstrapFix.less b/dev/Styles/_BootstrapFix.less index 2e3477230..17accdb9f 100644 --- a/dev/Styles/_BootstrapFix.less +++ b/dev/Styles/_BootstrapFix.less @@ -101,11 +101,6 @@ label.inline, span.inline { width: calc(~'100% - 20px') !important; } - .b-settings-content { - padding: 10px; - padding-left: 20px; - } - .form-horizontal { .control-group { .control-label { diff --git a/dev/View/Admin/Settings/Menu.js b/dev/View/Admin/Settings/Menu.js index b82bddb61..e70aae339 100644 --- a/dev/View/Admin/Settings/Menu.js +++ b/dev/View/Admin/Settings/Menu.js @@ -1,4 +1,3 @@ -import { leftPanelDisabled } from 'Common/Globals'; import { KeyState } from 'Common/Enums'; import { settingsMenuKeysHandler } from 'Knoin/Knoin'; @@ -11,8 +10,6 @@ class MenuSettingsAdminView extends AbstractViewLeft { constructor(screen) { super('Admin/Settings/Menu', 'AdminMenu'); - this.leftPanelDisabled = leftPanelDisabled; - this.menu = screen.menu; } diff --git a/dev/View/Admin/Settings/Pane.js b/dev/View/Admin/Settings/Pane.js index 36c398818..d72d4c548 100644 --- a/dev/View/Admin/Settings/Pane.js +++ b/dev/View/Admin/Settings/Pane.js @@ -25,16 +25,10 @@ class PaneSettingsAdminView extends AbstractViewRight { .extend({ rateLimit: 300 }); } - hideLeft(item, event) { + toggleLeft(item, event) { event.preventDefault(); event.stopPropagation(); - leftPanelDisabled(true); - } - - showLeft(item, event) { - event.preventDefault(); - event.stopPropagation(); - leftPanelDisabled(false); + leftPanelDisabled(!leftPanelDisabled()); } logoutClick() { diff --git a/snappymail/v/0.0.0/app/libraries/RainLoop/Actions/Admin.php b/snappymail/v/0.0.0/app/libraries/RainLoop/Actions/Admin.php index a41dfa05e..6ebe0df62 100644 --- a/snappymail/v/0.0.0/app/libraries/RainLoop/Actions/Admin.php +++ b/snappymail/v/0.0.0/app/libraries/RainLoop/Actions/Admin.php @@ -67,11 +67,10 @@ trait Admin { $this->oLogger->Write('Cannot store an admin token', \MailSo\Log\Enumerations\Type::WARNING); - - $sRand = ''; + return ''; } - return '' === $sRand ? '' : Utils::EncodeKeyValuesQ(array('token', \md5(APP_SALT), $sRand)); + return Utils::EncodeKeyValuesQ(array('token', \md5(APP_SALT), $sRand)); } private function setCapaFromParams(\RainLoop\Config\Application $oConfig, string $sParamName, string $sCapa) : void diff --git a/snappymail/v/0.0.0/app/templates/Views/Admin/AdminMenu.html b/snappymail/v/0.0.0/app/templates/Views/Admin/AdminMenu.html index 79bf048fb..cc19c6948 100644 --- a/snappymail/v/0.0.0/app/templates/Views/Admin/AdminMenu.html +++ b/snappymail/v/0.0.0/app/templates/Views/Admin/AdminMenu.html @@ -1,11 +1,5 @@
-
-
- - - -
-
+
@@ -20,5 +14,4 @@
-
diff --git a/snappymail/v/0.0.0/app/templates/Views/Admin/AdminPane.html b/snappymail/v/0.0.0/app/templates/Views/Admin/AdminPane.html index e67d3034a..cc1638852 100644 --- a/snappymail/v/0.0.0/app/templates/Views/Admin/AdminPane.html +++ b/snappymail/v/0.0.0/app/templates/Views/Admin/AdminPane.html @@ -1,7 +1,6 @@
- ❮ - ❯ + ❮

SnappyMail -

⏻ @@ -9,7 +8,7 @@
-
+
diff --git a/snappymail/v/0.0.0/app/templates/Views/User/SettingsPane.html b/snappymail/v/0.0.0/app/templates/Views/User/SettingsPane.html index 6c92725a6..8311b9293 100644 --- a/snappymail/v/0.0.0/app/templates/Views/User/SettingsPane.html +++ b/snappymail/v/0.0.0/app/templates/Views/User/SettingsPane.html @@ -16,7 +16,7 @@
-
+
diff --git a/vendors/bootstrap/less/wells.less b/vendors/bootstrap/less/wells.less index 0434819e7..5e37961d1 100644 --- a/vendors/bootstrap/less/wells.less +++ b/vendors/bootstrap/less/wells.less @@ -12,6 +12,7 @@ border: 1px solid darken(@wellBackground, 7%); border-radius: 4px; box-shadow: inset 0 1px 1px rgba(0,0,0,.05); + display: inline-block; } // Sizes