Tweaking font sizes and grid BEM
This commit is contained in:
@ -28,9 +28,9 @@ class AlbumGrid extends React.Component{
|
||||
|
||||
render(){
|
||||
if (this.props.albums){
|
||||
var className = "grid album-grid"
|
||||
var className = "grid grid--albums"
|
||||
if (this.props.className) className += ' '+this.props.className
|
||||
if (this.props.single_row) className += ' single-row'
|
||||
if (this.props.single_row) className += ' grid--single-row'
|
||||
|
||||
return (
|
||||
<div className={className}>
|
||||
|
||||
@ -36,9 +36,9 @@ class ArtistGrid extends React.Component{
|
||||
|
||||
render(){
|
||||
if (this.props.artists){
|
||||
var className = "grid artist-grid"
|
||||
var className = "grid grid--artists"
|
||||
if (this.props.className) className += ' '+this.props.className
|
||||
if (this.props.single_row) className += ' single-row'
|
||||
if (this.props.single_row) className += ' grid--single-row'
|
||||
|
||||
return (
|
||||
<div className={className}>
|
||||
|
||||
@ -13,7 +13,7 @@ export default class CategoryGrid extends React.Component{
|
||||
render(){
|
||||
if (!this.props.categories ) return null
|
||||
|
||||
var className = "grid category-grid"
|
||||
var className = "grid grid--categories"
|
||||
if (this.props.className ) className += ' '+this.props.className
|
||||
return (
|
||||
<div className={className}>
|
||||
|
||||
@ -108,12 +108,12 @@ export default class GridItem extends React.Component{
|
||||
}
|
||||
|
||||
return (
|
||||
<div className={"grid-item "+this.props.type+"-grid-item"} onClick={e => this.handleClick(e)} onContextMenu={e => this.handleContextMenu(e)}>
|
||||
<Thumbnail size="medium" images={images} />
|
||||
<div className="name">
|
||||
<div className={"grid__item grid__item--"+this.props.type} onClick={e => this.handleClick(e)} onContextMenu={e => this.handleContextMenu(e)}>
|
||||
<Thumbnail size="medium" className="grid__item__thumbnail" images={images} />
|
||||
<div className="grid__item__name">
|
||||
{item.name ? item.name : <span className="opaque-text">{item.uri}</span>}
|
||||
</div>
|
||||
<div className="secondary">
|
||||
<div className="grid__item__secondary">
|
||||
{this.props.show_source_icon ? <Icon name={helpers.sourceIcon(item.uri)} type="fontawesome" className="source" /> : null}
|
||||
{this.renderSecondary(item)}
|
||||
</div>
|
||||
|
||||
@ -29,9 +29,9 @@ class PlaylistGrid extends React.Component{
|
||||
render(){
|
||||
if (!this.props.playlists ) return null
|
||||
|
||||
var className = "grid playlist-grid"
|
||||
var className = "grid grid--playlists"
|
||||
if (this.props.className) className += ' '+this.props.className
|
||||
if (this.props.single_row) className += ' single-row'
|
||||
if (this.props.single_row) className += ' grid--single-row'
|
||||
return (
|
||||
<div className={className}>
|
||||
{
|
||||
|
||||
Reference in New Issue
Block a user