secstate/Iris
Public Access
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

Simplified lists for mobile

Browse Source
This commit is contained in:
James Barnsley
2017-07-17 08:27:39 +12:00
parent d757792495
commit 18de6f9117
2 changed files with 42 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

61
src/js/views/library/LibraryPlaylists.js
View File

@ -88,28 +88,44 @@ class LibraryPlaylists extends React.Component{
} }
if( this.props.view == 'list' ){ if( this.props.view == 'list' ){
var columns = [ if (this.props.slim_mode){
{ var columns = [
label: 'Name', {
name: 'name' label: 'Name',
}, name: 'name'
{ },
label: 'Owner', {
name: 'owner' label: 'Tracks',
}, name: 'tracks_total'
{ }
label: 'Source', ]
name: 'source' } else {
}, var columns = [
{ {
label: 'Tracks', label: 'Name',
name: 'tracks_total' name: 'name'
}, },
{ {
label: 'Editable', label: 'Owner',
name: 'can_edit' name: 'owner'
} },
] {
label: 'Source',
name: 'source'
},
{
label: 'Tracks',
name: 'tracks_total'
},
{
label: 'Editable',
name: 'can_edit'
}
]
}
console.log(columns)
return ( return (
<section className="content-wrapper"> <section className="content-wrapper">
<List <List
@ -212,6 +228,7 @@ class LibraryPlaylists extends React.Component{
const mapStateToProps = (state, ownProps) => { const mapStateToProps = (state, ownProps) => {
return { return {
slim_mode: state.ui.slim_mode,
load_queue: state.ui.load_queue, load_queue: state.ui.load_queue,
me_id: (state.spotify.me ? state.spotify.me.id : (state.ui.config && state.ui.config.spotify_username ? state.ui.config.spotify_username : false)), me_id: (state.spotify.me ? state.spotify.me.id : (state.ui.config && state.ui.config.spotify_username ? state.ui.config.spotify_username : false)),
view: state.ui.library_playlists_view, view: state.ui.library_playlists_view,

5
src/scss/components/_lists.scss
View File

@ -253,7 +253,7 @@
text-align: right; text-align: right;
} }
&:not(.name):not(.duration){ &:not(.name):not(.duration):not(.album){
color: $mid_grey; color: $mid_grey;
display: inline; display: inline;
width: auto !important; width: auto !important;
@ -261,7 +261,7 @@
word-wrap: break-word; word-wrap: break-word;
} }
&:not(.name):not(.duration):not(:nth-child(2)){ &:not(.name):not(.duration):not(.album):not(:nth-child(2)){
@include bullet(); @include bullet();
} }
@ -277,6 +277,7 @@
content: '% popularity'; content: '% popularity';
} }
&.album,
&.can_edit, &.can_edit,
&.release_date { &.release_date {
display: none; display: none;