diff --git a/src/js/views/Playlist.js b/src/js/views/Playlist.js
index f9a12bc2..af431cac 100755
--- a/src/js/views/Playlist.js
+++ b/src/js/views/Playlist.js
@@ -163,7 +163,9 @@ class Playlist extends React.Component{
diff --git a/src/scss/components/_context-menu.scss b/src/scss/components/_context-menu.scss
index a877619a..9efb96af 100755
--- a/src/scss/components/_context-menu.scss
+++ b/src/scss/components/_context-menu.scss
@@ -262,15 +262,30 @@
}
.context-menu-trigger {
+ @include animate();
display: inline-block;
- padding: 9px 10px 7px;
- font-size: 18px;
+ padding: 14px 12px;
cursor: pointer;
vertical-align: top;
- margin-left: 10px;
+ margin-top: -1px;
position: relative;
border-radius: 3px;
+ .dot {
+ width: 6px;
+ height: 6px;
+ border-radius: 5px;
+ background: $black;
+ display: inline-block;
+ margin: 1px;
+ }
+
+ &.white {
+ .dot {
+ background: $white;
+ }
+ }
+
&:before {
@include animate();
content: '';
diff --git a/src/scss/components/_lists.scss b/src/scss/components/_lists.scss
index 3149d523..a397db40 100755
--- a/src/scss/components/_lists.scss
+++ b/src/scss/components/_lists.scss
@@ -43,7 +43,7 @@
}
:root .notouch:not(.dragging) &:not(.header):not(.no-click):hover {
- background: rgba(150,150,150,0.1);
+ background: lighten($yellow, 10%);
cursor: pointer;
}
diff --git a/src/scss/components/_sidebar.scss b/src/scss/components/_sidebar.scss
index 79730b6a..9fad7dd0 100755
--- a/src/scss/components/_sidebar.scss
+++ b/src/scss/components/_sidebar.scss
@@ -74,7 +74,7 @@ aside{
@include animate();
@include feature_font();
font-weight: 800;
- font-size: 16px;
+ font-size: 15px;
color: $black;
text-decoration: none;
display: block;
@@ -107,7 +107,7 @@ aside{
}
section {
- padding: 15px 0;
+ padding-bottom: 20px;
title {
display: block;
diff --git a/src/scss/global/_forms.scss b/src/scss/global/_forms.scss
index 231c07d8..a7070b32 100755
--- a/src/scss/global/_forms.scss
+++ b/src/scss/global/_forms.scss
@@ -76,7 +76,7 @@ input[type="submit"] {
&:hover{
cursor: pointer;
- box-shadow: 2px 3px 6px rgba(0,0,0,0.2);
+ box-shadow: 1px 2px 6px rgba(0,0,0,0.2);
&:before {
opacity: 0.15;
@@ -158,45 +158,6 @@ input[type="submit"] {
}
}
- &.context-menu-trigger {
- border-color: transparent;
- padding: 6px;
- margin-bottom: 8px;
- font-size: 20px;
- min-width: 0;
- line-height: 20px;
- color: #000000;
- vertical-align: bottom;
-
- .fa {
- pointer-events: none;
- }
-
- &:hover {
- border-color: transparent;
- background: rgba(0,0,0,0.1);
- }
-
- &:active {
- color: #FFFFFF;
- background: #000000;
- }
-
- &.white {
- color: #FFFFFF;
-
- &:hover {
- border-color: transparent;
- background: rgba(255,255,255,0.1);
- }
-
- &:active {
- color: #000000;
- background: #FFFFFF;
- }
- }
- }
-
&[disabled],
&[disabled="disabled"]{
opacity: 0.5;
@@ -230,14 +191,6 @@ input[type="submit"] {
}
}
-.actions {
-
- .button:last-of-type,
- button:last-of-type {
- margin-right: 0;
- }
-}
-
.field {
display: block;
padding-bottom: 8px;
diff --git a/src/scss/views/_album.scss b/src/scss/views/_album.scss
index b18d1dd3..1fae642c 100755
--- a/src/scss/views/_album.scss
+++ b/src/scss/views/_album.scss
@@ -1,6 +1,7 @@
main .album-view {
- padding-left: 400px;
+ padding-left: 30%;
+ position: relative;
.title {
padding-bottom: 30px;
@@ -26,11 +27,17 @@ main .album-view {
padding-bottom: 5px;
}
- .thumbnail {
+ .thumbnail-wrapper {
position: absolute;
- max-width: 320px;
- top: 40px;
- left: 40px;
+ padding: 40px;
+ width: 30%;
+ top: 0;
+ left: 0;
+ box-sizing: border-box;
+
+ .thumbnail {
+ max-width: 100%;
+ }
}
@include responsive( $bp_medium ){
diff --git a/src/scss/views/_playlist.scss b/src/scss/views/_playlist.scss
index a8035da0..da21a624 100755
--- a/src/scss/views/_playlist.scss
+++ b/src/scss/views/_playlist.scss
@@ -1,6 +1,7 @@
main .playlist-view {
- padding-left: 400px;
+ padding-left: 30%;
+ position: relative;
.title {
padding-bottom: 30px;
@@ -26,11 +27,17 @@ main .playlist-view {
padding-bottom: 5px;
}
- .thumbnail {
+ .thumbnail-wrapper {
position: absolute;
- max-width: 320px;
- top: 40px;
- left: 40px;
+ padding: 40px;
+ width: 30%;
+ top: 0;
+ left: 0;
+ box-sizing: border-box;
+
+ .thumbnail {
+ max-width: 100%;
+ }
}
@include responsive( $bp_medium ){