Improve interactivity indicators of theme button (#3637)

Author: parlough

lib/resources/styles.css

@@ -96,6 +96,10 @@
   cursor: pointer;
 }
 
+#theme-button .material-symbols-outlined:hover {
+  color: var(--main-hyperlinks-color);
+}
+
 li .material-symbols-outlined, dt .material-symbols-outlined {
   font-size: 1em;
   vertical-align: text-bottom;
@@ -870,6 +874,10 @@ button {
   cursor: pointer;
 }
 
+#sidenav-left-toggle:hover {
+  color: var(--main-hyperlinks-color);
+}
+
 /* left-nav disappears, and can transition in from the left */
 @media screen and (max-width:840px) {
   #sidenav-left-toggle {

lib/src/generator/templates.aot_renderers_for_html.dart

@@ -3642,14 +3642,14 @@ String _deduplicated_lib_templates_html__head_html(TemplateDataBase context0) {
   <form class="search navbar-right" role="search">
     <input type="text" id="search-box" autocomplete="off" disabled class="form-control typeahead" placeholder="Loading search...">
   </form>
-  <div class="toggle" id="theme-button">
+  <div class="toggle" id="theme-button" title="Toggle brightness">
     <label for="theme">
       <input type="checkbox" id="theme" value="light-theme">
       <span id="dark-theme-button" class="material-symbols-outlined">
-        brightness_4
+        dark_mode
       </span>
       <span id="light-theme-button" class="material-symbols-outlined">
-        brightness_5
+        light_mode
       </span>
     </label>
   </div>

lib/templates/html/_head.html

@@ -54,14 +54,14 @@
   <form class="search navbar-right" role="search">
     <input type="text" id="search-box" autocomplete="off" disabled class="form-control typeahead" placeholder="Loading search...">
   </form>
-  <div class="toggle" id="theme-button">
+  <div class="toggle" id="theme-button" title="Toggle brightness">
     <label for="theme">
       <input type="checkbox" id="theme" value="light-theme">
       <span id="dark-theme-button" class="material-symbols-outlined">
-        brightness_4
+        dark_mode
       </span>
       <span id="light-theme-button" class="material-symbols-outlined">
-        brightness_5
+        light_mode
       </span>
     </label>
   </div>