rewrite of theme to make it easier to maintain and follow guidelines for custom changes; switched icons to LineAwesome; Additional tweaks to dark theme; Ready for rc version 1.5.2
This commit is contained in:
parent
a6316690bf
commit
da7e792465
|
@ -0,0 +1,4 @@
|
|||
styles/styles.css
|
||||
styles/print.css
|
||||
styles/embed.css
|
||||
deps/*
|
|
@ -1,5 +1,5 @@
|
|||
Roundcube Webmail Skin "Elastic Disroot Flavor"
|
||||
===============================================
|
||||
Roundcube Webmail Skin "Elastic"
|
||||
================================
|
||||
|
||||
This skin package contains a theme for the Roundcube Webmail
|
||||
software. It can be used, modified and redistributed according to
|
||||
|
@ -41,7 +41,7 @@ The plugin can be installed using `npm install less-plugin-clean-css`)
|
|||
References to image files from the included CSS files can be appended
|
||||
with cache-buster marks to avoid browser caching issues after updating.
|
||||
|
||||
Run `bin/updatecss.sh --dir skins/disroot` before packaging the skin
|
||||
Run `bin/updatecss.sh --dir skins/elastic` before packaging the skin
|
||||
or after installing it on the destination system.
|
||||
|
||||
|
||||
|
|
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
After Width: | Height: | Size: 153 KiB |
|
@ -1,7 +1,7 @@
|
|||
{
|
||||
"name": "Beetroot (elastic)",
|
||||
"extends": "elastic",
|
||||
"author": "meaz of Disroot (and Aleksander Machniak - elastic)",
|
||||
"author": "muppeth & meaz of Disroot.org (based on Aleksander Machniak's - elastic)",
|
||||
"license": "Creative Commons Attribution-ShareAlike",
|
||||
"license-url": "http://creativecommons.org/licenses/by-sa/3.0/",
|
||||
"config": {
|
||||
|
|
|
@ -0,0 +1,46 @@
|
|||
// Beetroot and Darkbeet colors
|
||||
@color-main: #50162d;
|
||||
@color-link: #bd139a;
|
||||
@color-success: #50162d;
|
||||
@color-warning: #F6609D;
|
||||
@color-link-secondary: lighten(@color-font, 60%);
|
||||
@color-layout-header-background: #50162d;
|
||||
|
||||
// Task menu
|
||||
@color-taskmenu-background: #50162d;
|
||||
@color-taskmenu-button-action: #E0548D;
|
||||
@color-taskmenu-button-special: @color-taskmenu-button;
|
||||
@color-taskmenu-button-special-background: @color-taskmenu-background;
|
||||
@color-taskmenu-button-action-hover: #fff;
|
||||
@color-taskmenu-button-special-hover: lighten(@color-taskmenu-button-special, 10%);
|
||||
// @color-taskmenu-button-special-background-hover:lighten(@color-taskmenu-button-special-background, 10%);
|
||||
|
||||
// Toolbar
|
||||
@color-toolbar-button-background-hover: lighten(@color-layout-header-background, 10%);
|
||||
@color-searchbar-icon-active: green;
|
||||
|
||||
// Popovers (menus)
|
||||
@color-popover-header: @color-black-shade-text;
|
||||
@color-popover-header-background: transparent;
|
||||
|
||||
//Forms
|
||||
@color-btn-secondary-background: lighten(@color-main, 10%);
|
||||
|
||||
// Dark mode colors
|
||||
@color-dark-main: darken(@color-main, 10%);
|
||||
@color-dark-background: #252121;
|
||||
@color-dark-font: #DDDDDD;
|
||||
@color-dark-border: #292525;
|
||||
@color-dark-taskmenu-button-action: #4F8F93;
|
||||
@color-dark-taskmenu-button-action-hover: @color-dark-font;
|
||||
|
||||
@color-dark-list-selected: #FFFFFF;
|
||||
@color-dark-list-selected-background: #50162D;
|
||||
@color-dark-list-droptarget-background: #353131;
|
||||
@color-dark-list-border: #353131;
|
||||
@color-dark-input-border: #292525;
|
||||
@color-dark-input-addon-background: #292525;
|
||||
@color-dark-popover-background: #201c1c;
|
||||
@color-dark-popover-border: #50162d;
|
||||
|
||||
|
|
@ -0,0 +1,34 @@
|
|||
// Darkbeet modifications based on elastic skin
|
||||
@import "_darkc";
|
||||
|
||||
html.dark-mode {
|
||||
.tox {
|
||||
.tox-edit-area__iframe {
|
||||
background-color: @color-dark-popover-background;
|
||||
color: white;
|
||||
}
|
||||
.mce-content-body {
|
||||
color: white;
|
||||
}
|
||||
}
|
||||
#taskmenu {
|
||||
a {
|
||||
&.selected {
|
||||
color: white;
|
||||
background-color: @color-dark-list-selected-background;
|
||||
}
|
||||
}
|
||||
.action-buttons a {
|
||||
color: white;
|
||||
}
|
||||
}
|
||||
.menu
|
||||
a.compose::before {
|
||||
color: white;
|
||||
}
|
||||
#layout > div > .header,
|
||||
#layout-menu {
|
||||
background-color: @color-dark-popover-background;
|
||||
border: unset;
|
||||
}
|
||||
}
|
|
@ -0,0 +1,2 @@
|
|||
|
||||
@color-font: blue;
|
|
@ -1,24 +1,27 @@
|
|||
/* Here you can put your custom styles that will be appended to the output css file */
|
||||
|
||||
/* top bar text in white */
|
||||
//Modification for Beetroot based on Elastic skin
|
||||
//
|
||||
@import "_colors";
|
||||
|
||||
#layout > div > .header {
|
||||
color: #fff;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.menu.toolbar a {
|
||||
color: #fff;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
|
||||
#layout > div > .header a.button {
|
||||
color: #fff;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
|
||||
/* login page */
|
||||
|
||||
.task-login #logo {
|
||||
filter: invert(91%) sepia(52%) saturate(2742%) hue-rotate(312deg) brightness(95%) contrast(93%);
|
||||
filter: invert(91%) sepia(52%) saturate(2742%) hue-rotate(312deg) brightness(95%) contrast(93%);
|
||||
}
|
||||
|
||||
& when (@dark-mode-enabled = true) {
|
||||
@import "_dark";
|
||||
}
|
||||
|
|
|
@ -0,0 +1,49 @@
|
|||
// Variables for custom Darkbeet/Beetroot theme based on Elastic skin
|
||||
|
||||
@import "_colors";
|
||||
|
||||
@dark-mode-enabled: true; // on change also have to change dark_mode_support in meta.json
|
||||
|
||||
@screen-width-large: 1200px;
|
||||
@screen-width-medium: 1024px;
|
||||
@screen-width-small: 768px;
|
||||
@screen-width-xs: 480px;
|
||||
@screen-width-mini: 320px;
|
||||
@screen-width-touch: @screen-width-medium;
|
||||
@screen-width-bs-phone: 576px;
|
||||
|
||||
@page-font-size: 14px;
|
||||
@page-min-width: 240px;
|
||||
|
||||
// Note: we'll set some values in pixels instead of rem to eliminate
|
||||
// Firefox sub-pixel rendering bug(s)
|
||||
|
||||
@layout-menu-width: floor(5.6 * @page-font-size);
|
||||
@layout-menu-width-sm: floor(3 * @page-font-size);
|
||||
@layout-header-height: floor(4.2 * @page-font-size);
|
||||
@layout-footer-height: @layout-header-height;
|
||||
@layout-footer-small-height: floor(2.5 * @page-font-size);
|
||||
@layout-header-font-size: 1rem;
|
||||
@layout-searchbar-height: floor(2.6 * @page-font-size);
|
||||
|
||||
@layout-touch-header-height: @layout-header-height;
|
||||
@layout-touch-header-font-size: floor(1.2 * @page-font-size);
|
||||
@layout-touch-menu-record-height: floor(3.4 * @page-font-size);
|
||||
@layout-touch-menu-record-font-size: floor(1.2 * @page-font-size);
|
||||
@layout-touch-icon-width: 2.2em;
|
||||
|
||||
@layout-mobile-menu-width: (@screen-width-mini * .85);
|
||||
|
||||
@layout-contact-icon-width: 112px;
|
||||
@layout-contact-icon-height: 135px;
|
||||
|
||||
@listing-line-height: floor(2.5 * @page-font-size);
|
||||
@listing-touch-line-height: floor(3.4 * @page-font-size);
|
||||
@listing-treetoggle-width: 1.5em;
|
||||
|
||||
@mail-header-photo-height: 4rem;
|
||||
|
||||
// Additional icons
|
||||
@icon-resize-corner: data-uri("image/svg+xml;charset=utf-8", "../images/corner-handle.svg"); // size: 16x16
|
||||
@icon-file-drop: data-uri("image/svg+xml;charset=utf-8", "../images/download.svg");
|
||||
|
|
@ -9,18 +9,17 @@
|
|||
* See http://creativecommons.org/licenses/by-sa/3.0/ for details.
|
||||
*/
|
||||
|
||||
@color-main: #50162d; //#37beff;
|
||||
@color-main: #37beff;
|
||||
@color-main-dark: darken(@color-main, 35%);
|
||||
@color-black: #161b1d;
|
||||
@color-font: lighten(@color-black, 10%);
|
||||
@color-link: #bd139a; //#00acff;
|
||||
@color-link: #00acff;
|
||||
@color-link-hover: darken(@color-link, 10%);
|
||||
@color-border: #ddd;
|
||||
@color-error: #ff5552;
|
||||
@color-success: #50162d; //#41b849;
|
||||
@color-warning: #F6609D; //#ffd452;
|
||||
@color-success: #41b849;
|
||||
@color-warning: #ffd452;
|
||||
|
||||
@color-link-secondary: lighten(@color-font, 60%);
|
||||
@color-black-shade-text: tint(@color-black, 40%);
|
||||
@color-black-shade-border: lighten(@color-black, 75%);
|
||||
@color-black-shade-bg: lighten(@color-black, 85%);
|
||||
|
@ -32,40 +31,35 @@
|
|||
@color-layout-sidebar-background: #fff;
|
||||
@color-layout-list-background: #fff;
|
||||
@color-layout-content-background: #fff;
|
||||
@color-layout-header-background: #50162d; //#f4f4f4;
|
||||
@color-layout-header-background: #f4f4f4;
|
||||
@color-layout-footer-background: #fff;
|
||||
|
||||
@color-layout-mobile-header-background: @color-layout-header-background;
|
||||
@color-layout-mobile-footer-background: @color-layout-header-background;
|
||||
|
||||
// Task menu
|
||||
@color-taskmenu-background: #50162d; //#2f3a3f;
|
||||
@color-taskmenu-background: #2f3a3f;
|
||||
@color-taskmenu-button: #fff;
|
||||
@color-taskmenu-button-selected: @color-taskmenu-button;
|
||||
@color-taskmenu-button-action: #E0548D; //@color-main;
|
||||
@color-taskmenu-button-special: @color-taskmenu-button;
|
||||
@color-taskmenu-button-action: @color-main;
|
||||
|
||||
@color-taskmenu-button-selected-background: lighten(@color-taskmenu-background, 10%);
|
||||
@color-taskmenu-button-action-background: transparent;
|
||||
@color-taskmenu-button-special-background: @color-taskmenu-background;
|
||||
|
||||
@color-taskmenu-button-hover: #fff;
|
||||
@color-taskmenu-button-selected-hover: #fff;
|
||||
@color-taskmenu-button-action-hover: #fff; //@color-main;
|
||||
@color-taskmenu-button-special-hover: lighten(@color-taskmenu-button-special, 10%);
|
||||
@color-taskmenu-button-action-hover: @color-main;
|
||||
|
||||
@color-taskmenu-button-background-hover: lighten(@color-taskmenu-background, 10%);
|
||||
@color-taskmenu-button-action-background-hover: @color-taskmenu-button-background-hover;
|
||||
// @color-taskmenu-button-special-background-hover:lighten(@color-taskmenu-button-special-background, 10%);
|
||||
@color-taskmenu-button-logout: @color-error;
|
||||
@color-taskmenu-button-logout-hover: @color-error;
|
||||
|
||||
|
||||
// Toolbar
|
||||
@color-toolbar-button: @color-font;
|
||||
@color-toolbar-button-background-hover: lighten(@color-layout-header-background, 10%); //darken(@color-layout-header-background, 3%);
|
||||
@color-toolbar-button-background-hover: darken(@color-layout-header-background, 3%);
|
||||
|
||||
@color-searchbar-icon-active: green;
|
||||
@color-searchbar-background: #fbfbfb;
|
||||
|
||||
// Toolbar menu
|
||||
|
@ -131,8 +125,6 @@
|
|||
|
||||
|
||||
// Popovers (menus)
|
||||
@color-popover-header: @color-black-shade-text;
|
||||
@color-popover-header-background: transparent;
|
||||
@color-popover-shadow: @color-black-shade-bg;
|
||||
@color-popover-separator: @color-black-shade-text;
|
||||
@color-popover-separator-background: @color-black-shade-bg;
|
||||
|
@ -173,7 +165,7 @@
|
|||
@color-image-upload-background: #f4f4f4;
|
||||
|
||||
@color-btn-secondary: #fff;
|
||||
@color-btn-secondary-background: lighten(@color-main, 10%); //lighten(@color-black, 50%);
|
||||
@color-btn-secondary-background: lighten(@color-black, 50%);
|
||||
@color-btn-primary: #fff;
|
||||
@color-btn-primary-background: @color-main;
|
||||
@color-btn-danger: #fff;
|
||||
|
@ -224,6 +216,11 @@
|
|||
@color-image-tools-hover: fadeout(@color-main, 50%);
|
||||
|
||||
|
||||
// Scrollbars
|
||||
@color-scrollbar-thumb: #c1c1c1;
|
||||
@color-scrollbar-track: #f1f1f1;
|
||||
|
||||
|
||||
// Dark mode colors
|
||||
@color-dark-main: darken(@color-main, 30%);
|
||||
@color-dark-background: #21292c;
|
||||
|
@ -235,10 +232,7 @@
|
|||
@color-dark-warning: shade(@color-warning, 40%);
|
||||
@color-dark-error: shade(@color-error, 40%);
|
||||
|
||||
@color-dark-taskmenu-button-action: #E0548D;
|
||||
@color-dark-taskmenu-button-action-hover: @color-dark-font;
|
||||
|
||||
@color-dark-list-selected: #8EB726; //"@color-main;
|
||||
@color-dark-list-selected: @color-main;
|
||||
@color-dark-list-selected-background: #374549;
|
||||
@color-dark-list-badge: lighten(@color-dark-font, 10%);
|
||||
@color-dark-list-badge-background: @color-dark-border;
|
||||
|
|
|
@ -12,34 +12,41 @@
|
|||
@import (reference) "variables";
|
||||
|
||||
html.dark-mode {
|
||||
scrollbar-color: @color-dark-scrollbar-thumb @color-dark-scrollbar-track;
|
||||
scrollbar-width: thin;
|
||||
& when not (@scrollbar-dark-width = unset) {
|
||||
scrollbar-color: @color-dark-scrollbar-thumb @color-dark-scrollbar-track;
|
||||
scrollbar-width: @scrollbar-dark-width;
|
||||
|
||||
textarea,
|
||||
select,
|
||||
.popover-body,
|
||||
.popupmenu,
|
||||
.ui-dialog-content,
|
||||
.frame-content,
|
||||
.formcontent,
|
||||
.table-responsive,
|
||||
.table-responsive-sm,
|
||||
.scroller {
|
||||
// Firefox does not inherit scrollbar size from the html element
|
||||
scrollbar-width: thin;
|
||||
}
|
||||
|
||||
&:not(.touch) {
|
||||
::-webkit-scrollbar {
|
||||
width: 6px;
|
||||
textarea,
|
||||
select,
|
||||
.popover-body,
|
||||
.popupmenu,
|
||||
.ui-dialog-content,
|
||||
.frame-content,
|
||||
.formcontent,
|
||||
.table-responsive,
|
||||
.table-responsive-sm,
|
||||
.scroller {
|
||||
// Firefox does not inherit scrollbar size from the html element
|
||||
scrollbar-width: @scrollbar-dark-width;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track {
|
||||
background-color: @color-dark-border;
|
||||
}
|
||||
&:not(.touch) {
|
||||
::-webkit-scrollbar when (@scrollbar-dark-width = auto) {
|
||||
// Note: If we do not set the width a default scrollbar is used in Chrome.
|
||||
// And the custom colors set below do not work
|
||||
width: 12px;
|
||||
}
|
||||
::-webkit-scrollbar when (@scrollbar-dark-width = thin) {
|
||||
width: 6px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
background-color: @color-dark-main;
|
||||
::-webkit-scrollbar-track {
|
||||
background-color: @color-dark-scrollbar-track;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
background-color: @color-dark-scrollbar-thumb;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -197,10 +204,7 @@ html.dark-mode {
|
|||
|
||||
#taskmenu {
|
||||
.action-buttons a {
|
||||
color: @color-dark-taskmenu-button-action;
|
||||
}
|
||||
.action-buttons a:hover {
|
||||
color: @color-dark-taskmenu-button-action-hover;
|
||||
color: @color-main;
|
||||
}
|
||||
|
||||
a {
|
||||
|
@ -270,6 +274,7 @@ html.dark-mode {
|
|||
// Lists
|
||||
// ---------------------------------
|
||||
|
||||
.proplist li.with-sublist > a.dropdown,
|
||||
.listing tbody td,
|
||||
.listing tbody td a,
|
||||
.listing li a {
|
||||
|
@ -776,7 +781,7 @@ html.dark-mode {
|
|||
}
|
||||
|
||||
.tox-menu {
|
||||
scrollbar-width: thin;
|
||||
scrollbar-width: @scrollbar-dark-width;
|
||||
background-color: @color-dark-popover-background;
|
||||
border-color: @color-dark-popover-border;
|
||||
box-shadow: none;
|
||||
|
@ -784,7 +789,7 @@ html.dark-mode {
|
|||
|
||||
.tox-dialog__body-nav,
|
||||
.tox-collection__group {
|
||||
scrollbar-width: thin;
|
||||
scrollbar-width: @scrollbar-dark-width;
|
||||
}
|
||||
|
||||
.tox-collection__item-caret svg {
|
||||
|
@ -980,7 +985,7 @@ html.dark-mode {
|
|||
}
|
||||
|
||||
.ui-menu {
|
||||
scrollbar-width: thin;
|
||||
scrollbar-width: @scrollbar-dark-width;
|
||||
background-color: @color-dark-popover-background;
|
||||
border-color: @color-dark-popover-border;
|
||||
box-shadow: none;
|
||||
|
|
|
@ -1 +1 @@
|
|||
.popover,.rcmail-inline-message,body,button,input,optgroup,select,textarea{font-family:Roboto,sans-serif}@font-face{font-family:Icons;font-style:normal;font-weight:900;src:url(../fonts/fa-solid-900.woff2) format('woff2'),url(../fonts/fa-solid-900.woff) format('woff')}@font-face{font-family:Icons;font-style:normal;font-weight:400;src:url(../fonts/fa-regular-400.woff2) format('woff2'),url(../fonts/fa-regular-400.woff) format('woff')}@font-face{font-family:Roboto;font-style:normal;font-weight:400;src:local('Roboto'),local('Roboto-Regular'),url(../fonts/roboto-v19-regular.woff2) format('woff2'),url(../fonts/roboto-v19-regular.woff) format('woff')}@font-face{font-family:Roboto;font-style:italic;font-weight:400;src:local('Roboto Italic'),local('Roboto-Italic'),url(../fonts/roboto-v19-italic.woff2) format('woff2'),url(../fonts/roboto-v19-italic.woff) format('woff')}@font-face{font-family:Roboto;font-style:normal;font-weight:700;src:local('Roboto Bold'),local('Roboto-Bold'),url(../fonts/roboto-v19-regular-700.woff2) format('woff2'),url(../fonts/roboto-v19-regular-700.woff) format('woff')}@font-face{font-family:Roboto;font-style:italic;font-weight:700;src:local('Roboto Bold Italic'),local('Roboto-BoldItalic'),url(../fonts/roboto-v19-italic-700.woff2) format('woff2'),url(../fonts/roboto-v19-italic-700.woff) format('woff')}button,input,select,textarea{line-height:initial}input{vertical-align:middle}a{color:#00acff}a:hover{color:#008acc}a.disabled{pointer-events:none}a.disabled:not(.btn){opacity:.5}.mce-content-body{margin:4px;color:#2c363a}.mce-content-body div.pre{font-family:monospace}.mce-content-body blockquote{border-left:#1010ff 2px solid;margin:0;padding:0 .4em}.rcmail-inline-message{font-size:14px;padding:.5em;margin:0 0 .5em;opacity:.95;color:#2c363a;background-color:rgba(255,212,82,.2);display:flex;align-items:center}.rcmail-inline-message:before{display:block;float:left;margin:0 .3em 0 0;height:1em;font-family:Icons;font-style:normal;font-weight:900;text-decoration:inherit;text-align:center;speak:none;font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-size:1.5em;line-height:1;width:1em;content:"\f071";color:#ffd452}.rcmail-inline-message span{line-height:1.5}.rcmail-inline-message a{color:#00acff}.rcmail-inline-message a:hover{color:#008acc}.rcmail-inline-message button{vertical-align:middle;white-space:nowrap;padding:.375em .75em;margin-left:.5em;font-size:1em;line-height:1.5;border-radius:.25em;border:1px solid transparent;color:#fff;background:#37beff}.rcmail-inline-message button:focus{box-shadow:0 0 0 .2rem rgba(55,190,255,.5)}.rcmail-inline-message button:hover{background:#0eb1ff;border-color:#04adff}.rcmail-inline-message button:not([disabled]):not(.disabled):active{background:#00abfe;border-color:#00a4f4;box-shadow:0 0 0 .2rem rgba(55,190,255,.53)}.rcmail-inline-buttons{margin:0}
|
||||
.popover,.rcmail-inline-message,body,button,input,optgroup,select,textarea{font-family:Roboto,sans-serif}html,html .formcontent,html .frame-content,html .popover-body,html .popupmenu,html .scroller,html .table-responsive,html .table-responsive-sm,html .ui-dialog-content,html select,html textarea{scrollbar-width:thin}@font-face{font-family:Icons;font-style:normal;font-weight:900;src:url(../fonts/la-solid-900.woff2) format('woff2'),url(../fonts/la-solid-900.woff) format('woff')}@font-face{font-family:Icons;font-style:normal;font-weight:400;src:url(../fonts/la-regular-400.woff2) format('woff2'),url(../fonts/la-regular-400.woff) format('woff')}@font-face{font-family:Roboto;font-style:normal;font-weight:400;src:local('Roboto'),local('Roboto-Regular'),url(../fonts/roboto-v29-regular.woff2) format('woff2'),url(../fonts/roboto-v29-regular.woff) format('woff')}@font-face{font-family:Roboto;font-style:italic;font-weight:400;src:local('Roboto Italic'),local('Roboto-Italic'),url(../fonts/roboto-v29-italic.woff2) format('woff2'),url(../fonts/roboto-v29-italic.woff) format('woff')}@font-face{font-family:Roboto;font-style:normal;font-weight:700;src:local('Roboto Bold'),local('Roboto-Bold'),url(../fonts/roboto-v29-regular-700.woff2) format('woff2'),url(../fonts/roboto-v29-regular-700.woff) format('woff')}@font-face{font-family:Roboto;font-style:italic;font-weight:700;src:local('Roboto Bold Italic'),local('Roboto-BoldItalic'),url(../fonts/roboto-v29-italic-700.woff2) format('woff2'),url(../fonts/roboto-v29-italic-700.woff) format('woff')}button,input,select,textarea{line-height:initial}input{vertical-align:middle}a{color:#bd139a}a:hover{color:#8f0e74}a.disabled{pointer-events:none}a.disabled:not(.btn){opacity:.5}html{scrollbar-color:#c1c1c1 #f1f1f1}html:not(.touch) ::-webkit-scrollbar{width:6px}html:not(.touch) ::-webkit-scrollbar-track{background-color:#f1f1f1}html:not(.touch) ::-webkit-scrollbar-thumb{background-color:#c1c1c1}.mce-content-body{margin:4px;color:#2c363a}.mce-content-body div.pre{font-family:monospace}.mce-content-body blockquote{border-left:#1010ff 2px solid;margin:0;padding:0 .4em}.rcmail-inline-message{font-size:14px;padding:.5em;margin:0 0 .5em;opacity:.95;color:#2c363a;background-color:rgba(246,96,157,.2);display:flex;align-items:center}.rcmail-inline-message:before{display:block;float:left;margin:0 .3em 0 0;height:1em;font-family:Icons;font-style:normal;font-weight:900;text-decoration:inherit;text-align:center;speak:none;font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-size:1.5em;line-height:1;width:1em;content:"\f071";color:#F6609D}.rcmail-inline-message span{line-height:1.5}.rcmail-inline-message a{color:#bd139a}.rcmail-inline-message a:hover{color:#8f0e74}.rcmail-inline-message button{vertical-align:middle;white-space:nowrap;padding:.375em .75em;margin-left:.5em;font-size:1em;line-height:1.5;border-radius:.25em;border:1px solid transparent;color:#fff;background:#50162d}.rcmail-inline-message button:focus{box-shadow:0 0 0 .2rem rgba(80,22,45,.5)}.rcmail-inline-message button:hover{background:#300d1b;border-color:#280b17}.rcmail-inline-message button:not([disabled]):not(.disabled):active{background:#240a14;border-color:#1c0810;box-shadow:0 0 0 .2rem rgba(80,22,45,.53)}.rcmail-inline-buttons{margin:0}
|
|
@ -18,16 +18,16 @@
|
|||
font-family: 'Icons';
|
||||
font-style: normal;
|
||||
font-weight: 900;
|
||||
src: url("../fonts/fa-solid-900.woff2") format('woff2'),
|
||||
url("../fonts/fa-solid-900.woff") format('woff');
|
||||
src: url("../fonts/la-solid-900.woff2") format('woff2'),
|
||||
url("../fonts/la-solid-900.woff") format('woff');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Icons';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
src: url("../fonts/fa-regular-400.woff2") format('woff2'),
|
||||
url("../fonts/fa-regular-400.woff") format('woff');
|
||||
src: url("../fonts/la-regular-400.woff2") format('woff2'),
|
||||
url("../fonts/la-regular-400.woff") format('woff');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
|
@ -35,8 +35,8 @@
|
|||
font-style: normal;
|
||||
font-weight: 400;
|
||||
src: local('Roboto'), local('Roboto-Regular'),
|
||||
url('../fonts/roboto-v19-regular.woff2') format('woff2'), // Chrome 26+, Opera 23+, Firefox 39+
|
||||
url('../fonts/roboto-v19-regular.woff') format('woff'); // Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+
|
||||
url('../fonts/roboto-v29-regular.woff2') format('woff2'), // Chrome 26+, Opera 23+, Firefox 39+
|
||||
url('../fonts/roboto-v29-regular.woff') format('woff'); // Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+
|
||||
}
|
||||
|
||||
@font-face {
|
||||
|
@ -44,8 +44,8 @@
|
|||
font-style: italic;
|
||||
font-weight: 400;
|
||||
src: local('Roboto Italic'), local('Roboto-Italic'),
|
||||
url('../fonts/roboto-v19-italic.woff2') format('woff2'), // Chrome 26+, Opera 23+, Firefox 39+
|
||||
url('../fonts/roboto-v19-italic.woff') format('woff'); // Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+
|
||||
url('../fonts/roboto-v29-italic.woff2') format('woff2'), // Chrome 26+, Opera 23+, Firefox 39+
|
||||
url('../fonts/roboto-v29-italic.woff') format('woff'); // Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+
|
||||
}
|
||||
|
||||
@font-face {
|
||||
|
@ -53,8 +53,8 @@
|
|||
font-style: normal;
|
||||
font-weight: 700;
|
||||
src: local('Roboto Bold'), local('Roboto-Bold'),
|
||||
url('../fonts/roboto-v19-regular-700.woff2') format('woff2'), // Chrome 26+, Opera 23+, Firefox 39+
|
||||
url('../fonts/roboto-v19-regular-700.woff') format('woff'); // Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+
|
||||
url('../fonts/roboto-v29-regular-700.woff2') format('woff2'), // Chrome 26+, Opera 23+, Firefox 39+
|
||||
url('../fonts/roboto-v29-regular-700.woff') format('woff'); // Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+
|
||||
}
|
||||
|
||||
@font-face {
|
||||
|
@ -62,8 +62,8 @@
|
|||
font-style: italic;
|
||||
font-weight: 700;
|
||||
src: local('Roboto Bold Italic'), local('Roboto-BoldItalic'),
|
||||
url('../fonts/roboto-v19-italic-700.woff2') format('woff2'), // Chrome 26+, Opera 23+, Firefox 39+
|
||||
url('../fonts/roboto-v19-italic-700.woff') format('woff'); // Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+
|
||||
url('../fonts/roboto-v29-italic-700.woff2') format('woff2'), // Chrome 26+, Opera 23+, Firefox 39+
|
||||
url('../fonts/roboto-v29-italic-700.woff') format('woff'); // Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+
|
||||
}
|
||||
|
||||
/* Reset some Bootstrap style */
|
||||
|
@ -95,3 +95,43 @@ a {
|
|||
opacity: .5;
|
||||
}
|
||||
}
|
||||
|
||||
/* Scrollbar styles */
|
||||
|
||||
html when not (@scrollbar-width = unset) {
|
||||
scrollbar-color: @color-scrollbar-thumb @color-scrollbar-track;
|
||||
scrollbar-width: @scrollbar-width;
|
||||
|
||||
textarea,
|
||||
select,
|
||||
.popover-body,
|
||||
.popupmenu,
|
||||
.ui-dialog-content,
|
||||
.frame-content,
|
||||
.formcontent,
|
||||
.table-responsive,
|
||||
.table-responsive-sm,
|
||||
.scroller {
|
||||
// Firefox does not inherit scrollbar size from the html element
|
||||
scrollbar-width: @scrollbar-width;
|
||||
}
|
||||
|
||||
&:not(.touch) {
|
||||
::-webkit-scrollbar when (@scrollbar-width = auto) {
|
||||
// Note: If we do not set the width a default scrollbar is used in Chrome.
|
||||
// And the custom colors set below do not work
|
||||
width: 12px;
|
||||
}
|
||||
::-webkit-scrollbar when (@scrollbar-width = thin) {
|
||||
width: 6px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track {
|
||||
background-color: @color-scrollbar-track;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
background-color: @color-scrollbar-thumb;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -59,4 +59,4 @@
|
|||
.style-input-focus {
|
||||
border-color: @color-input-border-focus;
|
||||
box-shadow: 0 0 0 .2rem @color-input-border-focus-shadow;
|
||||
}
|
||||
}
|
||||
|
|
File diff suppressed because one or more lines are too long
|
@ -53,6 +53,10 @@
|
|||
|
||||
@mail-header-photo-height: 4rem;
|
||||
|
||||
// Scrollbars
|
||||
@scrollbar-width: thin; // 'auto' or 'thin' or 'unset'
|
||||
@scrollbar-dark-width: thin; // 'auto' or 'thin' or 'unset'
|
||||
|
||||
// Additional icons
|
||||
@icon-resize-corner: data-uri("image/svg+xml;charset=utf-8", "../images/corner-handle.svg"); // size: 16x16
|
||||
@icon-file-drop: data-uri("image/svg+xml;charset=utf-8", "../images/download.svg");
|
||||
|
|
|
@ -78,10 +78,20 @@ div.tox {
|
|||
overflow: unset;
|
||||
}
|
||||
|
||||
.tox-dialog__content-js {
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.tox-dialog-wrap__backdrop {
|
||||
background-color: @color-dialog-overlay-background;
|
||||
}
|
||||
|
||||
.tox-menu,
|
||||
.tox-dialog__body-nav,
|
||||
.tox-collection__group {
|
||||
scrollbar-width: @scrollbar-width;
|
||||
}
|
||||
|
||||
.tox-dialog__header {
|
||||
height: (@layout-header-height - 1px);
|
||||
border-bottom: 1px solid @color-dialog-header-border;
|
||||
|
@ -451,6 +461,11 @@ div.tox {
|
|||
width: 34px;
|
||||
line-height: 28px;
|
||||
}
|
||||
|
||||
&[disabled] {
|
||||
opacity: .7;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -697,6 +697,28 @@ html.ms .propform {
|
|||
width: auto;
|
||||
display: inline;
|
||||
}
|
||||
|
||||
&.with-sublist {
|
||||
flex-wrap: wrap;
|
||||
position: relative;
|
||||
|
||||
& > :first-child {
|
||||
width: 100%;
|
||||
margin-right: 2em;
|
||||
}
|
||||
|
||||
& > .proplist {
|
||||
margin-left: 2.5rem;
|
||||
}
|
||||
|
||||
& > a.dropdown {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 0;
|
||||
height: 2em;
|
||||
color: @color-font;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -33,6 +33,7 @@
|
|||
border-radius: .3rem;
|
||||
z-index: 240;
|
||||
position: absolute;
|
||||
scrollbar-width: @scrollbar-width;
|
||||
|
||||
.ui-state-active {
|
||||
border: 0 !important;
|
||||
|
|
|
@ -563,6 +563,9 @@ a.toolbar-button {
|
|||
&.unflag:before {
|
||||
.font-icon-regular(@fa-var-flag);
|
||||
}
|
||||
&.undo:before {
|
||||
content: @fa-var-redo;
|
||||
}
|
||||
&.folders:before {
|
||||
content: @fa-var-folder;
|
||||
}
|
||||
|
|
|
@ -46,6 +46,12 @@
|
|||
</div>
|
||||
</div>
|
||||
<roundcube:endif />
|
||||
<div class="form-group row form-check">
|
||||
<label for="compose-keep-formatting" class="col-form-label col-6"><roundcube:label name="keepformatting" /></label>
|
||||
<div class="col-6 form-check">
|
||||
<roundcube:object name="keepFormattingCheckBox" id="compose-keep-formatting" noform="true" tabindex="2" class="form-check-input" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group row">
|
||||
<label for="compose-priority" class="col-form-label col-6"><roundcube:label name="priority" /></label>
|
||||
<div class="col-6">
|
||||
|
@ -242,7 +248,6 @@
|
|||
<li role="separator" class="separator"><label><roundcube:label name="insertresponse" /></label></li>
|
||||
<roundcube:object name="responseslist" id="responseslist" tagname="ul" class="rounded-0" itemclass="active" list-placeholder="noresponsesavailable" />
|
||||
<li role="separator" class="separator"><label><roundcube:label name="manageresponses" /></label></li>
|
||||
<roundcube:button command="save-response" type="link-menuitem" label="newresponse" class="create responses disabled" classAct="create responses active" unselectable="on" />
|
||||
<roundcube:button name="responses" type="link-menuitem" label="editresponses" class="edit responses active" onclick="return rcmail.command('switch-task', 'settings/responses')" />
|
||||
</ul>
|
||||
</div>
|
||||
|
|
|
@ -6,7 +6,7 @@
|
|||
<div class="contact-header">
|
||||
<div id="contactphoto" class="contact-photo">
|
||||
<roundcube:object name="contactphoto" id="contactpic" placeholder="/images/contactpic.svg"
|
||||
placeholderGroup="/images/contactgroup.svg" />
|
||||
placeholderGroup="/images/contactgroup.svg" bg-color="transparent" />
|
||||
</div>
|
||||
<roundcube:object name="contacthead" id="contacthead" class="contact-head readonly" with-source="true" />
|
||||
</div>
|
||||
|
|
|
@ -28,7 +28,7 @@
|
|||
<link rel="stylesheet" href="/styles/styles.css">
|
||||
<roundcube:link rel="stylesheet" href="/styles/print.css" condition="env:action == 'print'" />
|
||||
<roundcube:endif />
|
||||
<roundcube:if condition="env:action != 'print' && !config:devel_mode" />
|
||||
<roundcube:if condition="env:action != 'print' && !config:devel_mode && config:dark_mode_support" />
|
||||
<script>
|
||||
try {
|
||||
if (document.cookie.indexOf('colorMode=dark') > -1
|
||||
|
|
|
@ -83,6 +83,9 @@
|
|||
<roundcube:button type="link-menuitem" command="mark" prop="unread" label="markunread" classAct="unread active" class="unread disabled" />
|
||||
<roundcube:button type="link-menuitem" command="mark" prop="flagged" label="markflagged" classAct="flag active" class="flag disabled" />
|
||||
<roundcube:button type="link-menuitem" command="mark" prop="unflagged" label="markunflagged" classAct="unflag active" class="unflag disabled" />
|
||||
<roundcube:if condition="config:flag_for_deletion && !config:skip_deleted" />
|
||||
<roundcube:button type="link-menuitem" command="mark" prop="undelete" label="markundeleted" classAct="undo active" class="undo disabled" />
|
||||
<roundcube:endif />
|
||||
<roundcube:container name="markmenu" id="markmessage-menu" />
|
||||
</ul>
|
||||
</div>
|
||||
|
|
|
@ -51,10 +51,24 @@
|
|||
<div class="formcontent">
|
||||
<ul class="proplist">
|
||||
<li><label><input type="checkbox" name="s_mods[]" value="subject" /><roundcube:label name="subject" /></label></li>
|
||||
<li><label><input type="checkbox" name="s_mods[]" value="from" /><roundcube:label name="from" /></label></li>
|
||||
<li><label><input type="checkbox" name="s_mods[]" value="to" /><roundcube:label name="to" /></label></li>
|
||||
<li><label><input type="checkbox" name="s_mods[]" value="cc" /><roundcube:label name="cc" /></label></li>
|
||||
<li><label><input type="checkbox" name="s_mods[]" value="bcc" /><roundcube:label name="bcc" /></label></li>
|
||||
<li class="with-sublist">
|
||||
<label><input type="checkbox" name="s_mods[]" value="sender" /><roundcube:label name="sender" /></label>
|
||||
<a class="button icon dropdown" role="button" href="#" title="<roundcube:label name="details" />"></a>
|
||||
<ul class="proplist d-none">
|
||||
<li><label><input type="checkbox" name="s_mods[]" value="from" /><roundcube:label name="from" /></label></li>
|
||||
<li><label><input type="checkbox" name="s_mods[]" value="replyto" /><roundcube:label name="replyto" /></label></li>
|
||||
<li><label><input type="checkbox" name="s_mods[]" value="followupto" /><roundcube:label name="followupto" /></label></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="with-sublist">
|
||||
<label><input type="checkbox" name="s_mods[]" value="recipient" /><roundcube:label name="recipient" /></label>
|
||||
<a class="button icon dropdown" role="button" href="#" title="<roundcube:label name="details" />"></a>
|
||||
<ul class="proplist d-none">
|
||||
<li><label><input type="checkbox" name="s_mods[]" value="to" /><roundcube:label name="to" /></label></li>
|
||||
<li><label><input type="checkbox" name="s_mods[]" value="cc" /><roundcube:label name="cc" /></label></li>
|
||||
<li><label><input type="checkbox" name="s_mods[]" value="bcc" /><roundcube:label name="bcc" /></label></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><label><input type="checkbox" name="s_mods[]" value="body" /><roundcube:label name="body" /></label></li>
|
||||
<li><label><input type="checkbox" name="s_mods[]" value="text" /><roundcube:label name="msgtext" /></label></li>
|
||||
</ul>
|
||||
|
|
|
@ -25,7 +25,7 @@
|
|||
<roundcube:endif />
|
||||
</h2>
|
||||
<div class="header">
|
||||
<roundcube:object name="contactphoto" class="contactphoto" placeholder="/images/contactpic.svg" />
|
||||
<roundcube:object name="contactphoto" class="contactphoto" placeholder="/images/contactpic.svg" bg-color="transparent" />
|
||||
<div class="header-content">
|
||||
<roundcube:object name="messageSummary" class="header-summary" addicon="virtual" />
|
||||
<roundcube:object name="messageHeaders" class="header-headers" addicon="virtual" exclude="subject" max="10" />
|
||||
|
|
BIN
thumbnail.png
BIN
thumbnail.png
Binary file not shown.
Before Width: | Height: | Size: 5.8 KiB After Width: | Height: | Size: 1.8 KiB |
98
ui.js
98
ui.js
|
@ -809,7 +809,7 @@ function rcube_elastic_ui()
|
|||
$('#taskmenu a.theme').on('click', function() {
|
||||
color_mode = $(this).is('.dark') ? 'dark' : 'light';
|
||||
switch_color_mode();
|
||||
rcmail.set_cookie('colorMode', color_mode);
|
||||
rcmail.set_cookie('colorMode', color_mode, false);
|
||||
});
|
||||
|
||||
// Note: this does not work in IE and Safari
|
||||
|
@ -1730,12 +1730,12 @@ function rcube_elastic_ui()
|
|||
$('#logo').data('src-default', $('#logo').attr('src'));
|
||||
}
|
||||
|
||||
if (mode == 'phone' && logos['small']) {
|
||||
$('#logo').attr('src', logos['small']);
|
||||
}
|
||||
else if (mode == 'phone' && color_mode == 'dark' && logos['small-dark']) {
|
||||
if (mode == 'phone' && color_mode == 'dark' && logos['small-dark']) {
|
||||
$('#logo').attr('src', logos['small-dark']);
|
||||
}
|
||||
else if (mode == 'phone' && logos['small']) {
|
||||
$('#logo').attr('src', logos['small']);
|
||||
}
|
||||
else if (color_mode == 'dark' && logos['dark']) {
|
||||
$('#logo').attr('src', logos['dark']);
|
||||
}
|
||||
|
@ -2827,6 +2827,11 @@ function rcube_elastic_ui()
|
|||
rcmail.env.search_interval = interval_select.val();
|
||||
});
|
||||
}
|
||||
|
||||
$(obj).find('.proplist > li > a.dropdown').on('click', function() {
|
||||
var list = $(this).next()
|
||||
list[list.is('.d-none') ? 'removeClass' : 'addClass']('d-none');
|
||||
});
|
||||
}
|
||||
|
||||
scope_select.val(scope);
|
||||
|
@ -2850,11 +2855,18 @@ function rcube_elastic_ui()
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
set_searchmod_masters(obj);
|
||||
};
|
||||
|
||||
/**
|
||||
* Handler for a search option state update
|
||||
*/
|
||||
function set_searchmod(menu, elem)
|
||||
{
|
||||
var all, m, task = rcmail.env.task,
|
||||
var all, m, masters = {},
|
||||
list = $('input[name="s_mods[]"]', menu),
|
||||
task = rcmail.env.task,
|
||||
mods = rcmail.env.search_mods || {},
|
||||
mbox = rcmail.env.mailbox;
|
||||
|
||||
|
@ -2864,6 +2876,10 @@ function rcube_elastic_ui()
|
|||
}
|
||||
m = mods[mbox];
|
||||
all = 'text';
|
||||
masters = {
|
||||
sender: ['from', 'replyto', 'followupto'],
|
||||
recipient: ['to', 'cc', 'bcc']
|
||||
};
|
||||
}
|
||||
else {
|
||||
// addressbook
|
||||
|
@ -2880,7 +2896,7 @@ function rcube_elastic_ui()
|
|||
|
||||
// mark all fields
|
||||
if (elem.value == all) {
|
||||
$('input[name="s_mods[]"]', menu).not(elem).map(function() {
|
||||
list.not(elem).each(function() {
|
||||
this.checked = true;
|
||||
|
||||
if (elem.checked) {
|
||||
|
@ -2889,14 +2905,44 @@ function rcube_elastic_ui()
|
|||
}
|
||||
else {
|
||||
this.disabled = false;
|
||||
m[this.value] = 1;
|
||||
if (!(this.value in masters)) {
|
||||
m[this.value] = 1;
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
// Handle clicks on Sender/Recipient elements
|
||||
else if (elem.value in masters) {
|
||||
delete m[elem.value];
|
||||
|
||||
list.filter(function() { return $.inArray(this.value, masters[elem.value]) != -1; }).each(function() {
|
||||
if (elem.checked) {
|
||||
this.checked = true;
|
||||
m[this.value] = 1;
|
||||
}
|
||||
else {
|
||||
this.checked = false;
|
||||
delete m[this.value];
|
||||
}
|
||||
});
|
||||
}
|
||||
else if (masters.sender) {
|
||||
set_searchmod_masters(menu);
|
||||
}
|
||||
|
||||
rcmail.set_searchmods(m);
|
||||
};
|
||||
|
||||
/*
|
||||
* Set state of the Sender/Recipient checkbox depending on whether any of the sub-items are checked
|
||||
*/
|
||||
function set_searchmod_masters(obj)
|
||||
{
|
||||
$(obj).find('.proplist > li.with-sublist').each(function() {
|
||||
$(this).find(':not(.proplist) input')[0].checked = $(this).children('.proplist').find('input:checked').length > 0;
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Spellcheck languages list
|
||||
*/
|
||||
|
@ -3784,11 +3830,11 @@ function rcube_elastic_ui()
|
|||
};
|
||||
|
||||
/**
|
||||
* HTML editor textarea wrapper with nice looking tabs-like switch
|
||||
* HTML editor textarea wrapper with plain-to-html switch button
|
||||
*/
|
||||
function html_editor_init(obj)
|
||||
{
|
||||
// Here we support two structures
|
||||
// Here we support two kinds of structure:
|
||||
// 1. <div><textarea></textarea><select class="hidden"></div>
|
||||
// 2. <tr><td><td><td><textarea></textarea></td></tr>
|
||||
// <tr><td><td><td><input type="checkbox"></td></tr>
|
||||
|
@ -3796,10 +3842,11 @@ function rcube_elastic_ui()
|
|||
var sw, is_table = false,
|
||||
editor = $(obj),
|
||||
parent = editor.parent(),
|
||||
readonly = editor.is('[readonly],[disabled]'),
|
||||
plain_btn = $('<a class="mce-i-html" href="#" tabindex="-1"></a>')
|
||||
.attr('title', rcmail.gettext('htmltoggle'))
|
||||
.attr({title: rcmail.gettext('htmltoggle'), disabled: readonly})
|
||||
.on('click', function(e) {
|
||||
if (rcmail.command('toggle-editor', {id: editor.attr('id'), html: true}, '', e.originalEvent)) {
|
||||
if (!readonly && rcmail.command('toggle-editor', {id: editor.attr('id'), html: true}, '', e.originalEvent)) {
|
||||
parent.addClass('ishtml');
|
||||
}
|
||||
})
|
||||
|
@ -4139,6 +4186,15 @@ function rcube_elastic_ui()
|
|||
*/
|
||||
function window_open(url, small, toolbar, force_window)
|
||||
{
|
||||
var colorFunc = function (body) {
|
||||
$(body).css({
|
||||
color: $(document.body).css('color'),
|
||||
backgroundColor: $(document.body).css('background-color')
|
||||
})
|
||||
};
|
||||
|
||||
var setColor = color_mode == 'dark' && /_task=mail/.test(url) && /_action=viewsource/.test(url);
|
||||
|
||||
// Use 4th argument to bypass the dialog-mode e.g. for external windows
|
||||
if (!is_mobile() || force_window === true) {
|
||||
// On attachment preview page we do not display the properties sidebar
|
||||
|
@ -4147,7 +4203,14 @@ function rcube_elastic_ui()
|
|||
small = true;
|
||||
}
|
||||
|
||||
return env.open_window.call(rcmail, url, small, toolbar);
|
||||
var win = env.open_window.call(rcmail, url, small, toolbar);
|
||||
|
||||
// Switch the plain/text window to dark-mode
|
||||
if (setColor) {
|
||||
$(win).on('load', function() { colorFunc(win.document.body); });
|
||||
}
|
||||
|
||||
return win;
|
||||
}
|
||||
|
||||
// _extwin=1, _framed=1 are required to display attachment preview
|
||||
|
@ -4167,6 +4230,11 @@ function rcube_elastic_ui()
|
|||
props.dialogClass = 'no-titlebar';
|
||||
}
|
||||
|
||||
// Switch the plain/text iframe to dark-mode
|
||||
if (setColor) {
|
||||
frame.on('load', function() { colorFunc(frame[0].contentWindow.document.body); });
|
||||
}
|
||||
|
||||
rcmail.simple_dialog(frame, title, null, props);
|
||||
|
||||
return true;
|
||||
|
@ -4244,9 +4312,7 @@ function rcube_elastic_ui()
|
|||
// write prefs to local storage (if supported)
|
||||
if (!rcmail.local_storage_set_item('prefs.elastic', prefs)) {
|
||||
// store value in cookie
|
||||
var exp = new Date();
|
||||
exp.setYear(exp.getFullYear() + 1);
|
||||
rcmail.set_cookie(key, val, exp);
|
||||
rcmail.set_cookie(key, val, false);
|
||||
}
|
||||
};
|
||||
}
|
||||
|
|
|
@ -6,10 +6,10 @@
|
|||
<style type="text/css">
|
||||
html, body { height: 100%; overflow: hidden; }
|
||||
body {
|
||||
background: url(https://disroot.org/user/themes/disroot/images/disroot-root.png) center no-repeat;
|
||||
background-size: 20%;
|
||||
background-blend-mode: luminosity;
|
||||
opacity: 0.8;
|
||||
background: url(https://disroot.org/user/themes/disroot/images/disroot-root.png) center no-repeat;
|
||||
background-size: 30%;
|
||||
background-blend-mode: luminosity;
|
||||
opacity: 0.8;
|
||||
}
|
||||
html:not(.dark-mode) body:before {
|
||||
content: "";
|
||||
|
|
Loading…
Reference in New Issue