Fix colors on the proctor login page for dark mode.

The colors for this were inline style.  Colors cannot be inline anymore
since the server cannot detect if the user will have the browser in dark
mode or not.  So this switches to using Bootstrap alerts instead.

Author: drgrice1

templates/ContentGenerator/LoginProctor.html.ep

@@ -16,14 +16,14 @@
 % # Print a message about submission times if we're submitting an answer.
 % if (param('submitAnswers')) {
 	% my $dueTime = $userSet->due_date;
-	% my ($color, $msg) = ('#ddddff', '');
+	% my ($alertClass, $msg) = ('alert-primary', '');
 	% if ($dueTime + $ce->{gatewayGracePeriod} < $submitTime) {
-		% $color = '#ffffaa';
+		% $alertClass = ' alert-warning';
 		% $msg = maketext('The time limit on this assignment was exceeded. The assignment may be checked, '
 			% . 'but the result will not be counted.');
 	% }
 	%
-	<div class="card mb-2" style="background-color:<%= $color %>;">
+	<div class="alert mb-2<%= $alertClass %>" role="alert">
 		<div class="card-body p-2">
 			<div class="card-title"><strong><%= maketext('Grading Assignment') %></strong></div>
 			<div class="card-text">
@@ -52,7 +52,7 @@
 		% || ($userSet->restricted_login_proctor eq '' || $userSet->restricted_login_proctor eq 'No'))
 	% {
 		% # The user info and username field for the proctor.
-		<div class="card p-2 mb-2" style="background-color:#ddddff;">
+		<div class="alert alert-primary card p-2 mb-2" role="alert">
 			<div><%= maketext(q{User's username is:}) %> <strong><%= param('effectiveUser') // '' %></strong></div>
 			<div>
 				<%= maketext(q{User's name is:}) %>
@@ -68,7 +68,7 @@
 		</div>
 	% } else {
 		% # Restricted set login
-		<div class="card p-2 mb-2" style="background-color:#ddddff;">
+		<div class="alert alert-primary card p-2 mb-2" role="alert">
 			<em>
 				<%= maketext(
 					'This set has a set-level proctor password to authorize logins. Enter the password below.') =%>