mirror of
https://github.com/the-djmaze/snappymail.git
synced 2026-07-13 03:27:39 +03:00
Cleanup CSS and fix SquireUI css
This commit is contained in:
parent
39e9ecd4f2
commit
8b53b189f8
7 changed files with 33 additions and 38 deletions
|
|
@ -53,7 +53,7 @@ This fork has the following changes:
|
||||||
* CRLF => LF line endings
|
* CRLF => LF line endings
|
||||||
* Embed boot.js and boot.css into index.html
|
* Embed boot.js and boot.css into index.html
|
||||||
* Ongoing removal of old JavaScript code (things are native these days)
|
* Ongoing removal of old JavaScript code (things are native these days)
|
||||||
* Added modified Squire HTML editor as replacement for CKEditor
|
* Added modified [Squire](https://github.com/neilj/Squire) HTML editor as replacement for CKEditor
|
||||||
|
|
||||||
### Removal of old JavaScript
|
### Removal of old JavaScript
|
||||||
|
|
||||||
|
|
@ -136,7 +136,7 @@ Things might work in Edge 18, Firefox 50-62 and Chrome 54-68 due to one polyfill
|
||||||
|
|
||||||
|
|
||||||
### Squire vs CKEditor
|
### Squire vs CKEditor
|
||||||
The [squire](https://github.com/neilj/Squire) implementation is not 100% compatible yet, but is shows the massive overhead of CKEditor.
|
The [Squire](https://github.com/neilj/Squire) implementation is not 100% compatible yet, but is shows the massive overhead of CKEditor.
|
||||||
|
|
||||||
Still TODO:
|
Still TODO:
|
||||||
|
|
||||||
|
|
|
||||||
10
dev/External/SquireUI.js
vendored
10
dev/External/SquireUI.js
vendored
|
|
@ -12,7 +12,7 @@ const doc = document,
|
||||||
|
|
||||||
i18n = (str, def) => rl.i18n(str) || def,
|
i18n = (str, def) => rl.i18n(str) || def,
|
||||||
|
|
||||||
ctrlKey = /Mac OS X/.test( navigator.userAgent ) ? 'meta + ' : 'Ctrl + ',
|
ctrlKey = /Mac OS X/.test( navigator.userAgent ) ? '⌘ + ' : 'Ctrl + ',
|
||||||
|
|
||||||
getFragmentOfChildren = parent => {
|
getFragmentOfChildren = parent => {
|
||||||
let frag = doc.createDocumentFragment();
|
let frag = doc.createDocumentFragment();
|
||||||
|
|
@ -200,13 +200,13 @@ class SquireUI
|
||||||
*/
|
*/
|
||||||
inline: {
|
inline: {
|
||||||
bold: {
|
bold: {
|
||||||
html: '𝐁',
|
html: 'B',
|
||||||
cmd: () => this.doAction('bold','B'),
|
cmd: () => this.doAction('bold','B'),
|
||||||
key: 'B',
|
key: 'B',
|
||||||
hint: 'Bold'
|
hint: 'Bold'
|
||||||
},
|
},
|
||||||
italic: {
|
italic: {
|
||||||
html: '𝐼',
|
html: 'I',
|
||||||
cmd: () => this.doAction('italic','I'),
|
cmd: () => this.doAction('italic','I'),
|
||||||
key: 'I',
|
key: 'I',
|
||||||
hint: 'Italic'
|
hint: 'Italic'
|
||||||
|
|
@ -224,13 +224,13 @@ class SquireUI
|
||||||
hint: 'Strikethrough'
|
hint: 'Strikethrough'
|
||||||
},
|
},
|
||||||
sub: {
|
sub: {
|
||||||
html: 'S<sub>x</sub>',
|
html: 'Xₙ',
|
||||||
cmd: () => this.doAction('subscript','SUB'),
|
cmd: () => this.doAction('subscript','SUB'),
|
||||||
key: 'Shift + 5',
|
key: 'Shift + 5',
|
||||||
hint: 'Subscript'
|
hint: 'Subscript'
|
||||||
},
|
},
|
||||||
sup: {
|
sup: {
|
||||||
html: 'S<sup>x</sup>',
|
html: 'Xⁿ',
|
||||||
cmd: () => this.doAction('superscript','SUP'),
|
cmd: () => this.doAction('superscript','SUP'),
|
||||||
key: 'Shift + 6',
|
key: 'Shift + 6',
|
||||||
hint: 'Superscript'
|
hint: 'Superscript'
|
||||||
|
|
|
||||||
|
|
@ -34,6 +34,20 @@
|
||||||
.squire-toolgroup select[data-action="fontSize"] {
|
.squire-toolgroup select[data-action="fontSize"] {
|
||||||
width: 4em;
|
width: 4em;
|
||||||
}
|
}
|
||||||
|
.squire-toolgroup select[data-action="bold"] {
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
.squire-toolgroup select[data-action="italic"] {
|
||||||
|
font-style: italic;
|
||||||
|
}
|
||||||
|
/*
|
||||||
|
.squire-toolgroup select[data-action="underline"] {
|
||||||
|
text-decoration: underline;
|
||||||
|
}
|
||||||
|
.squire-toolgroup select[data-action="strikethrough"] {
|
||||||
|
text-decoration: line-through;
|
||||||
|
}
|
||||||
|
*/
|
||||||
|
|
||||||
.squire-wysiwyg {
|
.squire-wysiwyg {
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
|
|
|
||||||
|
|
@ -283,10 +283,6 @@ select {
|
||||||
color: #555;
|
color: #555;
|
||||||
}
|
}
|
||||||
|
|
||||||
html.no-rgba .modal {
|
|
||||||
border-width: 0 !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.modal.loginContent .modal-body, .modal.loginAdminContent .modal-body {
|
.modal.loginContent .modal-body, .modal.loginAdminContent .modal-body {
|
||||||
background-color: transparent !important;
|
background-color: transparent !important;
|
||||||
}
|
}
|
||||||
|
|
|
||||||
22
dev/boot.js
22
dev/boot.js
|
|
@ -3,8 +3,9 @@
|
||||||
|
|
||||||
const
|
const
|
||||||
doc = document,
|
doc = document,
|
||||||
html = doc.documentElement,
|
eId = id => doc.getElementById(id),
|
||||||
app = doc.getElementById('rl-app'),
|
htmlCL = doc.documentElement.classList,
|
||||||
|
app = eId('rl-app'),
|
||||||
options = app && app.dataset.boot && JSON.parse(app.dataset.boot) || {},
|
options = app && app.dataset.boot && JSON.parse(app.dataset.boot) || {},
|
||||||
|
|
||||||
Storage = type => {
|
Storage = type => {
|
||||||
|
|
@ -41,8 +42,8 @@ const
|
||||||
setTimestamp = () => storage().setItem(TIME_KEY, timestamp()),
|
setTimestamp = () => storage().setItem(TIME_KEY, timestamp()),
|
||||||
|
|
||||||
showError = () => {
|
showError = () => {
|
||||||
doc.getElementById('rl-loading').hidden = true;
|
eId('rl-loading').hidden = true;
|
||||||
doc.getElementById('rl-loading-error').hidden = false;
|
eId('rl-loading-error').hidden = false;
|
||||||
p.end();
|
p.end();
|
||||||
},
|
},
|
||||||
|
|
||||||
|
|
@ -88,7 +89,7 @@ const
|
||||||
};
|
};
|
||||||
|
|
||||||
if (!navigator || !navigator.cookieEnabled) {
|
if (!navigator || !navigator.cookieEnabled) {
|
||||||
doc.location.replace('./?/NoCookie');
|
doc.location.href = './?/NoCookie';
|
||||||
}
|
}
|
||||||
|
|
||||||
let container = doc.querySelector('.progressjs'),
|
let container = doc.querySelector('.progressjs'),
|
||||||
|
|
@ -152,7 +153,7 @@ win.__initAppData = appData => {
|
||||||
|
|
||||||
if (appData) {
|
if (appData) {
|
||||||
if (appData.NewThemeLink) {
|
if (appData.NewThemeLink) {
|
||||||
doc.getElementById('app-theme-link').href = appData.NewThemeLink;
|
eId('app-theme-link').href = appData.NewThemeLink;
|
||||||
}
|
}
|
||||||
|
|
||||||
appData.IncludeCss && writeCSS(appData.IncludeCss);
|
appData.IncludeCss && writeCSS(appData.IncludeCss);
|
||||||
|
|
@ -160,7 +161,7 @@ win.__initAppData = appData => {
|
||||||
if (appData.IncludeBackground) {
|
if (appData.IncludeBackground) {
|
||||||
const img = appData.IncludeBackground.replace('{{USER}}', rl.hash.get() || '0');
|
const img = appData.IncludeBackground.replace('{{USER}}', rl.hash.get() || '0');
|
||||||
if (img) {
|
if (img) {
|
||||||
html.classList.add('UserBackground');
|
htmlCL.add('UserBackground');
|
||||||
doc.body.style.backgroundImage = "url("+img+")";
|
doc.body.style.backgroundImage = "url("+img+")";
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
@ -217,12 +218,9 @@ Storage('session');
|
||||||
// init section
|
// init section
|
||||||
setInterval(setTimestamp, 60000); // 1m
|
setInterval(setTimestamp, 60000); // 1m
|
||||||
|
|
||||||
html.classList.add(options.mobileDevice ? 'mobile' : 'no-mobile');
|
htmlCL.add(options.mobileDevice ? 'mobile' : 'no-mobile');
|
||||||
|
|
||||||
['app-css','app-theme-link'].forEach(css => {
|
['app-css','app-theme-link'].forEach(css => eId(css).href = css.dataset.href);
|
||||||
css = doc.getElementById(css);
|
|
||||||
css.href = css.dataset.href;
|
|
||||||
});
|
|
||||||
|
|
||||||
loadScript('./?/'
|
loadScript('./?/'
|
||||||
+ (options.admin ? 'Admin' : '')
|
+ (options.admin ? 'Admin' : '')
|
||||||
|
|
|
||||||
|
|
@ -17,7 +17,7 @@
|
||||||
<link type="text/css" rel="stylesheet" data-href="{{BaseAppMainCssLink}}" id="app-css" />
|
<link type="text/css" rel="stylesheet" data-href="{{BaseAppMainCssLink}}" id="app-css" />
|
||||||
<link type="text/css" rel="stylesheet" data-href="{{BaseAppThemeCssLink}}" id="app-theme-link" />
|
<link type="text/css" rel="stylesheet" data-href="{{BaseAppThemeCssLink}}" id="app-theme-link" />
|
||||||
<link rel="manifest" href="{{BaseAppManifestLink}}" />
|
<link rel="manifest" href="{{BaseAppManifestLink}}" />
|
||||||
<script>document.append || (document.location.href = './?/BadBrowser');</script>
|
<script>document.append||document.location.replace('./?/BadBrowser');</script>
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body class="thm-body">
|
<body class="thm-body">
|
||||||
|
|
|
||||||
15
vendors/normalize.css/normalize.css
vendored
15
vendors/normalize.css/normalize.css
vendored
|
|
@ -39,13 +39,11 @@ h1 {
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 1. Add the correct box sizing in Firefox.
|
* 1. Add the correct box sizing in Firefox.
|
||||||
* 2. Show the overflow in Edge and IE.
|
|
||||||
*/
|
*/
|
||||||
|
|
||||||
hr {
|
hr {
|
||||||
box-sizing: content-box; /* 1 */
|
box-sizing: content-box; /* 1 */
|
||||||
height: 0; /* 1 */
|
height: 0; /* 1 */
|
||||||
overflow: visible; /* 2 */
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
|
@ -54,7 +52,7 @@ hr {
|
||||||
*/
|
*/
|
||||||
|
|
||||||
pre {
|
pre {
|
||||||
font-family: monospace, monospace; /* 1 */
|
font-family: monospace; /* 1 */
|
||||||
font-size: 1em; /* 2 */
|
font-size: 1em; /* 2 */
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -68,7 +66,6 @@ pre {
|
||||||
|
|
||||||
abbr[title] {
|
abbr[title] {
|
||||||
border-bottom: none; /* 1 */
|
border-bottom: none; /* 1 */
|
||||||
text-decoration: underline; /* 2 */
|
|
||||||
text-decoration: underline dotted; /* 2 */
|
text-decoration: underline dotted; /* 2 */
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -141,16 +138,6 @@ textarea {
|
||||||
margin: 0; /* 2 */
|
margin: 0; /* 2 */
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
|
||||||
* Show the overflow in IE.
|
|
||||||
* 1. Show the overflow in Edge.
|
|
||||||
*/
|
|
||||||
|
|
||||||
button,
|
|
||||||
input { /* 1 */
|
|
||||||
overflow: visible;
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Remove the inheritance of text transform in Edge, Firefox, and IE.
|
* Remove the inheritance of text transform in Edge, Firefox, and IE.
|
||||||
* 1. Remove the inheritance of text transform in Firefox.
|
* 1. Remove the inheritance of text transform in Firefox.
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue