Merge pull request #1625 from clpetersonucf/dev-10.3.0-final-fixes

Dev 10.3.0 final fixes

Author: clpetersonucf

fuel/app/classes/controller/media.php

@@ -10,6 +10,7 @@ class Controller_Media extends Controller
 {
 
 	use Trait_CommonControllerTemplate;
+	use Trait_DarkMode;
 
 	// overrides Trait_CommonControllerTemplate->before()
 	public function before()
@@ -54,6 +55,11 @@ public function get_import()
 		Css::push_group(['media_import']);
 		Js::push_group(['react', 'media']);
 
+		if ($this->is_using_darkmode())
+		{
+			$theme->get_template()->set('darkmode', true);
+		}
+
 		return Response::forge($theme->render());
 	}
 

src/components/include.scss

@@ -395,9 +395,10 @@ header {
 		padding: 10px;
 		display: flex;
 		flex-direction: row;
-		// align-items: center;
 		gap: 10px;
 
+		font-weight: 400;
+
 		&:hover{
 			background-color: rgb(250,250,250);
 		}
@@ -667,6 +668,16 @@ header {
 	}
 
 	.notice {
+
+		.noticeClose {
+			filter: invert(1);
+
+			&:hover {
+				cursor: pointer;
+				filter: invert(-0.5) sepia(1) saturate(80) hue-rotate(340deg);
+			}
+		}
+
 		&:hover{
 			background-color: $color-features-dark;
 		}

src/components/media.scss

@@ -17,6 +17,8 @@ body.import {
 	flex-flow: row nowrap;
 	width: 800px;
 
+	font-weight: 400;
+
 	> section {
 		position: relative;
 		height: calc(100vh - 35px);
@@ -128,46 +130,6 @@ body.import {
 	}
 }
 
-.darkMode .media-importer {
-	> section {
-		&:first-child {
-			&:before {
-				color: #dadada;
-			}
-
-			&:after {
-				border-left: thin solid #dadada;
-			}
-		}
-
-		.loading-icon-holder {
-			background: rgba(33,35,45,0.95);
-		}
-	}
-
-	.pane-header {
-		&.darker {
-			color: #484848;
-		}
-
-		.close-button {
-			&:after {
-				color: #fff;
-			}
-		}
-	}
-
-	.pane-footer {
-		span.content {
-			background: rgba(255,255,255,0.95);
-
-			&.error-state {
-				color: #730000;
-			}
-		}
-	}
-}
-
 #drag-wrapper {
 	position: relative;
 	height: 333px;
@@ -332,4 +294,94 @@ body.import {
 			font-size: 12px;
 		}
 	}
+}
+
+.darkMode .media-importer {
+
+	color: #fff;
+	background: $color-background-dark;
+
+	> section {
+		&:first-child {
+			&:before {
+				color: #dadada;
+			}
+
+			&:after {
+				border-left: thin solid #dadada;
+			}
+		}
+
+		.loading-icon-holder {
+			background: rgba(33,35,45,0.95);
+		}
+	}
+
+	#drag-wrapper {
+		border-color: $color-background-dark-gray;
+		background: $color-input-box-bg-dark;
+	}
+
+	#sort-bar {
+		#sort-options .sort-asc:after {
+			border-bottom: $arrow_size solid #fff;
+		}
+	}
+
+	.sort-bar {
+		input {
+			color: #fff;
+			border: solid 1px $color-input-box-border-dark;
+			background: $color-input-box-bg-dark;
+		}
+	}
+
+	#file-display {
+		.file-info {
+			
+			color: #fff;
+
+			&:hover {
+				background: $color-blue-hover-dark;
+			}
+			
+			&:nth-child(odd) {
+				background: $color-background-dark-gray;
+
+				&:hover {
+					background: $color-blue-hover-dark;
+				}
+			}
+
+			.file-name {
+				color: $color-text-light-gray;
+
+				.file-type {
+					color: $very-light-gray;
+				}
+			}
+		}
+	}
+
+	.pane-header {
+		&.darker {
+			color: $gray;
+		}
+
+		.close-button {
+			&:after {
+				color: #fff;
+			}
+		}
+	}
+
+	.pane-footer {
+		span.content {
+			background: none;
+
+			&.error-state {
+				color: #730000;
+			}
+		}
+	}
 }

src/components/my-widgets-score-semester-individual.jsx

@@ -126,7 +126,7 @@ const MyWidgetScoreSemesterIndividual = ({ semester, instId, setInvalidLogin })
 		const studentList = (
 			<ul aria-label="Students">
 				{state.filteredLogs.map(user => (
-					<li key={user.id}>
+					<li key={user.userId}>
 						<button
 							className={state.selectedUser.userId === user.userId ? 'buttonSelected' : ''}
 							onClick={() => {