+ {this.props.artist.images_additional ?
: null}
{this.props.artist.followers ?
{this.props.artist.followers.total.toLocaleString() } followers
: null}
{this.props.artist.popularity ?
{this.props.artist.popularity }% popularity
: null}
{this.props.artist.listeners ?
{ this.props.artist.listeners.toLocaleString() } listeners
: null }
@@ -214,7 +215,7 @@ class Artist extends React.Component{
-
+
{this.props.artist ? this.props.artist.name : null}
{ can_play_radio ? : null}
diff --git a/src/scss/components/_images.scss b/src/scss/components/_images.scss
index ec31f053..5437a550 100755
--- a/src/scss/components/_images.scss
+++ b/src/scss/components/_images.scss
@@ -40,7 +40,14 @@
}
&.circle {
- border-radius: 50%;
+ .image {
+ border-radius: 50%;
+ }
+
+ .zoom {
+ bottom: 0;
+ right: 0;
+ }
}
&:hover {
@@ -112,6 +119,11 @@
z-index: -2;
}
+ &.thumbnail-wrapper {
+ &:before {
+ display: none;
+ }
+ }
}
@include responsive( null, $bp_medium ){
diff --git a/src/scss/components/_lists.scss b/src/scss/components/_lists.scss
index ba760ece..68c0f639 100755
--- a/src/scss/components/_lists.scss
+++ b/src/scss/components/_lists.scss
@@ -168,6 +168,7 @@
.thumbnail {
@include animate();
+ border-radius: 50%;
width: 50px;
margin-right: 15px;
float: left;
diff --git a/src/scss/components/_modal.scss b/src/scss/components/_modal.scss
index 352a14b8..cc684c3a 100755
--- a/src/scss/components/_modal.scss
+++ b/src/scss/components/_modal.scss
@@ -189,7 +189,8 @@
}
.current-track {
- padding-top: 30px;
+ padding-top: 50px;
+ font-size: 30px;
}
}
}
diff --git a/src/scss/views/_artist.scss b/src/scss/views/_artist.scss
index f9f4db4c..e5af439a 100755
--- a/src/scss/views/_artist.scss
+++ b/src/scss/views/_artist.scss
@@ -18,14 +18,14 @@
.liner {
position: relative;
z-index: 1;
- padding: 20vh 40px 0 220px;
+ padding: 20vh 40px 0 260px;
.thumbnail {
position: absolute;
z-index: 2;
left: 40px;
bottom: 20px;
- max-width: 144px;
+ max-width: 184px;
.image {
background-color: $darkest_grey;