Image zoom modal; Immersive light theme

src/scss/components/_dragger.scss

@@ -30,6 +30,10 @@
 	z-index: 98;
 	background: darken($dark_grey, 1%);
 
+	.light-theme & {
+		background: $faint_grey;
+	}
+
 	.dropzone {
 		@include animate();
 		@include gradient_overlay(3px,0);
@@ -42,6 +46,11 @@
 		font-size: 18px;
 		text-align: center;
 
+		.light-theme & {
+			background: $light_grey;
+			color: $darkest_grey;
+		}
+
 		& * {
 			pointer-events: none;
 		}

src/scss/components/_dropdown-field.scss

@@ -66,6 +66,10 @@
 			position: absolute;
 			top: -3px;
 			right: 9px;
+
+			.light-theme & {
+				background: $faint_grey;
+			}
 		}
 
 		& > .liner {
@@ -76,6 +80,10 @@
 			overflow-y: auto;
 			border-radius: 3px;
 
+			.light-theme & {
+				background: $faint_grey;
+			}
+
 			.option {
 				@include animate();
 				position: relative;

src/scss/components/_grid.scss

@@ -199,6 +199,11 @@
 		z-index: 1;
 		float: left;
 		overflow: hidden;
+		border-radius: 3px;
+
+		.light-theme & {
+			color: $darkest_grey;
+		}
 
 		.content {
 			display: block;
@@ -221,8 +226,12 @@
 			display: block;
 			width: 100%;
 			padding-bottom: 100%;
-			background: lighten($dark_grey,2%);
+			background: lighten($dark_grey, 2%);
 			z-index: -2;
+
+			.light-theme & {
+				background: $faint_grey;
+			}
 		}
 
 		&.thumbnail-wrapper {

src/scss/components/_output-control.scss

@@ -37,6 +37,13 @@
 			right: 159px;
 		}
 
+		.no-results {
+			font-size: 1rem;
+			text-align: center;
+			opacity: 0.5;
+			font-weight: normal;
+		}
+
 		.output {
 			padding: 16px 20px 12px;
 			position: relative;

src/scss/components/_playback-controls.scss

@@ -209,6 +209,7 @@
 			right: 60px;
 			text-align: center;
 			font-size: 12px;
+			color: $white !important;
 
 			.title {
 				padding-top: 0;