mirror of
https://github.com/the-djmaze/snappymail.git
synced 2024-11-10 17:13:38 +08:00
Cleanup attachments design
This commit is contained in:
parent
3ef494c971
commit
9ec84baa32
3 changed files with 12 additions and 23 deletions
|
@ -41,7 +41,7 @@
|
|||
}
|
||||
|
||||
&.error {
|
||||
.attachmentIcon, .attachmentSize, .attachmentName {
|
||||
.iconMain, .iconPreview, .attachmentSize, .attachmentName {
|
||||
color: red;
|
||||
}
|
||||
}
|
||||
|
@ -91,11 +91,10 @@
|
|||
border-left: 1px solid #ddd;
|
||||
}
|
||||
|
||||
.attachmentIcon {
|
||||
margin: 6px 0 0;
|
||||
.iconMain, .iconPreview {
|
||||
box-sizing: border-box;
|
||||
padding: 6px 0 0;
|
||||
font-size: 36px;
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
color: #aaa;
|
||||
|
||||
&.icon-none {
|
||||
|
@ -125,7 +124,7 @@
|
|||
}
|
||||
|
||||
.attachmentIconParent.hasPreview .showPreview,
|
||||
.attachmentIconParent.hasPreplay .showPreview {
|
||||
.attachmentIconParent.hasPreplay .showPreplay {
|
||||
display: inline;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
|
|
@ -276,25 +276,17 @@
|
|||
<li class="attachmentItem" draggable="true"
|
||||
data-bind="visible: !isLinked, event: { 'dragstart': eventDragStart }, attr: { 'title': fileName }, css: {'checked': checked}">
|
||||
<div class="attachmentIconParent" data-bind="css: { 'hasPreview': hasPreview(), 'hasPreplay': hasPreplay(), 'isImage': isImage() }">
|
||||
<div class="hidePreview">
|
||||
<div class="iconMain">
|
||||
<i class="attachmentIcon" data-bind="css: iconClass()"></i>
|
||||
</div>
|
||||
</div>
|
||||
<i class="hidePreview iconMain" data-bind="css: iconClass()"></i>
|
||||
<div class="showPreview">
|
||||
<a data-bind="click: $root.attachmentPreview, css: {'attachmentImagePreview': isImage(), 'visible': !isLinked}, attr: { 'title': fileName, 'href': linkPreviewMain() }" target="_blank">
|
||||
<div class="iconMain">
|
||||
<i class="attachmentIcon" data-bind="css: iconClass()"></i>
|
||||
</div>
|
||||
<a data-bind="css: {'attachmentImagePreview': isImage()}, attr: { 'title': fileName, 'href': linkPreviewMain() }" target="_blank">
|
||||
<i class="iconMain" data-bind="css: iconClass()"></i>
|
||||
<div class="iconBG" data-bind="attr: { 'style': linkThumbnailPreviewStyle() }"></div>
|
||||
<div class="iconPreview attachmentIcon fontastic show-hover">👁</div>
|
||||
<div class="iconPreview fontastic">👁</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="showPreplay">
|
||||
<div class="iconMain">
|
||||
<i class="attachmentIcon" data-bind="css: iconClass()"></i>
|
||||
</div>
|
||||
<div class="iconPreview attachmentIcon fontastic show-hover">▶</div>
|
||||
<i class="iconMain" data-bind="css: iconClass()"></i>
|
||||
<div class="iconPreview fontastic">▶</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="attachmentNameParent">
|
||||
|
|
|
@ -168,9 +168,7 @@
|
|||
<ul class="attachmentList" data-bind="foreach: attachments">
|
||||
<li class="attachmentItem" data-bind="attr: { 'title': title }, css: { 'waiting': waiting, 'error': '' !== error() }">
|
||||
<div class="attachmentIconParent">
|
||||
<div class="iconMain">
|
||||
<i class="attachmentIcon" data-bind="css: iconClass(), visible: !uploading() || 0 === progress()"></i>
|
||||
</div>
|
||||
<i class="iconMain" data-bind="css: iconClass(), visible: !uploading() || 0 === progress()"></i>
|
||||
<div class="iconProgress" data-bind="attr: { 'style': progressStyle }, visible: uploading"></div>
|
||||
<div class="iconBG" data-bind="text: progressText, visible: uploading"></div>
|
||||
</div>
|
||||
|
|
Loading…
Reference in a new issue