mirror of
https://github.com/the-djmaze/snappymail.git
synced 2024-12-27 09:36:09 +08:00
Improved "View in separate window" with theme colors
This commit is contained in:
parent
803113568f
commit
9d8325d5a8
2 changed files with 22 additions and 41 deletions
|
@ -1,31 +1,24 @@
|
|||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8"/>
|
||||
<meta name="viewport" content="user-scalable=no"/>
|
||||
<title>{{subject}}</title>
|
||||
<title></title>
|
||||
<style>
|
||||
html, body {
|
||||
background-color: #fff;
|
||||
color: #000;
|
||||
font-size: 13px;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
header {
|
||||
background: #eee;
|
||||
border-bottom: 1px solid #ccc;
|
||||
padding: 0 15px;
|
||||
background: rgba(125,128,128,0.3);
|
||||
border-bottom: 1px solid #888;
|
||||
}
|
||||
|
||||
header h1 {
|
||||
font-size: 16px;
|
||||
margin: 0;
|
||||
font-size: 120%;
|
||||
}
|
||||
|
||||
header * {
|
||||
font-size: 12px;
|
||||
padding: 5px 0;
|
||||
margin: 5px 0;
|
||||
}
|
||||
|
||||
header time {
|
||||
|
@ -33,30 +26,21 @@ header time {
|
|||
}
|
||||
|
||||
blockquote {
|
||||
border-left: 2px solid black;
|
||||
border-left: 2px solid rgba(125,128,128,0.5);
|
||||
margin: 0;
|
||||
padding: 0 10px;
|
||||
padding: 0 0 0 10px;
|
||||
}
|
||||
|
||||
pre, .body-wrp.plain {
|
||||
pre {
|
||||
white-space: pre-wrap;
|
||||
word-wrap: break-word;
|
||||
word-break: normal;
|
||||
}
|
||||
|
||||
.body-wrp {
|
||||
padding: 15px;
|
||||
body > * {
|
||||
padding: 0.5em 1em;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
<h1>{{subject}}</h1>
|
||||
<time>{{date}}</time>
|
||||
<div>{{fromCreds}}</div>
|
||||
<div>{{toLabel}}: {{toCreds}}</div>
|
||||
<div {{ccHide}}>{{ccLabel}}: {{ccCreds}}</div>
|
||||
</header>
|
||||
<div class="body-wrp {{bodyClass}}">{{html}}</div>
|
||||
</body>
|
||||
<body></body>
|
||||
</html>
|
||||
|
|
|
@ -491,21 +491,18 @@ export class MessageModel extends AbstractModel {
|
|||
ccLine = this.ccToLine(false),
|
||||
m = 0 < timeStampInUTC ? new Date(timeStampInUTC * 1000) : null,
|
||||
win = open(''),
|
||||
doc = win.document;
|
||||
doc.write(PreviewHTML
|
||||
.replace(/{{subject}}/g, encodeHtml(this.subject()))
|
||||
.replace('{{date}}', encodeHtml(m ? m.format('LLL') : ''))
|
||||
.replace('{{fromCreds}}', encodeHtml(this.fromToLine(false)))
|
||||
.replace('{{toCreds}}', encodeHtml(this.toToLine(false)))
|
||||
.replace('{{toLabel}}', encodeHtml(i18n('GLOBAL/TO')))
|
||||
.replace('{{ccHide}}', ccLine ? '' : 'hidden=""')
|
||||
.replace('{{ccCreds}}', encodeHtml(ccLine))
|
||||
.replace('{{ccLabel}}', encodeHtml(i18n('GLOBAL/CC')))
|
||||
.replace('{{bodyClass}}', this.isHtml() ? 'html' : 'plain')
|
||||
.replace('{{html}}', this.bodyAsHTML())
|
||||
sdoc = win.document;
|
||||
let subject = encodeHtml(this.subject()),
|
||||
mode = this.isHtml() ? 'div' : 'pre',
|
||||
cc = ccLine ? `<div>${encodeHtml(i18n('GLOBAL/CC'))}: ${encodeHtml(ccLine)}</div>` : '',
|
||||
style = getComputedStyle(doc.querySelector('.messageView')),
|
||||
prop = property => style.getPropertyValue(property);
|
||||
sdoc.write(PreviewHTML
|
||||
.replace('<title>', '<title>'+subject)
|
||||
// eslint-disable-next-line max-len
|
||||
.replace('<body>', `<body style="background-color:${prop('background-color')};color:${prop('color')}"><header><h1>${subject}</h1><time>${encodeHtml(m ? m.format('LLL') : '')}</time><div>${encodeHtml(this.fromToLine(false))}</div><div>${encodeHtml(i18n('GLOBAL/TO'))}: ${encodeHtml(this.toToLine(false))}</div>${cc}</header><${mode}>${this.bodyAsHTML()}</${mode}>`)
|
||||
);
|
||||
|
||||
doc.close();
|
||||
sdoc.close();
|
||||
|
||||
if (print) {
|
||||
setTimeout(() => win.print(), 100);
|
||||
|
|
Loading…
Reference in a new issue