Foundry376/Mailspring
1
1
Fork 0
mirror of https://github.com/Foundry376/Mailspring.git synced 2024-09-21 07:46:06 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(account-sidebar): make folder and label names wrap elegantly. fixes T3402.

Browse source 
Summary:
WIP: changing the rest of items to make them look correct

fix last draft item in sidebar

add more padding

Test Plan: tested manually. all tests remain green.

Reviewers: evan, bengotow

Reviewed By: bengotow

Maniphest Tasks: T3402

Differential Revision: https://phab.nylas.com/D1943
This commit is contained in:
dillon 2015-08-31 10:47:25 -07:00
parent 9c5281d11d
commit b39789ad10
5 changed files with 15 additions and 11 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
internal_packages/account-sidebar/lib/account-sidebar-category-item.cjsx
View file

@ -48,8 +48,8 @@ class AccountSidebarCategoryItem extends React.Component
onDrop={@_onDrop}>
{unread}
{@_renderIcon()}
<span className="name"> {@props.item.displayName}</span>
<div className="icon">{@_renderIcon()}</div>
<div className="name">{@props.item.displayName}</div>
</DropZone>
_renderIcon: ->

2
internal_packages/account-sidebar/lib/account-sidebar-item.cjsx
View file

@ -7,7 +7,7 @@ class AccountSidebarItem extends React.Component
render: =>
className = "item " + if @props.select then " selected" else ""
<div className={className} onClick={@_onClick} id={@props.item.id}>
<span className="name"> {@props.item.displayName}</span>
<div className="name">{@props.item.displayName}</div>
</div>
_onClick: (event) =>

4
internal_packages/account-sidebar/lib/account-sidebar-sheet-item.cjsx
View file

@ -23,8 +23,8 @@ class AccountSidebarSheetItem extends React.Component
icon = <RetinaImg name={"folder.png"} mode={RetinaImg.Mode.ContentIsMask} />
<div className={classSet} onClick={@_onClick}>
{icon}
<span className="name"> {@props.item.name}</span>
<div className="icon">{icon}</div>
<div className="name">{@props.item.name}</div>
</div>
_onClick: (event) =>

12
internal_packages/account-sidebar/stylesheets/account-sidebar.less
View file

@ -67,9 +67,7 @@
font-weight: 400;
padding: 0 @spacing-standard;
line-height: @line-height-large * 1.1;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
clear: both;
.unread {
font-weight: @font-weight-medium;
@ -77,11 +75,17 @@
background: @source-list-active-color;
margin-left:@padding-small-horizontal;
}
.icon {
float: left;
}
.name {
text-transform: capitalize;
margin-left: @padding-xs-horizontal;
padding-left: @padding-small-horizontal;
position:relative;
top:1px;
overflow: hidden;
padding-top: @padding-small-vertical;
line-height: @line-height-small;
}
&.selected {
background: @source-list-active-bg;

4
internal_packages/thread-list/lib/draft-list-sidebar-item.cjsx
View file

@ -32,8 +32,8 @@ class DraftListSidebarItem extends React.Component
unread = <div className="unread item-count-box">{@state.count}</div>
<div className={classSet} onClick={@_onClick}>
<RetinaImg name={'drafts.png'} mode={RetinaImg.Mode.ContentIsMask} />
<span className="name"> {@props.item.name}</span>
<div className="icon"><RetinaImg name={'drafts.png'} mode={RetinaImg.Mode.ContentIsMask} /></div>
<div className="name"> {@props.item.name}</div>
{unread}
</div>