Con cada actualización de SailfishOS es tradición aquí en
linuxleon.org el "how-to" para la modificación gráfica del gestor de correo para que no rompa las líneas de diseño del sistema. Y queda así de bonito.
1.- Activando el soporte para diseño sensible (layout responsive):
devel-su nano /usr/share/jolla-email/pages/HtmlViewer.qml
Busca:
function _updateLayout(width) {
// Respect viewport meta tag if exists
if (!hasViewportMetaTag(htmlBody)) {
// This affects only to layouts that do not have width defined in body content.
// Smaller content layout gets scaled up to WebView's width.
experimental.customLayoutWidth = width / _scale
} else {
experimental.customLayoutWidth = width
}
// reload html
loadHtml(htmlBody, "file:///usr/share/jolla-email")
}
Y reemplázalo con:
function _updateLayout(width) {
// Respect viewport meta tag if exists
// if (!hasViewportMetaTag(htmlBody)) {
// This affects only to layouts that do not have width defined in body content.
// Smaller content layout gets scaled up to WebView's width.
experimental.customLayoutWidth = width / _scale
// } else {
experimental.customLayoutWidth = 350
// }
// reload html
loadHtml(htmlBody, "file:///usr/share/jolla-email")
}
Reinicia Jolla Email para que la mayoría de los correos sean ya perfectamente legibles.
2.- Mostrando los correos electrónicos en la ventana de composición por defecto.
2.1.- Para los correos en texto plano:
devel-su nano /usr/share/jolla-email/pages/PlainTextViewer.qml
en la Línea 68 cambia el valor color de color: "white" a color: "transparent"
en la Línea 111 cambia el valor color de color: "black" a color: Theme.primaryColor
en la Línea 113 cambia el valor font.pixelSize de Theme.fontSizeSmall a Theme.fontSizeMedium y de Theme.fontSizeExtraSmall a Theme.fontSizeSmall
2.2.- Cambiando la ventana de carga de blanco a transparente:
devel-su nano /usr/share/jolla-email/pages/HtmlLoader.qml
en la Línea 127 cambia color: "white" a color: "transparent"
2.3.- Para los correos sin un background definido.
2.3.1. Modifica:
devel-su nano /usr/lib/qt5/qml/Sailfish/Silica/SilicaWebView.qml
en la Línea 125 cambia el valor a "true" o añade esta línea (como yo he tenido que hacer)
experimental.transparentBackground: true
2.3.2. Modifica el fichero htmlViewer.css para lograr una completa integración con el fondo transparente. Añade al final del fichero:
devel-su nano /usr/share/jolla-email/pages/htmlViewer.css
Que originalmente tiene este contenido:
* { overflow-wrap: break-word; }
pre { white-space: pre-wrap; }
img[nemo-inline-image-loading=no] {
margin-right: 6px;
margin-bottom: 4px;
}
img[nemo-inline-image-loading=yes] {
margin-right: 6px;
margin-bottom: 4px;
max-width: 30px;
max-height: 30px;
content: url('file:///usr/share/jolla-email/images/spinner.gif');
}
De forma que completo quede así:
* { overflow-wrap: break-word; }
pre { white-space: pre-wrap; }
img[nemo-inline-image-loading=no] {
margin-right: 6px;
margin-bottom: 4px;
}
img[nemo-inline-image-loading=yes] {
margin-right: 6px;
margin-bottom: 4px;
max-width: 30px;
max-height: 30px;
content: url('file:///usr/share/jolla-email/images/spinner.gif');
}
/*--------------------------------------------------------------------------------------------------------------------------*/
/* Browser Background */
browser[type="content-primary"]
{
background-color: transparent !important;
}
/*No background images. try to exclude icons, other misc items. */
*:not(:empty):not([onclick*="open"]):not(span):not([class*="stars"]):not([id*="stars"]):not([id="rating"]):not([class="rating"]):not([class*="prite"]):not([id*="prite"]):not([id*="lbImage"])
{
background-image: none !important;
}
/* Basic Bodies */
html,
body
{
background: none transparent !important;
}
/* Make descendents of the body element transparent. Formerly "DIV + SPAN" rules. */
body *
{
background-color: transparent !important;
}
/*::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/
/* Universal - sets color of text, border */
* {
color: #CCC !important;
border-color: #444 !important;
outline-color: #444 !important;
text-shadow: none !important;
}
html *:after,
html *:before {
color: #CCC !important;
border-color: #666 !important;
background: none transparent !important;
}
/* Link */
a:link,
a:link *:not(img){
color: #B1CBF7 !important;
background-color: transparent !important;
border-color: #666 !important;}
a:visited,
a:visited * {
color: #CDB4E7 !important;
}
a:hover,
a:hover *:not(img){
color: #FFE900 !important;
background-color: transparent !important;
border-color: #999 !important;
}
html [href*="#"]:hover {
color: #FFE900 !important;
background-color: transparent !important;
}
/* Event Handlers/Attributes */
[onclick],
[ondblclick],
[onmousedown] {
color: #DFD5BC !important;
text-indent: 0 !important;
}
[onclick]:hover,
[ondblclick]:hover,
[onmousedown]:hover {
color: #FEFF97 !important;
}
/* Make images transparent */
img {
opacity: .75 !important;
}
img:hover {
opacity: 1 !important;
background-color: transparent !important;
}
svg {
background: none #666 !important;
}
/* Highlight */
::-moz-selection {
background-color: transparent !important;
color: #F6F7B9 !important;
}
O sustitúyelo por el fichero ya modificado que te dejo a continuación:
Copia de seguridad de ese fichero por si no te gusta el resultado:
Una aplicación de correo completamente rediseñada para mejor.
