Artist responsive
This commit is contained in:
@ -72,9 +72,9 @@ class Queue extends React.Component{
|
||||
var link = null
|
||||
if( this.props.current_track.album.uri ) link = '/album/'+this.props.current_track.album.uri
|
||||
return (
|
||||
<Link className={this.props.radio_enabled ? 'artwork radio-enabled' : 'artwork'} to={link} onContextMenu={e => this.handleContextMenu(e,this.props.current_track.album)}>
|
||||
<Link className={this.props.radio_enabled ? 'artwork radio-enabled' : 'artwork'} to={link}>
|
||||
{this.props.radio_enabled ? <img className="radio-overlay" src="assets/radio-overlay.png" /> : null}
|
||||
<Thumbnail size="huge" image={image} canZoom />
|
||||
<Thumbnail size="huge" image={image} />
|
||||
</Link>
|
||||
)
|
||||
}
|
||||
|
||||
@ -115,12 +115,12 @@
|
||||
@include responsive( 799px, 500px ){
|
||||
&.mini{
|
||||
.grid-item {
|
||||
@include grid_item( 6 )
|
||||
@include grid_item( 6, 3%, 5% )
|
||||
}
|
||||
}
|
||||
&:not(.mini){
|
||||
.grid-item {
|
||||
@include grid_item( 3 )
|
||||
@include grid_item( 3, 3%, 5% )
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -128,12 +128,12 @@
|
||||
@include responsive( 499px ){
|
||||
&.mini{
|
||||
.grid-item {
|
||||
@include grid_item( 3 )
|
||||
@include grid_item( 3, 4%, 5% )
|
||||
}
|
||||
}
|
||||
&:not(.mini){
|
||||
.grid-item {
|
||||
@include grid_item( 2 )
|
||||
@include grid_item( 2, 4%, 5% )
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -127,10 +127,10 @@ $bp_shallow: 650px;
|
||||
* Produces most album/playlist/artist grids
|
||||
**/
|
||||
|
||||
@mixin grid_item( $cols, $gap: 2% ){
|
||||
@mixin grid_item( $cols, $gap: 2%, $bottom_margin: 3% ){
|
||||
width: ( 0% + ( 100 / $cols ) - ( $gap * 2 ) + ( ( $gap * 2 ) / $cols ) );
|
||||
box-sizing: border-box;
|
||||
margin: 0 $gap 3%;
|
||||
margin: 0 $gap $bottom_margin;
|
||||
|
||||
&:nth-child(#{$cols}n-#{$cols}) {
|
||||
margin-right: 0;
|
||||
|
||||
@ -95,15 +95,13 @@
|
||||
margin-bottom: 0;
|
||||
|
||||
.parallax {
|
||||
canvas {
|
||||
@include blur(5px);
|
||||
}
|
||||
height: 60vh;
|
||||
}
|
||||
|
||||
.liner {
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
padding-top: 10vh;
|
||||
padding-top: 30vh;
|
||||
|
||||
.thumbnail {
|
||||
position: static;
|
||||
@ -133,7 +131,11 @@
|
||||
}
|
||||
}
|
||||
.body {
|
||||
|
||||
&.overview {
|
||||
h4 {
|
||||
display: none;
|
||||
}
|
||||
.col.w70 {
|
||||
width: 100%;
|
||||
}
|
||||
@ -141,6 +143,9 @@
|
||||
.related-artists {
|
||||
display: none;
|
||||
}
|
||||
.grid-wrapper {
|
||||
padding-top: 40px !important;
|
||||
}
|
||||
}
|
||||
|
||||
&.about {
|
||||
|
||||
Reference in New Issue
Block a user