f.weber/homebrewery
0
0
Fork 0
mirror of https://github.com/naturalcrit/homebrewery.git synced 2026-01-07 16:22:42 +00:00
Code Wiki Activity

move dir button next to active sort option

Browse Source
This commit is contained in:
Gazook89
2022-09-13 12:26:28 -05:00
parent 46a45a8536
commit cfdbe06d07
2 changed files with 40 additions and 52 deletions
Download Patch File Download Diff File Expand all files Collapse all files

48
client/homebrew/pages/basePages/listPage/listPage.jsx
View File

@@ -114,14 +114,23 @@ const ListPage = createClass({
},
renderSortOption : function(sortTitle, sortValue){
return <div>
<button
value={`${sortValue}`}
onClick={this.handleSortOptionChange}
className={`${(this.state.sortType == sortValue ? 'active' : '')}`}
>
{`${sortTitle}`}
</button>
return <div className='sort-option'>
<button
value={`${sortValue}`}
onClick={this.handleSortOptionChange}
className={`${(this.state.sortType == sortValue ? 'active' : '')}`}
>
{`${sortTitle}`}
</button>
{this.state.sortType == sortValue ?
<button
onClick={this.handleSortDirChange}
className='sortDir'
>
{this.state.sortDir == 'asc' ? <i className='fas fa-sort-amount-up'></i> : <i className='fas fa-sort-amount-down'></i>}
</button>
: ''
}
</div>;
},
@@ -165,26 +174,17 @@ const ListPage = createClass({
renderSortOptions : function(){
return <div className='sort-container'>
<h6>Sort by :</h6>
{this.renderSortOption('Title', 'alpha')}
{this.renderSortOption('Created Date', 'created')}
{this.renderSortOption('Updated Date', 'updated')}
{this.renderSortOption('Views', 'views')}
{/* {this.renderSortOption('Latest', 'latest')} */}
<h6>Sort by :</h6>
{this.renderSortOption('Title', 'alpha')}
{this.renderSortOption('Created Date', 'created')}
{this.renderSortOption('Updated Date', 'updated')}
{this.renderSortOption('Views', 'views')}
{/* {this.renderSortOption('Latest', 'latest')} */}
<h6>Direction :</h6>
{this.renderFilterOption()}
<button
onClick={this.handleSortDirChange}
className='sortDir'
>
{`${(this.state.sortDir == 'asc' ? '\u25B2 ASC' : '\u25BC DESC')}`}
</button>
{this.renderFilterOption()}
</div>;
},