mirror of
https://github.com/the-djmaze/snappymail.git
synced 2026-09-07 16:37:02 +03:00
Reduce excessive DOM a bit
This commit is contained in:
parent
0659b126e7
commit
00bc92f4c7
2 changed files with 17 additions and 38 deletions
|
|
@ -275,10 +275,6 @@ html.rl-no-preview-pane {
|
||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.flagParent {
|
|
||||||
padding: 0 10px 0 5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
time, .sizeParent {
|
time, .sizeParent {
|
||||||
margin: 0 5px;
|
margin: 0 5px;
|
||||||
opacity: 0.6;
|
opacity: 0.6;
|
||||||
|
|
@ -286,10 +282,6 @@ html.rl-no-preview-pane {
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
}
|
}
|
||||||
|
|
||||||
.threadsParent {
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
|
|
||||||
.attachmentParent {
|
.attachmentParent {
|
||||||
position: relative;
|
position: relative;
|
||||||
margin: 2px 10px 0 5px;
|
margin: 2px 10px 0 5px;
|
||||||
|
|
@ -345,11 +337,9 @@ html.rl-no-preview-pane {
|
||||||
|
|
||||||
.threads-len {
|
.threads-len {
|
||||||
.threads-len-data {
|
.threads-len-data {
|
||||||
|
|
||||||
border-radius: 6px;
|
border-radius: 6px;
|
||||||
padding: 2px 0 1px 4px;
|
padding: 2px 0 1px 4px;
|
||||||
border: 1px solid #ccc;
|
border: 1px solid #ccc;
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
background-color: rgba(127,127,127,0.3);
|
background-color: rgba(127,127,127,0.3);
|
||||||
border-color: #666;
|
border-color: #666;
|
||||||
|
|
@ -357,17 +347,6 @@ html.rl-no-preview-pane {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.flagOff {
|
|
||||||
opacity: 0.5;
|
|
||||||
&:hover {
|
|
||||||
opacity: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.flagOn, .flagOnHalf {
|
|
||||||
color: orange;
|
|
||||||
}
|
|
||||||
|
|
||||||
.replyFlag, .forwardFlag {
|
.replyFlag, .forwardFlag {
|
||||||
display: none;
|
display: none;
|
||||||
margin-right: 0.25em;
|
margin-right: 0.25em;
|
||||||
|
|
@ -424,10 +403,19 @@ html.rl-no-preview-pane {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
&:not(.flagged) .flagOn,
|
.flagParent {
|
||||||
&:not(.hasFlaggedSubMessage) .flagOnHalf,
|
padding: 0 10px 0 5px;
|
||||||
&.flagged .flagOff, &.hasFlaggedSubMessage .flagOff {
|
}
|
||||||
display: none;
|
&.flagged .flagParent::after,
|
||||||
|
&.hasFlaggedSubMessage .flagParent::after {
|
||||||
|
color: orange;
|
||||||
|
content: '★'; /*⚑*/
|
||||||
|
}
|
||||||
|
&:not(.flagged):not(.hasFlaggedSubMessage) .flagParent::after {
|
||||||
|
content: '☆'; /*⚐*/
|
||||||
|
}
|
||||||
|
&:not(.flagged):not(.hasFlaggedSubMessage) .flagParent:not(:hover) {
|
||||||
|
opacity: 0.5;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -203,12 +203,7 @@
|
||||||
<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="checkboxMessage fontastic" data-bind="text: checked() ? '☑' : '☐'"></div>
|
||||||
|
|
||||||
<div class="flagParent">
|
<div class="flagParent fontastic"><!-- ☆★⚐⚑ --></div>
|
||||||
<i class="flagOn fontastic">★</i>
|
|
||||||
<i class="flagOnHalf fontastic">☆</i>
|
|
||||||
<i class="flagOff fontastic">☆</i>
|
|
||||||
<!-- ⚐⚑ -->
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="senderParent actionHandle">
|
<div class="senderParent actionHandle">
|
||||||
<i class="replyFlag fontastic">←</i>
|
<i class="replyFlag fontastic">←</i>
|
||||||
|
|
@ -228,13 +223,9 @@
|
||||||
|
|
||||||
<div class="sizeParent actionHandle" data-bind="text: friendlySize()"></div>
|
<div class="sizeParent actionHandle" data-bind="text: friendlySize()"></div>
|
||||||
|
|
||||||
<div class="threadsParent" data-bind="visible: 1 < threadsLen()">
|
<div class="threads-len" data-bind="visible: 1 < threadsLen()">
|
||||||
<span class="threads-len">
|
<span data-bind="text: threadsLen"></span>
|
||||||
<span class="threads-len-data">
|
›
|
||||||
<span data-bind="text: threadsLen"></span>
|
|
||||||
<i class="icon-right-mini"></i>
|
|
||||||
</span>
|
|
||||||
</span>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<time class="actionHandle" data-moment-format="SHORT" data-moment-format-title="FULL" data-bind="moment: dateTimeStampInUTC"></time>
|
<time class="actionHandle" data-moment-format="SHORT" data-moment-format-title="FULL" data-bind="moment: dateTimeStampInUTC"></time>
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue