diff options
author | hmhealey <harrisonmhealey@gmail.com> | 2015-10-20 17:31:20 -0400 |
---|---|---|
committer | hmhealey <harrisonmhealey@gmail.com> | 2015-10-23 13:05:38 -0400 |
commit | 4172d0286e61b4fd5459fc64e7653535751a012d (patch) | |
tree | 7fabd8e8d1642f3a660ee592c8d9931078b62de7 /web/react/components | |
parent | 4a1f6ad2a972bb0f30414db3dc1899d88a01d29b (diff) | |
download | chat-4172d0286e61b4fd5459fc64e7653535751a012d.tar.gz chat-4172d0286e61b4fd5459fc64e7653535751a012d.tar.bz2 chat-4172d0286e61b4fd5459fc64e7653535751a012d.zip |
Added styling to search autocomplete
Diffstat (limited to 'web/react/components')
-rw-r--r-- | web/react/components/search_autocomplete.jsx | 12 |
1 files changed, 11 insertions, 1 deletions
diff --git a/web/react/components/search_autocomplete.jsx b/web/react/components/search_autocomplete.jsx index 284b475c1..0229b07fd 100644 --- a/web/react/components/search_autocomplete.jsx +++ b/web/react/components/search_autocomplete.jsx @@ -90,11 +90,14 @@ export default class SearchAutocomplete extends React.Component { channels = channels.filter((channel) => channel.name.startsWith(this.state.filter)); } + channels.sort((a, b) => a.name.localeCompare(b.name)); + suggestions = channels.map((channel) => { return ( <div key={channel.id} onClick={this.handleClick.bind(this, channel.name)} + className='search-autocomplete__channel' > {channel.name} </div> @@ -107,12 +110,19 @@ export default class SearchAutocomplete extends React.Component { users = users.filter((user) => user.username.startsWith(this.state.filter)); } + users.sort((a, b) => a.username.localeCompare(b.username)); + suggestions = users.map((user) => { return ( <div key={user.id} onClick={this.handleClick.bind(this, user.username)} + className='search-autocomplete__user' > + <img + className='profile-img' + src={'/api/v1/users/' + user.id + '/image?time=' + user.update_at} + /> {user.username} </div> ); @@ -126,7 +136,7 @@ export default class SearchAutocomplete extends React.Component { return ( <div ref='container' - style={{overflow: 'visible', position: 'absolute', zIndex: '100', background: 'yellow'}} + className='search-autocomplete' > {suggestions} </div> |