Mailspring/internal_packages/attachments/stylesheets/attachments.less
Evan Morikawa a31c2808a9 fix(composer): make uploading attachments work
Summary:
There were several issues causing uploading to not work:

  # The file upload response came back as a string instead of an Object. Needed to detect and `JSON.parse`
  # The `MessageAttachment` component was not available as a package on the popout composer (since it used to be inside of `MessageList`)
  # The `message.draft` bit was not set properly causing the DB changes to be ignored
  # The actions notifying of `uploadStateChanged` were only being broadcasted in the main window (where the `TaskStore` is) and never making it to the popout composer.

Also keybindings for close window and up & down arrows were fixed.

Test Plan: edgehill --test

Reviewers: bengotow

Reviewed By: bengotow

Differential Revision: https://review.inboxapp.com/D1157
2015-02-06 17:41:59 -05:00

85 lines
1.6 KiB
Text

@import "ui-variables";
@import "ui-mixins";
.attachment-file-wrap {
display: inline-block;
position: relative;
font-size: @minor-font-size;
margin-bottom: 0.5em;
margin-right: 0.5em;
&:hover {
.attachment-file-actions {
visibility: visible;
}
}
.attachment-download-bar-wrap {
display:none;
}
&.pending, &.started, &.progress, &.downloading {
// When downloading is in progress.
color: @text-color-subtle;
.attachment-file-and-name:hover {
cursor: default;
color: @text-color-subtle;
}
.attachment-file-actions {
visibility: visible;
margin-left: 0.4em;
}
.btn.btn-icon.attachment-icon {
font-size: 14px;
padding-bottom: 3px;
}
}
.attachment-file-and-name {
position: relative;
z-index: 2;
&:hover {
color: @text-color-link;
cursor: pointer;
}
}
.attachment-file-actions {
position: relative;
z-index: 2;
visibility: hidden;
margin-left: 0.3em;
}
.attachment-download-progress,
.attachment-upload-progress {
position: absolute;
left: 0;
bottom: -2px;
height: 2px;
width: 0; // Changed by React
z-index: 3;
display: block;
background: @progress-bar-fill;
}
.attachment-bar-bg {
position: absolute;
left: 0;
bottom: -2px;
height: 2px;
width: 100%;
z-index: 2;
display: block;
background: @progress-bar-background;
}
.btn.btn-icon.attachment-icon {
margin: 0;
padding: 0;
line-height: 1;
height: auto;
font-size: 18px;
}
}