Add files via upload
This commit is contained in:
parent
7dfc8d54e2
commit
56a3728d81
3 changed files with 224 additions and 100 deletions
230
styles/styles.min.css
vendored
230
styles/styles.min.css
vendored
|
@ -1,22 +1,30 @@
|
|||
.tdattachmentslist, .tdzipdownload{
|
||||
padding:0 !important;
|
||||
}
|
||||
|
||||
|
||||
html {
|
||||
--font: #2c363a;
|
||||
--font2:#737677;
|
||||
--background: #fff;
|
||||
--backgroundhover: #ebf9ff;
|
||||
--backgroundhoverlight: #F4FBFF;
|
||||
--backgroundbutton: #F1F3F4;
|
||||
--bordercolor:#d4dbde;
|
||||
}
|
||||
|
||||
|
||||
html.dark-mode {
|
||||
--font: #c5d1d3;
|
||||
--font2:#c5d1d3;
|
||||
--font: #e0e6ec;
|
||||
--font2:#e0e6ec;
|
||||
--background: #1a1c1e;
|
||||
--backgroundhover: #374549;
|
||||
--backgroundhoverlight: rgba(44, 54, 58, 0.7);
|
||||
--backgroundbutton: #374549;
|
||||
--bordercolor:#4d6066;
|
||||
--bordercolor:#3D444D;
|
||||
}
|
||||
|
||||
|
||||
.boxinformation {
|
||||
background-color: rgba(55,190,255,.2);
|
||||
}
|
||||
|
@ -43,7 +51,8 @@ opacity:1;
|
|||
border-top:1px solid var(--bordercolor);
|
||||
justify-content:normal;
|
||||
height:display: block;
|
||||
font-size:1rem
|
||||
font-size:1rem;
|
||||
user-select:none;
|
||||
}
|
||||
|
||||
|
||||
|
@ -550,6 +559,7 @@ body {
|
|||
left: 0 !important;
|
||||
}
|
||||
|
||||
.zipdownloadicon:before,
|
||||
#divscale_default:before,
|
||||
#filtersetslist td.name:before,
|
||||
#filterslist td.name:before,
|
||||
|
@ -558,7 +568,7 @@ body {
|
|||
#responses-table td.name:before,
|
||||
.attachmentslist li a.cancelupload:before,
|
||||
.attachmentslist li a.delete:before,
|
||||
.attachmentslist li:before,
|
||||
.attachmentslist a:before,
|
||||
.contactlist li a:before,
|
||||
.contactlist td.contact:before,
|
||||
.contactlist td.contactgroup:before,
|
||||
|
@ -1203,14 +1213,6 @@ fieldset.image-attachment img {
|
|||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.noselect {
|
||||
user-select: none;
|
||||
-moz-user-select: none;
|
||||
-khtml-user-select: none;
|
||||
-ms-user-select: none;
|
||||
-webkit-user-select: none;
|
||||
}
|
||||
|
||||
.iframe-loader {
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
|
@ -3708,10 +3710,14 @@ color: var(--font2);
|
|||
color: #2c363a;
|
||||
}
|
||||
|
||||
.listing li {
|
||||
user-select:none;
|
||||
}
|
||||
.listing li a {
|
||||
display: block;
|
||||
text-decoration: none;
|
||||
width: 100%;
|
||||
|
||||
}
|
||||
|
||||
.listing:not(.withselection) td.selection,
|
||||
|
@ -4283,12 +4289,12 @@ line-height: 1.9em;
|
|||
padding-right: 0.5rem;
|
||||
}
|
||||
|
||||
.message{user-select: none;}
|
||||
|
||||
.messagelist td.subject span.subject {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
width: 100%;
|
||||
user-select: none;
|
||||
|
||||
}
|
||||
|
||||
.messagelist td.threads {
|
||||
|
@ -4357,14 +4363,9 @@ display: none;
|
|||
|
||||
|
||||
.message:hover {
|
||||
background-color:#F4FBFF;
|
||||
background-color: var(--backgroundhoverlight);
|
||||
}
|
||||
|
||||
html.dark-mode .message:hover {
|
||||
background-color:rgba(44, 54, 58, 0.7);
|
||||
}
|
||||
|
||||
|
||||
|
||||
.message:hover .selection{
|
||||
border-left-color: transparent;
|
||||
|
@ -4544,11 +4545,29 @@ html.layout-phone a.refresh {
|
|||
font-weight: 900;
|
||||
}
|
||||
|
||||
|
||||
.attachmentslist {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
background-color: #fcfcfc;
|
||||
border: 1px solid #f4f4f4;
|
||||
max-height:100px;
|
||||
overflow: auto;
|
||||
list-style-type: none;
|
||||
}
|
||||
|
||||
|
||||
.attachmentslistthumnb{
|
||||
position:absolute;
|
||||
width:36px;
|
||||
height:34px;
|
||||
background-size: contain !important;
|
||||
z-index:20;
|
||||
left:4px;
|
||||
top:4px;
|
||||
background-color: var(--backgroundhoverlight);
|
||||
}
|
||||
|
||||
.attachmentslist .dropdown{
|
||||
display:none;
|
||||
}
|
||||
|
||||
.attachmentslist:empty {
|
||||
|
@ -4557,99 +4576,107 @@ html.layout-phone a.refresh {
|
|||
}
|
||||
|
||||
.attachmentslist li {
|
||||
list-style: none;
|
||||
display: inline-flex;
|
||||
white-space: nowrap;
|
||||
line-height: 2rem;
|
||||
padding: 0 0.25em;
|
||||
max-width: 100%;
|
||||
line-height: 1.2rem;
|
||||
width: 100%;
|
||||
height:42px;
|
||||
position:relative;
|
||||
}
|
||||
|
||||
.attachmentslist li:before {
|
||||
|
||||
.attachmentslist a:before {
|
||||
content: "\f15b";
|
||||
font-weight: 400;
|
||||
height: 2rem;
|
||||
margin: 0;
|
||||
margin: 8px;
|
||||
font-size:28px;
|
||||
position: relative;
|
||||
z-index: 10;
|
||||
opacity:.7;
|
||||
color: var(--font);
|
||||
}
|
||||
|
||||
.attachmentslist li.text:before,
|
||||
.attachmentslist li.txt:before {
|
||||
.attachmentslist .text a:before,
|
||||
.attachmentslist .txt a:before {
|
||||
content: "\f15c";
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.attachmentslist li.pdf:before {
|
||||
.attachmentslist .pdf a:before {
|
||||
content: "\f1c1";
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.attachmentslist li.doc:before,
|
||||
.attachmentslist li.docx:before,
|
||||
.attachmentslist li.msword:before,
|
||||
.attachmentslist li.odt:before {
|
||||
.attachmentslist .doc a:before,
|
||||
.attachmentslist .docx a:before,
|
||||
.attachmentslist .msword a:before,
|
||||
.attachmentslist .odt a:before {
|
||||
content: "\f1c2";
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.attachmentslist li.msexcel:before,
|
||||
.attachmentslist li.ods:before,
|
||||
.attachmentslist li.xls:before,
|
||||
.attachmentslist li.xlsx:before {
|
||||
.attachmentslist .msexcel a:before,
|
||||
.attachmentslist .ods a:before,
|
||||
.attachmentslist .xls a:before,
|
||||
.attachmentslist .xlsx a:before {
|
||||
content: "\f1c3";
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.attachmentslist li.gz:before,
|
||||
.attachmentslist li.rar:before,
|
||||
.attachmentslist li.zip:before {
|
||||
.attachmentslist .gz a:before,
|
||||
.attachmentslist .rar a:before,
|
||||
.attachmentslist .x-7z-compressed a:before,
|
||||
.attachmentslist .zip a:before {
|
||||
content: "\f1c6";
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.attachmentslist li.image:before,
|
||||
.attachmentslist li.jpeg:before,
|
||||
.attachmentslist li.jpg:before,
|
||||
.attachmentslist li.png:before {
|
||||
.attachmentslist .image a:before,
|
||||
.attachmentslist .jpeg a:before,
|
||||
.attachmentslist .jpg a:before,
|
||||
.attachmentslist .png a:before {
|
||||
content: "\f1c5";
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.attachmentslist li.audio:before,
|
||||
.attachmentslist li.mp3:before {
|
||||
.attachmentslist .audio a:before,
|
||||
.attachmentslist .mp3 a:before {
|
||||
content: "\f1c7";
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.attachmentslist li.m4p:before,
|
||||
.attachmentslist li.video:before {
|
||||
.attachmentslist .m4p a:before,
|
||||
.attachmentslist .video a:before {
|
||||
content: "\f1c8";
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.attachmentslist li.vcard:before {
|
||||
.attachmentslist .vcard a:before {
|
||||
content: "\f2bb";
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.attachmentslist li.html:before {
|
||||
.attachmentslist .html a:before {
|
||||
content: "\f1c9";
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.attachmentslist li.odp:before,
|
||||
.attachmentslist li.otp:before,
|
||||
.attachmentslist li.ppsx:before,
|
||||
.attachmentslist li.ppt:before,
|
||||
.attachmentslist li.pptx:before,
|
||||
.attachmentslist li.vnd.mspowerpoint:before {
|
||||
.attachmentslist .odp a:before,
|
||||
.attachmentslist .otp a:before,
|
||||
.attachmentslist .ppsx a:before,
|
||||
.attachmentslist .ppt a:before,
|
||||
.attachmentslist .pptx a:before,
|
||||
.attachmentslist .vnd.mspowerpoint a:before {
|
||||
content: "\f1c4";
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.attachmentslist li a {
|
||||
text-decoration: none;
|
||||
line-height: 2rem;
|
||||
height: 2rem;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.attachmentslist li a:hover {
|
||||
background-color: var(--backgroundhover);
|
||||
}
|
||||
|
||||
.attachmentslist li a.cancelupload:before,
|
||||
|
@ -4672,20 +4699,75 @@ html.layout-phone a.refresh {
|
|||
}
|
||||
|
||||
.attachmentslist li a.filename {
|
||||
display: flex;
|
||||
overflow: hidden;
|
||||
padding: 0 0.2em;
|
||||
width:100%;
|
||||
height: 100%;
|
||||
display: inline-block;
|
||||
position:absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
z-index:0;
|
||||
padding-top: 4px;
|
||||
border-radius:4px;
|
||||
}
|
||||
|
||||
.attachmentslist li a.filename:after {
|
||||
content: "";
|
||||
background: #aaa;
|
||||
filter: brightness(30%);
|
||||
display: block;
|
||||
position: absolute;
|
||||
padding-top: 300%;
|
||||
padding-left: 350%;
|
||||
margin-left: -20px!important;
|
||||
margin-top: -120%;
|
||||
opacity: 0;
|
||||
transition: all 0.3s
|
||||
}
|
||||
|
||||
.attachmentslist li a.filename:active:after {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
opacity: 1;
|
||||
transition: 0s
|
||||
}
|
||||
|
||||
.attachmentslist li .attachment-name {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
color: #2c363a;
|
||||
line-height: 18px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.attachmentslist li .attachment-size {
|
||||
color: #737677;
|
||||
padding-left: 0.25em;
|
||||
display: block;
|
||||
}
|
||||
|
||||
|
||||
.tdzipdownload{
|
||||
width: 40px;
|
||||
cursor:pointer;
|
||||
border-radius:4px;
|
||||
background-color: var(--backgroundhoverlight);
|
||||
margin:0;
|
||||
vertical-align: middle !important;
|
||||
display:none;
|
||||
}
|
||||
|
||||
.tdzipdownload:hover{
|
||||
background-color: var(--backgroundhover);
|
||||
}
|
||||
|
||||
.zipdownloadicon{
|
||||
margin-top: -10px;
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
.zipdownloadicon:before{
|
||||
content: "\f019";
|
||||
float:none;
|
||||
}
|
||||
|
||||
.keylist {
|
||||
|
@ -6839,9 +6921,6 @@ body.task-error-login #layout #layout-content > .header{
|
|||
margin: 0;
|
||||
}
|
||||
|
||||
#message-content .attachmentslist:not(:empty) {
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
#messagebody.mailvelope iframe {
|
||||
min-height: 75vh;
|
||||
|
@ -6946,7 +7025,9 @@ body.task-error-login #layout #layout-content > .header{
|
|||
#compose-attachments {
|
||||
margin: 1rem 1rem 0;
|
||||
}
|
||||
|
||||
#compose-attachments .attachmentslist{
|
||||
max-height: unset !important;
|
||||
}
|
||||
|
||||
.settings-default-icon li > a:before,
|
||||
.settings-default-icon tr > td.section::before {
|
||||
|
@ -7143,7 +7224,7 @@ html.dark-mode .menu.toolbar .dropbutton a.dropdown:hover {
|
|||
html.dark-mode .listing li a,
|
||||
html.dark-mode .listing tbody td,
|
||||
html.dark-mode .listing tbody td a {
|
||||
color: #c5d1d3;
|
||||
color: var(--font);
|
||||
}
|
||||
|
||||
|
||||
|
@ -7216,9 +7297,10 @@ html.dark-mode .folderlist li.mailbox .unreadcount {
|
|||
font-weight: 400;
|
||||
}
|
||||
|
||||
html.dark-mode .attachmentslist {
|
||||
background-color: #374549;
|
||||
border: 0;
|
||||
.attachmentslist {
|
||||
background-color: var(--backgroundhoverlight);
|
||||
border: 0;
|
||||
border-radius:4px;
|
||||
}
|
||||
|
||||
html.dark-mode .attachmentslist a,
|
||||
|
|
|
@ -47,7 +47,7 @@
|
|||
<div class="header">
|
||||
<table style="width:100%">
|
||||
<tr><td style="width:40px;vertical-align: top;">
|
||||
<roundcube:object name="contactphoto" class="contactphoto" placeholder="/images/contactpic.svg" />
|
||||
<roundcube:object name="contactphoto" class="contactphoto" placeholder="/images/contactpic.svg" bg-color="transparent" />
|
||||
</td>
|
||||
<td>
|
||||
<div class="header-content">
|
||||
|
@ -86,7 +86,11 @@
|
|||
<div id="message-content">
|
||||
<div class="leftcol" role="region" aria-labelledby="aria-label-messageattachments">
|
||||
<h2 id="aria-label-messageattachments" class="voice"><roundcube:label name="attachments" /></h2>
|
||||
<table style='margin: 0 0 0.2rem;'><tr><td class="tdattachmentslist">
|
||||
<roundcube:object name="messageAttachments" id="attachment-list" class="attachmentslist" />
|
||||
</td><td class="tdzipdownload"><div class='zipdownloadicon'></div>
|
||||
</td></tr>
|
||||
</table>
|
||||
</div>
|
||||
<div class="rightcol" role="region" aria-labelledby="aria-label-messagebody">
|
||||
<h2 id="aria-label-messagebody" class="voice"><roundcube:label name="arialabelmessagebody" /></h2>
|
||||
|
|
88
ui.min.js
vendored
88
ui.min.js
vendored
|
@ -125,7 +125,6 @@ function rcube_elastic_ui()
|
|||
// Update layout after initialization
|
||||
resize();
|
||||
|
||||
|
||||
/**
|
||||
* Setup procedure
|
||||
*/
|
||||
|
@ -789,6 +788,7 @@ if(rcmail.env.action=="preview")
|
|||
// restore headers view to last state
|
||||
//headers_show();
|
||||
elastic2022_change_mailheader()
|
||||
elastic2022_change_attachmentslist()
|
||||
}
|
||||
}
|
||||
else if (rcmail.task == 'settings') {
|
||||
|
@ -801,26 +801,27 @@ if(rcmail.env.action=="preview")
|
|||
}
|
||||
else if (rcmail.env.task == 'login') {
|
||||
|
||||
if($('#ifplcontainer')) // plugin persistent login
|
||||
setTimeout(function() {
|
||||
|
||||
ifplcontainer.remove() // remove ugly previous one
|
||||
// and recreate it
|
||||
var html = `
|
||||
<tr class="form-group row">
|
||||
<td class="title" style="display: none;">
|
||||
<label for="rcmloginuser">Username</label>
|
||||
</td>
|
||||
<td class="input input-group input-group-lg">
|
||||
<div class="custom-control custom-switch">
|
||||
<input type="checkbox" class="custom-control-input" id="_ifpl" name="_ifpl" value="1">
|
||||
<label class="custom-control-label" for="_ifpl">` + rcmail.gettext('ifpl_rememberme', 'persistent_login') + `</label>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="ifpl-hint" class="form-group row" style="display: none;">
|
||||
<td class="ifpl-hint" colspan="2">` + rcmail.gettext('ifpl_rememberme_hint', 'persistent_login') + `</td>
|
||||
</tr>
|
||||
// plugin persistent login
|
||||
setTimeout(function() {
|
||||
|
||||
if(!$('#ifplcontainer').length) return;
|
||||
ifplcontainer.remove() // remove ugly previous one
|
||||
// and recreate it
|
||||
var html = `
|
||||
<tr class="form-group row">
|
||||
<td class="title" style="display: none;">
|
||||
<label for="rcmloginuser">Username</label>
|
||||
</td>
|
||||
<td class="input input-group input-group-lg">
|
||||
<div class="custom-control custom-switch">
|
||||
<input type="checkbox" class="custom-control-input" id="_ifpl" name="_ifpl" value="1">
|
||||
<label class="custom-control-label" for="_ifpl">` + rcmail.gettext('ifpl_rememberme', 'persistent_login') + `</label>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="ifpl-hint" class="form-group row" style="display: none;">
|
||||
<td class="ifpl-hint" colspan="2">` + rcmail.gettext('ifpl_rememberme_hint', 'persistent_login') + `</td>
|
||||
</tr>
|
||||
`
|
||||
$('#login-form table tbody').append(html);
|
||||
})
|
||||
|
@ -4889,7 +4890,8 @@ for(var i=0;i<msgs.length;i++)
|
|||
|
||||
if(LSdata[emailencode]==1)
|
||||
{
|
||||
d.style.backgroundImage="url('?_task=addressbook&_action=photo&_email="+emailencode+"&_error=1')"
|
||||
d.style.backgroundImage="url('?_task=addressbook&_action=photo&_email="+emailencode+"&_error=1&_bgcolor=transparent')"
|
||||
d.style.backgroundColor="";
|
||||
}
|
||||
else
|
||||
{
|
||||
|
@ -4951,9 +4953,13 @@ for(var i=0;i<msgs.length;i++)
|
|||
|
||||
if(is_contactphoto(emailencode))
|
||||
{
|
||||
msgs[i].querySelector(".maillogo_no_select").innerHTML=""
|
||||
msgs[i].querySelector(".maillogo_no_select").style.backgroundImage="url('?_task=addressbook&_action=photo&_email="+emailencode+"&_error=1')"
|
||||
var div = msgs[i].querySelector(".maillogo_no_select")
|
||||
div.innerHTML=""
|
||||
div.style.backgroundImage="url('?_task=addressbook&_action=photo&_email="+emailencode+"&_error=1&_bgcolor=transparent')"
|
||||
div.style.backgroundColor="";
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -4976,7 +4982,7 @@ if(LSdata[email]!==undefined)
|
|||
|
||||
var xmlhttp = new XMLHttpRequest(),
|
||||
method = 'GET',
|
||||
url = '?_task=addressbook&_action=photo&_email='+email+'&_error=1';
|
||||
url = '?_task=addressbook&_action=photo&_email='+email+'&_error=1&_bgcolor=transparent';
|
||||
|
||||
xmlhttp.open(method, url, false); //yeap slow on ugly
|
||||
xmlhttp.onerror = function () {
|
||||
|
@ -5385,6 +5391,38 @@ if(replyto.length && sender.length) // delete sender if same as "from"
|
|||
}
|
||||
}
|
||||
|
||||
function elastic2022_change_attachmentslist()
|
||||
{
|
||||
$('.attachment-size').each(function() { this.innerText=this.innerText.replace(/[()~]/g, '')}) // remove ( ) ~ char
|
||||
|
||||
// force direct download on link
|
||||
$('.attachmentslist .filename').off()
|
||||
$('.attachmentslist .filename').removeAttr("onclick")
|
||||
$('.attachmentslist .filename').attr('target','_blank');
|
||||
$('.attachmentslist li:not(.pdf, .image) .filename').attr("download", "") // open image & pdf in browser, download everything else (bug for pdf is forced download :/)
|
||||
|
||||
// add thumbail for .image
|
||||
$('.attachmentslist .image').each(function() {
|
||||
var bkgurl = jQuery(this).find(".filename")[0].href
|
||||
bkgurl +="&_embed=1&_mimeclass=image&_thumb=1"
|
||||
|
||||
jQuery(this).find(".filename").append( "<div class='attachmentslistthumnb' style='background: url("+bkgurl+");'></div>" );
|
||||
})
|
||||
|
||||
if($('.zipdownload').length ) // zipdownload plugin
|
||||
{
|
||||
var zd = $('.zipdownload')[0]
|
||||
$('.tdzipdownload').css( "display","table-cell")
|
||||
$('.tdzipdownload').prop('title', zd.innerText);
|
||||
$('.tdzipdownload').on( "click", function() { window.location = zd.href;} );
|
||||
$('.attachmentslist').css( "marginRight", "6px" );
|
||||
$('.zipdownload').remove()
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
function click_from_button(e)
|
||||
{
|
||||
|
|
Loading…
Reference in a new issue