Foundry376/Mailspring
1
1
Fork 0
mirror of https://github.com/Foundry376/Mailspring.git synced 2025-02-01 04:50:59 +08:00
Code Issues Projects Releases Packages Wiki Activity

Add background to thread list that makes scrolling on slow machines less jarring

Browse source
This commit is contained in:
Ben Gotow 2018-12-28 23:06:22 -05:00
parent f79d82b424
commit 8a18d2eb4f
2 changed files with 10 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
app/src/components/list-tabular.jsx
View file

@ -349,7 +349,6 @@ class ListTabular extends Component {
} = this.props;
const { count, loaded, empty } = this.state;
const rows = this.getRowsToRender();
const innerStyles = { height: count * itemHeight };
return (
<div className={`list-container list-tabular ${className}`}>
@ -366,7 +365,10 @@ class ListTabular extends Component {
columns={columns}
draggable={draggable}
itemHeight={itemHeight}
innerStyles={innerStyles}
innerStyles={{
height: count * itemHeight,
backgroundSize: `100% ${this.props.itemHeight}px`,
}}
onClick={onClick}
onSelect={onSelect}
onDragEnd={onDragEnd}

6
app/static/components/list-tabular.less
View file

@ -77,6 +77,12 @@
}
.list-container {
.list-rows {
// Note: This fills empty / unrendered space with the dividers.
// background-size needs to be provided.
background: linear-gradient(to top, @list-border 0px, @list-bg 1px) repeat;
}
.list-rows > div {
// Note: This allows rows to be animated in and out!
transition: top ease-out 120ms;