diff options
Diffstat (limited to 'web')
-rw-r--r-- | web/react/components/navbar.jsx | 17 | ||||
-rw-r--r-- | web/react/components/search_results.jsx | 19 | ||||
-rw-r--r-- | web/sass-files/sass/partials/_navbar.scss | 3 |
3 files changed, 36 insertions, 3 deletions
diff --git a/web/react/components/navbar.jsx b/web/react/components/navbar.jsx index 1fcfabccd..845c33f3b 100644 --- a/web/react/components/navbar.jsx +++ b/web/react/components/navbar.jsx @@ -32,6 +32,7 @@ export default class Navbar extends React.Component { this.onChange = this.onChange.bind(this); this.handleLeave = this.handleLeave.bind(this); + this.showSearch = this.showSearch.bind(this); this.createCollapseButtons = this.createCollapseButtons.bind(this); this.createDropdown = this.createDropdown.bind(this); @@ -100,6 +101,11 @@ export default class Navbar extends React.Component { $('.inner__wrap').toggleClass('move--left-small'); $('.sidebar--menu').toggleClass('move--left'); } + showSearch() { + AppDispatcher.handleServerAction({ + type: ActionTypes.SHOW_SEARCH + }); + } onChange() { this.setState(this.getStateFromStores()); $('#navbar .navbar-brand .description').popover({placement: 'bottom', trigger: 'click', html: true}); @@ -411,6 +417,16 @@ export default class Navbar extends React.Component { var collapseButtons = this.createCollapseButtons(currentId); + const searchButton = ( + <button + type='button' + className='navbar-toggle pull-right' + onClick={this.showSearch} + > + <span className='glyphicon glyphicon-search icon--white' /> + </button> + ); + var channelMenuDropdown = this.createDropdown(channel, channelTitle, isAdmin, isDirect, popoverContent); return ( @@ -422,6 +438,7 @@ export default class Navbar extends React.Component { <div className='container-fluid theme'> <div className='navbar-header'> {collapseButtons} + {searchButton} {channelMenuDropdown} </div> </div> diff --git a/web/react/components/search_results.jsx b/web/react/components/search_results.jsx index f4d8647db..491995087 100644 --- a/web/react/components/search_results.jsx +++ b/web/react/components/search_results.jsx @@ -80,14 +80,27 @@ export default class SearchResults extends React.Component { var ctls = null; - if (noResults) { + if (!searchTerm && noResults) { + ctls = ( + <div className='sidebar--right__subheader'> + <ul> + <li> + {'Use '}<b>{'"quotation marks"'}</b>{' to search for phrases'} + </li> + <li> + {'Use '}<b>{'from:'}</b>{' to find posts from specific users and '}<b>{'in:'}</b>{' to find posts in specific channels'} + </li> + </ul> + </div> + ); + } else if (noResults) { ctls = ( <div className='sidebar--right__subheader'> <h4>{'NO RESULTS'}</h4> <ul> - <li>If you're searching a partial phrase (ex. searching "rea", looking for "reach" or "reaction"), append a * to your search term</li> - <li>Due to the volume of results, two letter searches and common words like "this", "a" and "is" won't appear in search results</li> + <li>{'If you\'re searching a partial phrase (ex. searching "rea", looking for "reach" or "reaction"), append a * to your search term'}</li> + <li>{'Due to the volume of results, two letter searches and common words like "this", "a" and "is" won\'t appear in search results'}</li> </ul> </div> ); diff --git a/web/sass-files/sass/partials/_navbar.scss b/web/sass-files/sass/partials/_navbar.scss index c06feffcf..c570c4663 100644 --- a/web/sass-files/sass/partials/_navbar.scss +++ b/web/sass-files/sass/partials/_navbar.scss @@ -33,6 +33,9 @@ background: #fff; width: 21px; } + .icon--white { + color: #fff; + } &:hover, &:active, &:focus { background: inherit; } |