Dereku/snappymail
1
0
Fork 0
mirror of https://github.com/the-djmaze/snappymail.git synced 2026-09-01 21:49:21 +03:00
Code Issues Projects Releases Packages Wiki Activity Actions

Revamp mobile including CSS flexbox for messageListItem

Browse source
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
Download patch file Download diff file Expand all files Collapse all files

18
dev/Stores/User/App.js
View file

@ -2,7 +2,7 @@ import ko from 'ko';
import { KeyState } from 'Common/Enums';
import { Focused } from 'Common/EnumsUser';
import { keyScope, leftPanelDisabled, Settings } from 'Common/Globals';
import { keyScope, leftPanelDisabled, Settings, isMobile } from 'Common/Globals';
class AppUserStore {
constructor() {
@ -22,27 +22,19 @@ class AppUserStore {
contactsIsAllowed: false
});
const isMobile = Settings.app('mobile');
this.focusedState.subscribe((value) => {
this.focusedState.subscribe(value => {
switch (value) {
case Focused.MessageList:
keyScope(KeyState.MessageList);
if (isMobile) {
leftPanelDisabled(true);
}
isMobile() && leftPanelDisabled(true);
break;
case Focused.MessageView:
keyScope(KeyState.MessageView);
if (isMobile) {
leftPanelDisabled(true);
}
isMobile() && leftPanelDisabled(true);
break;
case Focused.FolderList:
keyScope(KeyState.FolderList);
if (isMobile) {
leftPanelDisabled(false);
}
isMobile() && leftPanelDisabled(false);
break;
default:
break;

4
dev/Stores/User/Message.js
View file

@ -1,7 +1,7 @@
import ko from 'ko';
import { StorageResultType, Notification } from 'Common/Enums';
import { Layout, Focused, MessageSetAction } from 'Common/EnumsUser';
import { Focused, MessageSetAction } from 'Common/EnumsUser';
import { doc } from 'Common/Globals';
import { pInt, pString } from 'Common/Utils';
import { plainToHtml } from 'Common/UtilsUser';
@ -211,7 +211,7 @@ class MessageUserStore {
this.message.subscribe(message => {
if (message) {
if (Layout.NoPreview === SettingsStore.layout()) {
if (!SettingsStore.usePreviewPane()) {
AppStore.focusedState(Focused.MessageView);
}
} else {

12
dev/Stores/User/Settings.js
View file

@ -3,7 +3,7 @@ import ko from 'ko';
import { MESSAGES_PER_PAGE_VALUES } from 'Common/Consts';
import { Layout, EditorDefaultType } from 'Common/EnumsUser';
import { pInt } from 'Common/Utils';
import { doc } from 'Common/Globals';
import { doc, isMobile } from 'Common/Globals';
class SettingsUserStore {
constructor() {
@ -34,7 +34,7 @@ class SettingsUserStore {
autoLogout: 30
});
this.usePreviewPane = ko.computed(() => Layout.NoPreview !== this.layout());
this.usePreviewPane = ko.computed(() => Layout.NoPreview !== this.layout() && !isMobile());
this.subscribers();
}
@ -42,9 +42,9 @@ class SettingsUserStore {
subscribers() {
const htmlCL = doc.documentElement.classList;
this.layout.subscribe(value => {
htmlCL.toggle('rl-no-preview-pane', Layout.NoPreview === value);
htmlCL.toggle('rl-side-preview-pane', Layout.SidePreview === value);
htmlCL.toggle('rl-bottom-preview-pane', Layout.BottomPreview === value);
htmlCL.toggle('rl-no-preview-pane', isMobile() || Layout.NoPreview === value);
htmlCL.toggle('rl-side-preview-pane', !isMobile() && Layout.SidePreview === value);
htmlCL.toggle('rl-bottom-preview-pane', !isMobile() && Layout.BottomPreview === value);
dispatchEvent(new CustomEvent('rl-layout', {detail:value}));
});
}
@ -58,7 +58,7 @@ class SettingsUserStore {
this.messagesPerPage(settingsGet('MPP'));
this.showImages(!!settingsGet('ShowImages'));
this.useCheckboxesInList(!!settingsGet('UseCheckboxesInList'));
this.useCheckboxesInList(!!(isMobile() || settingsGet('UseCheckboxesInList')));
this.allowDraftAutosave(!!settingsGet('AllowDraftAutosave'));
this.useThreads(!!settingsGet('UseThreads'));
this.replySameFolder(!!settingsGet('ReplySameFolder'));