the-djmaze/snappymail
1
1
Fork 0
mirror of https://github.com/the-djmaze/snappymail.git synced 2025-02-24 23:08:08 +08:00
Code Issues Projects Releases Packages Wiki Activity

Resolve #579

Browse source
This commit is contained in:
the-djmaze 2022-10-24 15:12:25 +02:00
parent b6f35e00d6
commit b1bcbc1671
3 changed files with 50 additions and 65 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

85
dev/Styles/User/MessageList.less
View file

@ -27,9 +27,10 @@ html.rl-no-preview-pane {
border: 1px solid @rlMainDarkColor; border: 1px solid @rlMainDarkColor;
border-radius: @rlMainBorderRadius; border-radius: @rlMainBorderRadius;
box-shadow: @rlMainShadow; box-shadow: @rlMainShadow;
/*
display: flex; display: flex;
flex-direction: column; flex-direction: column;
*/
.b-footer { .b-footer {
display: flex; display: flex;
flex-shrink: 0; flex-shrink: 0;
@ -177,28 +178,27 @@ html:not(rl-mobile) {
visibility: hidden; visibility: hidden;
} }
.checkboxMessage { .messageCheckbox {
display: none; display: none;
} }
} }
} }
.messageListItem { .messageListItem > div + div {
display: flex; display: flex;
flex-wrap: wrap;
position: relative;
font-size: 13px;
overflow: hidden; overflow: hidden;
cursor: pointer; padding: 5px 0 5px 5px;
width: 100%;
}
margin: 0; .messageListItem {
padding: 5px 0; cursor: pointer;
border: 0; border: 0;
border-bottom: 1px solid rgba(153, 153, 153, 0.2); border-bottom: 1px solid rgba(153, 153, 153, 0.2);
border-left: 6px solid #eee; border-left: 6px solid #eee;
display: flex;
z-index: 100; font-size: 13px;
line-height: 2;
/* /*
> * { > * {
display: flex; display: flex;
@ -221,9 +221,12 @@ html:not(rl-mobile) {
opacity: .3; opacity: .3;
} }
.checkboxMessage { .messageCheckbox {
margin: 0 6px;
font-size: 16px; font-size: 16px;
padding: 5px .5em 0;
}
.checkboxMessage {
display: inline;
} }
time, .sizeParent { time, .sizeParent {
@ -234,7 +237,6 @@ html:not(rl-mobile) {
} }
.attachmentParent { .attachmentParent {
position: relative;
margin: 2px 10px 0 5px; margin: 2px 10px 0 5px;
} }
@ -245,6 +247,14 @@ html:not(rl-mobile) {
white-space: nowrap; white-space: nowrap;
} }
.senderParent {
flex: 0 0 25%;
}
.subjectParent {
flex: 1 1 auto;
}
.subjectParent:empty { .subjectParent:empty {
font-style: italic; font-style: italic;
opacity: 0.5; opacity: 0.5;
@ -394,11 +404,19 @@ html:not(rl-mobile) {
.rl-side-preview-pane, .rl-mobile { .rl-side-preview-pane, .rl-mobile {
.messageListItem { .messageListItem > div + div {
flex-wrap: wrap;
}
.checkboxMessage { .messageListItem {
line-height: 12px; line-height: 1.5;
margin: 10px 6px -5px;
.messageCheckbox {
padding-top: 0.8em;
}
.senderParent {
flex: 1 0 45%;
} }
.subjectParent { .subjectParent {
@ -408,10 +426,6 @@ html:not(rl-mobile) {
width: calc(100% - 120px); width: calc(100% - 120px);
} }
.senderParent {
flex: 1 0 45%;
}
.flagParent { .flagParent {
order: 1; order: 1;
} }
@ -424,29 +438,4 @@ html:not(rl-mobile) {
order: 3; order: 3;
} }
} }
.messageList:not(.hideMessageListCheckbox) .subjectParent {
margin-left: 28px;
}
}
html:not(.rl-mobile):not(.rl-side-preview-pane) {
.messageListItem {
line-height: 25px;
flex-wrap: nowrap;
> * {
line-height: 25px;
}
.senderParent {
flex: 0 0 25%;
}
.subjectParent {
flex: 1 1 auto;
}
}
} }

2
dev/View/User/MailBox/MessageList.js
View file

@ -153,7 +153,7 @@ export class MailMessageList extends AbstractViewRight {
MessagelistUserStore.selectedMessage, MessagelistUserStore.selectedMessage,
MessagelistUserStore.focusedMessage, MessagelistUserStore.focusedMessage,
'.messageListItem .actionHandle', '.messageListItem .actionHandle',
'.messageListItem .checkboxMessage', '.messageListItem .messageCheckbox',
'.messageListItem.focused' '.messageListItem.focused'
); );

28
snappymail/v/0.0.0/app/templates/Views/User/MailMessageList.html
View file

@ -109,23 +109,19 @@
</div> </div>
<div class="messageListPlace" data-bind="dragmessages: 1, foreach: messageList" draggable="true"> <div class="messageListPlace" data-bind="dragmessages: 1, foreach: messageList" draggable="true">
<div class="messageListItem" data-bind="css: lineAsCss()"> <div class="messageListItem" data-bind="css: lineAsCss()">
<div class="checkboxMessage fontastic" data-bind="text: checked() ? '☑' : '☐'"></div> <div class="messageCheckbox">
<div class="checkboxMessage fontastic" data-bind="text: checked() ? '☑' : '☐'"></div>
<div class="flagParent fontastic"></div> </div><div>
<div class="flagParent fontastic"></div>
<div class="senderParent actionHandle" data-bind="attr: {'title': senderClearEmailsString}, text: senderEmailsString"></div> <div class="senderParent actionHandle" data-bind="attr: {'title': senderClearEmailsString}, text: senderEmailsString"></div>
<div class="subjectParent actionHandle" data-bind="text: subject"></div>
<div class="subjectParent actionHandle" data-bind="text: subject"></div> <div class="attachmentParent actionHandle">
<i data-bind="css: attachmentIconClass"></i>
<div class="attachmentParent actionHandle"> </div>
<i data-bind="css: attachmentIconClass"></i> <div class="sizeParent actionHandle" data-bind="text: friendlySize()"></div>
<div class="threads-len" data-bind="visible: 1 < threadsLen(), text: threadsLen"></div>
<time class="actionHandle" data-moment-format="SHORT" data-moment-format-title="FULL" data-bind="moment: dateTimeStampInUTC"></time>
</div> </div>
<div class="sizeParent actionHandle" data-bind="text: friendlySize()"></div>
<div class="threads-len" data-bind="visible: 1 < threadsLen(), text: threadsLen"></div>
<time class="actionHandle" data-moment-format="SHORT" data-moment-format-title="FULL" data-bind="moment: dateTimeStampInUTC"></time>
</div> </div>
</div> </div>
<div id="messagesDragImage"><span class="text"></span>&nbsp;<i class="icon-mail"></i></div> <div id="messagesDragImage"><span class="text"></span>&nbsp;<i class="icon-mail"></i></div>