mirror of
https://github.com/the-djmaze/snappymail.git
synced 2026-08-30 04:29:21 +03:00
Cleanup more CSS and JS
and merge/cleanup/redesign composer attachments
This commit is contained in:
djmaze
parent
fe45179847
commit
e52b9abc61
23 changed files with 156 additions and 293 deletions
|
|
@ -405,13 +405,7 @@ class AppUser extends AbstractApp {
|
|||
prom
|
||||
.then((value) => !!value)
|
||||
.then(callback)
|
||||
.catch(() => {
|
||||
setTimeout(() => {
|
||||
if (callback) {
|
||||
callback(false); // eslint-disable-line callback-return
|
||||
}
|
||||
}, 1);
|
||||
});
|
||||
.catch(() => callback && setTimeout(() => callback(false), 1));
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -133,7 +133,7 @@ export const FileInfo = {
|
|||
getContentType: fileName => {
|
||||
fileName = fileName.toLowerCase().trim();
|
||||
if ('winmail.dat' === fileName) {
|
||||
return 'application/ms-tnef';
|
||||
return app + 'ms-tnef';
|
||||
}
|
||||
let ext = fileName.split('.').pop();
|
||||
if (/^(txt|text|def|list|in|ini|log|sql|cfg|conf|asc)$/.test(ext))
|
||||
|
|
@ -171,49 +171,42 @@ export const FileInfo = {
|
|||
let result = FileType.Unknown;
|
||||
const mimeTypeParts = mimeType.split('/'),
|
||||
type = mimeTypeParts[1].replace('x-','').replace('-compressed',''),
|
||||
match = str => type.includes(str);
|
||||
match = str => mimeType.includes(str),
|
||||
archive = /^(zip|7z|tar|rar|gzip|bzip|bzip2)$/;
|
||||
|
||||
switch (true) {
|
||||
case 'image' === mimeTypeParts[0] || ['png', 'jpg', 'jpeg', 'gif', 'webp'].includes(ext):
|
||||
case 'image' == mimeTypeParts[0] || ['png', 'jpg', 'jpeg', 'gif', 'webp'].includes(ext):
|
||||
result = FileType.Image;
|
||||
break;
|
||||
case 'audio' === mimeTypeParts[0] || ['mp3', 'ogg', 'oga', 'wav'].includes(ext):
|
||||
case 'audio' == mimeTypeParts[0] || ['mp3', 'ogg', 'oga', 'wav'].includes(ext):
|
||||
result = FileType.Audio;
|
||||
break;
|
||||
case 'video' === mimeTypeParts[0] || ['mkv', 'avi'].includes(ext):
|
||||
case 'video' == mimeTypeParts[0] || 'mkv' == ext || 'avi' == ext:
|
||||
result = FileType.Video;
|
||||
break;
|
||||
case ['php', 'js', 'css'].includes(ext):
|
||||
result = FileType.Code;
|
||||
break;
|
||||
case 'eml' === ext || ['message/delivery-status', 'message/rfc822'].includes(mimeType):
|
||||
case 'eml' == ext || ['message/delivery-status', 'message/rfc822'].includes(mimeType):
|
||||
result = FileType.Eml;
|
||||
break;
|
||||
case 'text/html' === mimeType || ['html'].includes(ext):
|
||||
case 'text/html' == mimeType || 'html' == ext:
|
||||
result = FileType.Html;
|
||||
break;
|
||||
case 'text' === mimeTypeParts[0] || ['txt', 'log'].includes(ext):
|
||||
case 'text' == mimeTypeParts[0] || 'txt' == ext || 'log' == ext:
|
||||
result = FileType.Text;
|
||||
break;
|
||||
case [
|
||||
'zip',
|
||||
'7z',
|
||||
'tar',
|
||||
'rar',
|
||||
'gzip',
|
||||
'bzip',
|
||||
'bzip2'
|
||||
].includes(type) || ['zip', '7z', 'tar', 'rar', 'gzip', 'bzip', 'bzip2'].includes(ext):
|
||||
case archive.test(type) || archive.test(ext):
|
||||
result = FileType.Archive;
|
||||
break;
|
||||
case 'pdf' == type || 'pdf' == ext:
|
||||
result = FileType.Pdf;
|
||||
break;
|
||||
case ['application/pgp-signature', 'application/pgp-keys'].includes(mimeType) ||
|
||||
case [app+'pgp-signature', app+'pgp-keys'].includes(mimeType) ||
|
||||
['asc', 'pem', 'ppk'].includes(ext):
|
||||
result = FileType.Certificate;
|
||||
break;
|
||||
case ['application/pkcs7-signature'].includes(mimeType) || 'p7s' == ext:
|
||||
case [app+'pkcs7-signature'].includes(mimeType) || 'p7s' == ext:
|
||||
result = FileType.CertificateBin;
|
||||
break;
|
||||
case match(msOffice+'.wordprocessingml') || match(openDoc+'.text') || match('vnd.ms-word')
|
||||
|
|
@ -228,6 +221,7 @@ export const FileInfo = {
|
|||
break;
|
||||
// no default
|
||||
}
|
||||
|
||||
return cache[key] = result;
|
||||
},
|
||||
|
||||
|
|
@ -270,10 +264,11 @@ export const FileInfo = {
|
|||
result[0] += '-chart-graph';
|
||||
break;
|
||||
case FileType.Pdf:
|
||||
result['icon-none', 'pdf'];
|
||||
result = ['icon-none', 'pdf'];
|
||||
break;
|
||||
// no default
|
||||
}
|
||||
|
||||
return result;
|
||||
},
|
||||
|
||||
|
|
|
|||
145
dev/External/CKEditor.js
vendored
145
dev/External/CKEditor.js
vendored
|
|
@ -1,102 +1,79 @@
|
|||
const config = {
|
||||
title: false,
|
||||
stylesSet: false,
|
||||
customConfig: '',
|
||||
contentsCss: '',
|
||||
toolbarGroups: [
|
||||
{ name: 'spec' },
|
||||
{ name: 'styles' },
|
||||
{ name: 'basicstyles', groups: ['basicstyles', 'cleanup', 'bidi'] },
|
||||
{ name: 'colors' },
|
||||
{ name: 'paragraph', groups: ['list', 'indent', 'blocks', 'align'] },
|
||||
{ name: 'links' },
|
||||
{ name: 'insert' },
|
||||
{ name: 'document', groups: ['mode', 'document', 'doctools'] },
|
||||
{ name: 'others' }
|
||||
],
|
||||
|
||||
removePlugins: 'liststyle',
|
||||
removeButtons: 'Format,Undo,Redo,Cut,Copy,Paste,Anchor,Strike,Subscript,Superscript,Image,SelectAll',
|
||||
removeDialogTabs: 'link:advanced;link:target;image:advanced;images:advanced',
|
||||
|
||||
extraPlugins: 'plain,signature',
|
||||
|
||||
allowedContent: true,
|
||||
extraAllowedContent: true,
|
||||
|
||||
fillEmptyBlocks: false,
|
||||
ignoreEmptyParagraph: true,
|
||||
disableNativeSpellChecker: false,
|
||||
|
||||
colorButton_enableAutomatic: false,
|
||||
colorButton_enableMore: true,
|
||||
|
||||
font_defaultLabel: 'Arial',
|
||||
fontSize_defaultLabel: '13',
|
||||
fontSize_sizes: '10/10px;12/12px;13/13px;14/14px;16/16px;18/18px;20/20px;24/24px;28/28px;36/36px;48/48px'
|
||||
},
|
||||
|
||||
htmlEditorLangsMap = {
|
||||
'ar_sa': 'ar-sa',
|
||||
'pt_br': 'pt-br',
|
||||
'zh_cn': 'zh-cn',
|
||||
};
|
||||
|
||||
export function createCKEditor(element)
|
||||
{
|
||||
const language = (rl.settings.get('Language') || 'en').toLowerCase(),
|
||||
noSource = !rl.settings.app('allowHtmlEditorSourceButton'),
|
||||
noBidi = !rl.settings.app('allowHtmlEditorBitiButtons');
|
||||
|
||||
if (!config.__cfgInited) {
|
||||
config.__cfgInited = true;
|
||||
htmlEditorLangsMap = {
|
||||
'ar_sa': 'ar-sa',
|
||||
'pt_br': 'pt-br',
|
||||
'zh_cn': 'zh-cn',
|
||||
};
|
||||
|
||||
if (noSource) {
|
||||
config.removeButtons += ',Source';
|
||||
}
|
||||
const editor = CKEDITOR.appendTo(element, {
|
||||
title: false,
|
||||
stylesSet: false,
|
||||
// customConfig: '',
|
||||
// contentsCss: '',
|
||||
toolbarGroups: [
|
||||
{ name: 'spec' },
|
||||
{ name: 'styles' },
|
||||
{ name: 'basicstyles', groups: ['basicstyles', 'cleanup', 'bidi'] },
|
||||
{ name: 'colors' },
|
||||
{ name: 'paragraph', groups: ['list', 'indent', 'blocks', 'align'] },
|
||||
{ name: 'links' },
|
||||
{ name: 'insert' },
|
||||
{ name: 'document', groups: ['mode', 'document', 'doctools'] },
|
||||
{ name: 'others' }
|
||||
],
|
||||
|
||||
if (noBidi) {
|
||||
config.removePlugins += ',bidi';
|
||||
}
|
||||
}
|
||||
removePlugins: 'liststyle' + (rl.settings.app('allowHtmlEditorBitiButtons') ? '' : ',bidi'),
|
||||
removeButtons: 'Format,Undo,Redo,Cut,Copy,Paste,Anchor,Strike,Subscript,Superscript,Image,SelectAll'
|
||||
+ (rl.settings.app('allowHtmlEditorSourceButton') ? '' : ',Source'),
|
||||
removeDialogTabs: 'link:advanced;link:target;image:advanced;images:advanced',
|
||||
|
||||
config.enterMode = CKEDITOR.ENTER_BR;
|
||||
config.shiftEnterMode = CKEDITOR.ENTER_P;
|
||||
extraPlugins: 'plain,signature',
|
||||
|
||||
config.language = htmlEditorLangsMap[language] || language.substr(0,2);
|
||||
allowedContent: true,
|
||||
extraAllowedContent: true,
|
||||
|
||||
if (CKEDITOR.env) {
|
||||
CKEDITOR.env.isCompatible = true;
|
||||
}
|
||||
fillEmptyBlocks: false,
|
||||
// ignoreEmptyParagraph: true,
|
||||
disableNativeSpellChecker: false,
|
||||
|
||||
const editor = CKEDITOR.appendTo(element, config);
|
||||
colorButton_enableAutomatic: false,
|
||||
// colorButton_enableMore: true,
|
||||
|
||||
font_defaultLabel: 'Arial',
|
||||
fontSize_defaultLabel: '13',
|
||||
fontSize_sizes: '10/10px;12/12px;13/13px;14/14px;16/16px;18/18px;20/20px;24/24px;28/28px;36/36px;48/48px',
|
||||
|
||||
enterMode: CKEDITOR.ENTER_BR,
|
||||
shiftEnterMode: CKEDITOR.ENTER_P,
|
||||
language: htmlEditorLangsMap[language] || language.substr(0,2)
|
||||
});
|
||||
|
||||
editor.on('key', event => !(event && event.data && 'Tab' == event.data.key));
|
||||
|
||||
if (window.FileReader) {
|
||||
editor.on('drop', event => {
|
||||
if (0 < event.data.dataTransfer.getFilesCount()) {
|
||||
const file = event.data.dataTransfer.getFile(0);
|
||||
if (file && event.data.dataTransfer.id && file.type && file.type.match(/^image/i)) {
|
||||
const id = event.data.dataTransfer.id,
|
||||
imageId = `[img=${id}]`,
|
||||
reader = new FileReader();
|
||||
editor.on('drop', event => {
|
||||
const dt = event.data.dataTransfer,
|
||||
id = dt.id,
|
||||
file = dt.getFilesCount() ? dt.getFile(0) : 0;
|
||||
if (file && id && file.type && file.type.match(/^image/i)) {
|
||||
const imageId = `[img=${id}]`,
|
||||
reader = new FileReader();
|
||||
|
||||
reader.onloadend = () => {
|
||||
if (reader.result && 'wysiwyg' === editor.mode) {
|
||||
try {
|
||||
editor.setData(editor.getData().replace(imageId, `<img src="${reader.result}"/>`));
|
||||
} catch (e) {} // eslint-disable-line no-empty
|
||||
}
|
||||
};
|
||||
|
||||
reader.readAsDataURL(file);
|
||||
|
||||
event.data.dataTransfer.setData('text/html', imageId);
|
||||
reader.onloadend = () => {
|
||||
if (reader.result && 'wysiwyg' === editor.mode) {
|
||||
try {
|
||||
editor.setData(editor.getData().replace(imageId, `<img src="${reader.result}"/>`));
|
||||
} catch (e) {} // eslint-disable-line no-empty
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
reader.readAsDataURL(file);
|
||||
|
||||
dt.setData('text/html', imageId);
|
||||
}
|
||||
});
|
||||
|
||||
return editor;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -51,22 +51,11 @@
|
|||
|
||||
.attachmentIconParent {
|
||||
|
||||
position: relative;
|
||||
|
||||
position: absolute;
|
||||
height: 56px;
|
||||
width: 60px;
|
||||
|
||||
background: none;
|
||||
|
||||
.iconPreview, .iconBG, .iconMain, .iconProgress {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
text-align: center;
|
||||
|
||||
.iconProgress {
|
||||
background: #eee;
|
||||
|
|
@ -75,21 +64,15 @@
|
|||
|
||||
.iconBG {
|
||||
font-size: 18px;
|
||||
text-align: center;
|
||||
color: #999;
|
||||
font-weight: bold;
|
||||
line-height: 55px;
|
||||
text-shadow: 0 1px 0 #fff;
|
||||
text-shadow: 0 1px 0 rgba(255, 255, 255, 0.8);
|
||||
}
|
||||
|
||||
.iconPreview {
|
||||
display: none;
|
||||
|
||||
background: #555;
|
||||
background-image: none;
|
||||
background: rgba(0, 0, 0, .5) !important;
|
||||
|
||||
color: #fff;
|
||||
text-shadow: 0 1px 0 #000;
|
||||
}
|
||||
|
|
@ -111,20 +94,15 @@
|
|||
}
|
||||
|
||||
.attachmentIcon {
|
||||
margin: 6px 0 0 13px;
|
||||
margin: 6px 0 0;
|
||||
font-size: 36px;
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
color: #aaa;
|
||||
}
|
||||
|
||||
.attachmentIcon {
|
||||
&.icon-none {
|
||||
display: none;
|
||||
}
|
||||
&.icon-file-certificate {
|
||||
margin-left: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
.attachmentIconText {
|
||||
|
|
@ -134,7 +112,6 @@
|
|||
height: 56px;
|
||||
color: #aaa;
|
||||
line-height: 56px;
|
||||
text-align: center;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
|
|
@ -146,45 +123,22 @@
|
|||
}
|
||||
*/
|
||||
|
||||
.attachmentIconParent.hasPreview:hover {
|
||||
.iconPreview {
|
||||
display: inline-block;
|
||||
}
|
||||
.iconMain {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.attachmentIconParent.hasPreplay:hover {
|
||||
.iconPreview {
|
||||
display: inline-block;
|
||||
}
|
||||
.iconMain {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.showPreview, .showPreplay {
|
||||
.showPreview, .showPreplay,
|
||||
.attachmentIconParent.hasPreview:hover .iconMain,
|
||||
.attachmentIconParent.hasPreplay:hover .iconMain,
|
||||
.attachmentIconParent.hasPreview .hidePreview,
|
||||
.attachmentIconParent.hasPreplay .hidePreview {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.attachmentIconParent.hasPreview:hover .iconPreview,
|
||||
.attachmentIconParent.hasPreplay:hover .iconPreview {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.attachmentIconParent.hasPreview .showPreview,
|
||||
.attachmentIconParent.hasPreplay .showPreview {
|
||||
display: inline;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.attachmentIconParent.hasPreview {
|
||||
.showPreview {
|
||||
display: inline;
|
||||
}
|
||||
|
||||
.hidePreview {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
.attachmentIconParent.hasPreplay {
|
||||
.showPreplay {
|
||||
display: inline;
|
||||
}
|
||||
|
||||
.hidePreview {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -43,7 +43,6 @@
|
|||
|
||||
.b-header-toolbar {
|
||||
|
||||
height: 40px;
|
||||
color: #fff;
|
||||
background-color: rgba(0,0,0,0.8);
|
||||
|
||||
|
|
|
|||
|
|
@ -7,7 +7,7 @@
|
|||
cursor: text;
|
||||
font-size: 90%;
|
||||
list-style: none;
|
||||
margin: 0 5px 0 0;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
transition: border linear .2s, box-shadow linear .2s;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -64,7 +64,7 @@
|
|||
}
|
||||
}
|
||||
|
||||
.b-list-delimiter {
|
||||
hr {
|
||||
margin: 10px;
|
||||
border-top: 0 solid #000;
|
||||
border-bottom: 1px solid #999;
|
||||
|
|
@ -175,10 +175,6 @@
|
|||
|
||||
.e-collapsed-sign {
|
||||
cursor: pointer;
|
||||
width: 22px;
|
||||
height: 30px;
|
||||
line-height: 30px;
|
||||
text-align: center;
|
||||
vertical-align: inherit;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -309,6 +309,7 @@ html.rl-no-preview-pane {
|
|||
}
|
||||
}
|
||||
|
||||
html.rl-mobile #rl-left > .resizer,
|
||||
html.rl-side-preview-pane:not(.rl-mobile) #rl-right .resizer {
|
||||
display: none !important;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -344,11 +344,6 @@ html.rl-no-preview-pane {
|
|||
margin-right: 2px;
|
||||
border: 1px solid #ccc;
|
||||
|
||||
[class^="icon-"],
|
||||
[class*=" icon-"] {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background-color: #aaa;
|
||||
border-color: #666;
|
||||
|
|
|
|||
|
|
@ -1,8 +1,4 @@
|
|||
|
||||
label {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
label.inline, span.inline {
|
||||
display: inline-block;
|
||||
}
|
||||
|
|
@ -49,12 +45,6 @@ label.inline, span.inline {
|
|||
box-shadow: none !important;
|
||||
opacity: .6;
|
||||
|
||||
[class^="icon-"] {
|
||||
width: 19px;
|
||||
height: 19px;
|
||||
font-size: 19px;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
|
@ -65,9 +55,6 @@ label.inline, span.inline {
|
|||
.caret {
|
||||
border-top-color: #BD362F;
|
||||
}
|
||||
[class^="icon-"]:before {
|
||||
color: #BD362F;
|
||||
}
|
||||
}
|
||||
|
||||
.dropdown-menu * + .dividerbar {
|
||||
|
|
@ -86,10 +73,6 @@ label.inline, span.inline {
|
|||
.caret {
|
||||
border-top-color: #BD362F;
|
||||
}
|
||||
|
||||
[class^="icon-"]:before {
|
||||
color: #BD362F;
|
||||
}
|
||||
}
|
||||
|
||||
.alert a {
|
||||
|
|
|
|||
|
|
@ -19,34 +19,11 @@
|
|||
}
|
||||
}
|
||||
|
||||
.iconsize20 {
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
/* .b-contacts-content .b-view-content */
|
||||
.iconsize24 {
|
||||
font-size: 24px;
|
||||
}
|
||||
|
||||
/* White icons with optional class, or on hover/active states of certain elements */
|
||||
.icon-white,
|
||||
.nav > .active > a > [class^="icon-"],
|
||||
.nav > .active > a > [class*=" icon-"] {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.g-ui-menu .e-item:hover [class^="icon-"],
|
||||
.g-ui-menu .e-item:hover [class*=" icon-"] {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.icon-none {
|
||||
background-image: none !important;
|
||||
}
|
||||
|
||||
.iconcolor-display-none {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.iconcolor-green {
|
||||
color: green;
|
||||
}
|
||||
|
|
@ -69,25 +46,21 @@
|
|||
border: 3px solid #aaa;
|
||||
border-top-color: #333;
|
||||
border-radius: 100%;
|
||||
}
|
||||
|
||||
&.big {
|
||||
|
||||
height: 13px;
|
||||
width: 13px;
|
||||
|
||||
margin: -1px -2px;
|
||||
.btn-success .icon-spinner {
|
||||
border-color: #fff;
|
||||
border-top-color: #999;
|
||||
&.animated {
|
||||
border-color: transparent;
|
||||
border-top-color: #fff;
|
||||
}
|
||||
}
|
||||
|
||||
&.white, &.icon-white {
|
||||
|
||||
border-color: #fff;
|
||||
border-top-color: #999;
|
||||
|
||||
&.animated {
|
||||
border-color: transparent;
|
||||
border-top-color: #fff;
|
||||
}
|
||||
}
|
||||
.btn-large .icon-spinner {
|
||||
height: 13px;
|
||||
width: 13px;
|
||||
margin: -1px -2px;
|
||||
}
|
||||
|
||||
.icon-spinner:not(.not-animated) {
|
||||
|
|
|
|||
|
|
@ -174,7 +174,7 @@ class MessageViewMailBoxUserView extends AbstractViewRight {
|
|||
viewFromDkimStatusIconClass:() => {
|
||||
switch (this.viewFromDkimData()[0]) {
|
||||
case 'none':
|
||||
return 'icon-none iconcolor-display-none';
|
||||
return '';
|
||||
case 'pass':
|
||||
return 'icon-ok iconcolor-green';
|
||||
default:
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue