Revamp mobile including CSS flexbox for messageListItem

This commit is contained in:
djmaze 2021-02-15 15:20:22 +01:00
parent 6238b97f08
commit 10f9ce39d9
70 changed files with 479 additions and 821 deletions

View file

@ -4,7 +4,8 @@ import {
doc,
$htmlCL,
leftPanelDisabled,
Settings
Settings,
isMobile
} from 'Common/Globals';
import { KeyState } from 'Common/Enums';
@ -48,7 +49,7 @@ export class AbstractApp {
* @returns {boolean}
*/
download(link) {
if (Settings.app('mobile')) {
if (isMobile()) {
open(link, '_self');
focus();
} else {
@ -82,8 +83,7 @@ export class AbstractApp {
}
bootstart() {
const mobile = Settings.app('mobile'),
register = (key, ClassObject, templateID) => ko.components.register(key, {
const register = (key, ClassObject, templateID) => ko.components.register(key, {
template: { element: templateID || (key + 'Component') },
viewModel: {
createViewModel: (params, componentInfo) => {
@ -110,7 +110,7 @@ export class AbstractApp {
register('Select', SelectComponent);
register('TextArea', TextAreaComponent);
register('CheckboxSimple', CheckboxComponent, 'CheckboxComponent');
if (mobile || !Settings.app('materialDesign')) {
if (isMobile() || !Settings.app('materialDesign')) {
register('Checkbox', CheckboxComponent);
} else {
register('Checkbox', CheckboxMaterialDesignComponent, 'CheckboxMaterialDesignComponent');
@ -118,7 +118,7 @@ export class AbstractApp {
initOnStartOrLangChange();
if (mobile) {
if (isMobile()) {
leftPanelDisabled(true);
} else {
window.addEventListener('resize', () => leftPanelDisabled(767 >= window.innerWidth));

View file

@ -17,7 +17,7 @@ import {
ClientSideKeyName
} from 'Common/EnumsUser';
import { doc, createElement, $htmlCL, Settings, leftPanelDisabled } from 'Common/Globals';
import { doc, createElement, $htmlCL, Settings, leftPanelDisabled, isMobile } from 'Common/Globals';
import { UNUSED_OPTION_VALUE } from 'Common/Consts';
@ -871,12 +871,11 @@ class AppUser extends AbstractApp {
}
}
initVerticalLayoutResizer(sClientSideKeyName) {
initVerticalLayoutResizer() {
const left = doc.getElementById('rl-left'),
right = doc.getElementById('rl-right'),
fDisable = bDisable => {
this.setLayoutResizer(left, right, sClientSideKeyName, bDisable ? null : 'width');
};
fDisable = bDisable =>
this.setLayoutResizer(left, right, ClientSideKeyName.FolderListSize, bDisable ? null : 'width');
if (left && right) {
fDisable(false);
leftPanelDisabled.subscribe(value => fDisable(value));
@ -1023,8 +1022,8 @@ class AppUser extends AbstractApp {
}, 500);
}
if (!Settings.app('mobile')) {
setTimeout(() => this.initVerticalLayoutResizer(ClientSideKeyName.FolderListSize), 1);
if (!isMobile()) {
setTimeout(() => this.initVerticalLayoutResizer(), 1);
}
} else {
this.logout();