Delicious buttons

src/scss/components/_context-menu.scss

@@ -248,6 +248,18 @@
 	}
 }
 
+.context-menu-trigger {
+	padding: 8px 12px;
+	font-size: 18px;
+	cursor: pointer;
+	vertical-align: middle;
+	margin-left: 10px;
+
+	&:hover {
+		color: $turquoise;
+	}
+}
+
 .list {	
 	&.track-list {
 

src/scss/components/_dropdown-field.scss

@@ -1,8 +1,8 @@
 
 .dropdown-field {
-	font-size: 14px;
+	font-size: 13px;
 	font-weight: 600;
-	text-transform: uppercase;
+	font-family: "Overpass";
 	position: relative;
 	display: inline-block;
 
@@ -13,8 +13,7 @@
 
 	&.expanded {
 		.label {
-			background: $dark_grey;
-			color: #FFFFFF;
+			color: $blue;
 		}
 		.options {
 			display: block;
@@ -22,29 +21,29 @@
 	}
 
 	.options {
-		color: #FFFFFF;
+		color: $mid_grey;
 		position: absolute;
-		top: 52px;
+		top: 46px;
 		right: 0px;
 		z-index: 97;
-		background: $dark_grey;
+		background: $white;
+		border-top: 1px solid $mid_grey;
 		display: none;
 
 		.option {
 			position: relative;
-			padding: 6px 14px 6px 30px;
-			border-top: 1px solid lighten($dark_grey, 10%);
+			padding: 6px 14px 6px 18px;
 			cursor: pointer;
 
 			.fa {
 				position: absolute;
-				top: 12px;
-				left: 10px;
-				font-size: 12px;
+				top: 7px;
+				left: 5px;
+				font-size: 10px;
 			}
 
 			&:hover {
-				background: lighten($dark_grey, 10%);
+				color: $black;
 			}
 		}
 	}

src/scss/components/_header.scss

@@ -18,7 +18,7 @@ main {
 
 		.options {
 			position: absolute;
-			top: 0;
+			top: 10px;
 			right: 10px;
 
 			.context-menu-trigger {
@@ -30,18 +30,18 @@ main {
 			.button,
 			button {
 				background: transparent;
-				font-size: 14px;
-				font-weight: 600;
+				text-transform: none;
 				padding: 13px 10px;
 				margin: 0;
-				line-height: 24px;
-				text-transform: uppercase;
 				min-width: 0;
 				border: 0;
-				color: #000000;
+				color: $black;
+				font-size: 13px;
+				font-weight: 600;
+				font-family: "Overpass";
 
 				&:active {
-					background: rgba(0,0,0,0.15);
+					color: $blue;
 				}
 			}
 		}

src/scss/components/_notifications.scss

@@ -17,6 +17,7 @@
 		margin: 10px 0 0 0;
 		color: $white;
 		pointer-events: all;
+		border-radius: 3px;
 		
 		h4 {
 			padding-top: 0;
@@ -64,17 +65,19 @@
 			}
 
 			&:after {
+				pointer-events: none;
 				position: absolute;
 				display: block;
 				content: '';
-				background: $blue;
-				opacity: 1;
+				background: $white;
+				opacity: 0.1;
 			    animation: slideloader 1s infinite;
+				top: 0;
+				right: 0;
 				bottom: 0;
 				left: 0;
-				right: 0;
-				height: 4px;
 				z-index: 1;
+				border-radius: 0 0 3px 3px;
 			}
 		}
 	}

src/scss/components/_playback-controls.scss

@@ -62,7 +62,7 @@
 		}
 
 		&.active {
-			color: $turquoise;
+			color: $turquoise !important;
 		}
 
 		&:hover {