💄(thread-list): Correct top border on selected threads. Fixes #1189

This commit is contained in:
Ben Gotow 2016-02-02 11:12:13 -08:00
parent 460956bc37
commit fd9850b74d
4 changed files with 20 additions and 4 deletions

View file

@ -140,6 +140,9 @@
.snippet {
color: @text-color-subtle;
}
}
.unread:not(.focused):not(.selected):not(.next-is-selected) {
.list-column {
border-bottom: 1px solid @list-border;
}

View file

@ -139,7 +139,7 @@ class ListTabular extends React.Component
<ListTabularItem key={item.id ? idx}
item={item}
itemProps={@props.itemPropsProvider?(item) ? {}}
itemProps={@props.itemPropsProvider?(item, idx) ? {}}
metrics={top: idx * @props.itemHeight, height: @props.itemHeight}
columns={@props.columns}
onSelect={@props.onSelect}

View file

@ -95,11 +95,18 @@ class MultiselectList extends React.Component
if @props.dataSource and @state.handler
className += " " + @state.handler.cssClass()
@itemPropsProvider ?= (item) =>
props = @props.itemPropsProvider(item)
@itemPropsProvider ?= (item, idx) =>
selectedIds = @props.dataSource.selection.ids()
selected = item.id in selectedIds
if not selected
nextId = @props.dataSource.get(idx + 1)?.id
nextSelected = nextId in selectedIds
props = @props.itemPropsProvider(item, idx)
props.className ?= ''
props.className += " " + classNames
'selected': item.id in @props.dataSource.selection.ids()
'selected': selected
'next-is-selected': not selected and nextSelected
'focused': @state.handler.shouldShowFocus() and item.id is @props.focusedId
'keyboard-cursor': @state.handler.shouldShowKeyboardCursor() and item.id is @props.keyboardCursorId
props['data-item-id'] = item.id

View file

@ -96,6 +96,12 @@
}
}
&.next-is-selected {
.list-column {
border-bottom: 1px solid @list-selected-border;
}
}
&.focused {
background: @list-focused-bg;
color: @list-focused-color;