Dereku/snappymail
1
0
Fork 0
mirror of https://github.com/the-djmaze/snappymail.git synced 2026-07-13 03:27:39 +03:00
Code Issues Projects Releases Packages Wiki Activity Actions

Improved attachment glyph handling

Browse source
This commit is contained in:
the-djmaze 2023-03-21 10:05:29 +01:00
parent 6b29460bdf
commit 50487af6a7
6 changed files with 18 additions and 23 deletions
Download patch file Download diff file Expand all files Collapse all files

2
dev/Model/Attachment.js
View file

@ -163,7 +163,7 @@ export class AttachmentModel extends AbstractModel {
thumbnailStyle() { thumbnailStyle() {
return this.hasThumbnail() return this.hasThumbnail()
? 'background:url(' + serverRequestRaw('ViewThumbnail', this.download) + ')' ? 'background:url(' + serverRequestRaw('ViewThumbnail', this.download) + ')'
: ''; : null;
} }
/** /**

16
dev/Styles/User/Attachments.less
View file

@ -100,21 +100,21 @@
} }
*/ */
.showPreview, .showPreplay, .showPreview,
.hasPreview:hover .iconMain, .hasPreview:hover .iconMain,
.hasPreplay:hover .iconMain, .hasPreview .hidePreview {
.hasPreview .hidePreview,
.hasPreplay .hidePreview {
display: none; display: none;
} }
.hasPreview:hover .iconPreview, .hasPreview:hover .iconPreview {
.hasPreplay:hover .iconPreview {
display: inline-block; display: inline-block;
} }
.hasPreview .showPreview, .hasPreplay:hover .iconMain::before {
.hasPreplay .showPreplay { content: "▶";
}
.hasPreview .showPreview {
display: inline; display: inline;
cursor: pointer; cursor: pointer;
} }

7
snappymail/v/0.0.0/app/templates/Views/User/MailMessageView.html
View file

@ -231,19 +231,14 @@
<ul class="attachmentList" data-bind="foreach: listAttachments"> <ul class="attachmentList" data-bind="foreach: listAttachments">
<li class="attachmentItem" draggable="true" <li class="attachmentItem" draggable="true"
data-bind="event: { 'dragstart': eventDragStart }, attr: { 'title': fileName }, css: {'checked': checked}"> data-bind="event: { 'dragstart': eventDragStart }, attr: { 'title': fileName }, css: {'checked': checked}">
<div class="attachmentIconParent" data-bind="css: { 'hasPreview': hasPreview(), 'hasPreplay': hasPreplay(), 'isImage': isImage() }"> <div class="attachmentIconParent" data-bind="css: { 'hasPreview': hasPreview(), 'hasPreplay': hasPreplay(), 'isImage': isImage() }, attr: { 'style': thumbnailStyle() }">
<i class="hidePreview iconMain" data-bind="css: iconClass()"></i> <i class="hidePreview iconMain" data-bind="css: iconClass()"></i>
<div class="showPreview"> <div class="showPreview">
<a data-bind="css: {'attachmentImagePreview': isImage()}, attr: { 'title': fileName, 'href': linkPreviewMain() }" target="_blank"> <a data-bind="css: {'attachmentImagePreview': isImage()}, attr: { 'title': fileName, 'href': linkPreviewMain() }" target="_blank">
<i class="iconMain" data-bind="visible: !hasThumbnail(), css: iconClass()"></i> <i class="iconMain" data-bind="visible: !hasThumbnail(), css: iconClass()"></i>
<div class="iconBG" data-bind="attr: { 'style': thumbnailStyle() }"></div>
<div class="iconPreview fontastic">👁</div> <div class="iconPreview fontastic">👁</div>
</a> </a>
</div> </div>
<div class="showPreplay">
<i class="iconMain" data-bind="css: iconClass()"></i>
<div class="iconPreview fontastic">▶</div>
</div>
</div> </div>
<div class="attachmentNameParent"> <div class="attachmentNameParent">
<div class="attachmentName" data-bind="text: fileName"></div> <div class="attachmentName" data-bind="text: fileName"></div>

BIN
vendors/fontastic/fonts/snappymail.woff vendored
View file

Binary file not shown.

BIN
vendors/fontastic/fonts/snappymail.woff2 vendored
View file

Binary file not shown.

16
vendors/fontastic/styles.css vendored
View file

@ -38,7 +38,7 @@
content: "\e005"; content: "\e005";
} }
.icon-paper-plane::before { .icon-paper-plane::before {
content: "\e007"; content: "📧";
} }
.icon-right-mini::before { .icon-right-mini::before {
content: "›"; content: "›";
@ -59,31 +59,31 @@
content: "\e030"; content: "\e030";
} }
.icon-file-presentation::before { .icon-file-presentation::before {
content: "\e031"; /* 📊 */ content: "📊";
} }
.icon-file-archive::before { .icon-file-archive::before {
content: "\e032"; content: "📦";
} }
.icon-file-audio::before { .icon-file-audio::before {
content: "\e033"; content: "🔊";
} }
.icon-file-text::before { .icon-file-text::before {
content: "📄"; content: "📄";
} }
.icon-file-image::before { .icon-file-image::before {
content: "\e036"; /* 🖻 */ content: "🖻";
} }
.icon-file-certificate::before { .icon-file-certificate::before {
content: "\e038"; content: "\e038"; /* 🔏 🔐 */
} }
.icon-attachment::before { .icon-attachment::before {
content: "📎"; content: "📎";
} }
.icon-file-spreadsheet::before { .icon-file-spreadsheet::before {
content: "\e03a"; content: "▦";
} }
.icon-file-video::before { .icon-file-video::before {
content: "\e03b"; content: "🎬";
} }
.icon-folder-add::before { .icon-folder-add::before {
content: "\e03c"; content: "\e03c";