fix(quick-actions): change styles and only archie/trash

Summary: Fixes T2875

Test Plan: manual

Reviewers: bengotow, dillon

Reviewed By: dillon

Maniphest Tasks: T2875

Differential Revision: https://phab.nylas.com/D2041
This commit is contained in:
Evan Morikawa 2015-09-18 17:43:49 -04:00
parent d771bb273c
commit 1761a81549
4 changed files with 14 additions and 12 deletions

View file

@ -17,13 +17,12 @@ class ThreadListQuickActions extends React.Component
render: =>
actions = []
actions.push <div key="reply" className="action action-reply" onClick={@_onReply}></div>
actions.push <div key="fwd" className="action action-forward" onClick={@_onForward}></div>
if @_shouldDisplayArchiveButton()
actions.push <div key="archive" className="action action-archive" onClick={@_onArchive}></div>
actions.push <div key="archive" className="btn action action-archive" onClick={@_onArchive}></div>
else if AccountStore.current().usesLabels() and @props.categoryId == CategoryStore.getStandardCategory('all').id
actions.push <div key="trash" className="action action-trash" onClick={@_onTrash}></div>
actions.push <div key="trash" className="btn action action-trash" onClick={@_onTrash}></div>
return [] if actions.length is 0
<div className="inner">
{actions}
</div>

View file

@ -219,24 +219,24 @@
display:inline-block;
background-size: 100%;
zoom:0.5;
width:42px;
height:42px;
margin:16px;
width: 81px;
height: 57px;
margin: 9px 16px 0 16px;
}
.action:last-child {
margin-right:40px;
}
.action.action-reply {
background: url(../static/images/thread-list-quick-actions/ic-quick-button-reply@2x.png) top left no-repeat;
background: url(../static/images/thread-list-quick-actions/ic-quick-button-reply@2x.png) top left no-repeat, @background-gradient;
}
.action.action-forward {
background: url(../static/images/thread-list-quick-actions/ic-quick-button-forward@2x.png) top left no-repeat;
background: url(../static/images/thread-list-quick-actions/ic-quick-button-forward@2x.png) top left no-repeat, @background-gradient;
}
.action.action-archive {
background: url(../static/images/thread-list-quick-actions/ic-quick-button-archive@2x.png) top left no-repeat;
background: url(../static/images/thread-list-quick-actions/ic-quick-button-archive@2x.png) center no-repeat, @background-gradient;
}
.action.action-trash {
background: url(../static/images/thread-list-quick-actions/ic-quick-button-trash@2x.png) top left no-repeat;
background: url(../static/images/thread-list-quick-actions/ic-quick-button-trash@2x.png) center no-repeat, @background-gradient;
}
}
.thread-list .list-item:hover .list-column-HoverActions {

View file

@ -16,7 +16,7 @@ button, html input[type="button"] {
display:inline-block;
color: @btn-default-text-color;
img.content-mask { background-color:@btn-default-text-color; }
background: linear-gradient(to top, rgba(241,241,241,0.75) 0%, rgba(253,253,253,0.75) 100%);
background: @background-gradient;
// Use 4 box shadows to create a 0.5px hairline around the button, and another
// for the actual shadow. Pending https://code.google.com/p/chromium/issues/detail?id=236371

View file

@ -452,6 +452,9 @@
@background-color-error: @red;
@background-color-pending: @light-gray;
@background-gradient: linear-gradient(to top, rgba(241,241,241,0.75) 0%,
rgba(253,253,253,0.75) 100%);
@base-border-color: darken(@background-color, 15%);
@border-color: darken(@background-color, 15%);
@border-color-subtle: darken(@background-color, 8%);