Fix 'Collapsed topics rollover settings aren't accessible' - #111.

Author: gjb2048

Changes.md

@@ -6,6 +6,7 @@ Version 3.10.1.3 - TBR
   2. Add caching to activity meta information in the hope of improving performance.
   3. Add 'aria-live=polite' to the section content and 'aria-controls' to the open / close all buttons - CONTRIB-8637.
   4. Add support for Forums in "Course page further information" - #105.
+  5. Fix 'Collapsed topics rollover settings aren't accessible' - #111.
 
 Version 3.10.1.2 - 02/07/2021
 -----------------------------

templates/coursestyles.mustache

@@ -61,25 +61,25 @@
         background-color: {{togglebackground}};
     }
     /* -- Toggle text -- */
-    .course-content ul.ctopics li.section .content .toggle span,
+    .course-content ul.ctopics li.section .content .toggle .the_toggle,
     .course-content ul.ctopics li.section .content.sectionhidden {
         color: {{toggleforegroundcolour}};
         text-align: {{togglealignment}};
     }
     /* Toggle icon position. */
-    .course-content ul.ctopics li.section .content .toggle span,
+    .course-content ul.ctopics li.section .content .toggle .the_toggle,
     #toggle-all .content h4 span {
         background-position: {{toggleiconposition}} center;
     }
     /* -- What happens when a toggle is hovered over -- */
-    .course-content ul.ctopics li.section .content .toggle span:hover,
-    .course-content ul.ctopics li.section .content.sectionhidden .toggle span:hover,
-    .course-content ul.ctopics li.section .content .toggle span:focus,
-    .course-content ul.ctopics li.section .content.sectionhidden .toggle span:focus {
+    .course-content ul.ctopics li.section .content .toggle:hover .the_toggle,
+    .course-content ul.ctopics li.section .content.sectionhidden .toggle:hover .the_toggle,
+    .course-content ul.ctopics li.section .content .toggle:focus .the_toggle,
+    .course-content ul.ctopics li.section .content.sectionhidden .toggle:focus .the_toggle {
         color: {{toggleforegroundhovercolour}};
     }
-    .course-content ul.ctopics li.section .content div.toggle:hover,
-    .course-content ul.ctopics li.section .content div.toggle:focus {
+    .course-content ul.ctopics li.section .content .toggle:hover,
+    .course-content ul.ctopics li.section .content .toggle:focus {
         background-color: {{togglebackgroundhovercolour}};
     }
     .course-content ul.ctopics li.section.main .content,

tests/phpu_data/test_print_multiple_section_page_css.txt

@@ -7,25 +7,25 @@
         background-color: rgba(226, 226, 242, 1.0);
     }
     /* -- Toggle text -- */
-    .course-content ul.ctopics li.section .content .toggle span,
+    .course-content ul.ctopics li.section .content .toggle .the_toggle,
     .course-content ul.ctopics li.section .content.sectionhidden {
         color: rgba(0, 0, 0, 1.0);
         text-align: center;
     }
     /* Toggle icon position. */
-    .course-content ul.ctopics li.section .content .toggle span,
+    .course-content ul.ctopics li.section .content .toggle .the_toggle,
     #toggle-all .content h4 span {
         background-position: left center;
     }
     /* -- What happens when a toggle is hovered over -- */
-    .course-content ul.ctopics li.section .content .toggle span:hover,
-    .course-content ul.ctopics li.section .content.sectionhidden .toggle span:hover,
-    .course-content ul.ctopics li.section .content .toggle span:focus,
-    .course-content ul.ctopics li.section .content.sectionhidden .toggle span:focus {
+    .course-content ul.ctopics li.section .content .toggle:hover .the_toggle,
+    .course-content ul.ctopics li.section .content.sectionhidden .toggle:hover .the_toggle,
+    .course-content ul.ctopics li.section .content .toggle:focus .the_toggle,
+    .course-content ul.ctopics li.section .content.sectionhidden .toggle:focus .the_toggle {
         color: rgba(136, 136, 136, 1.0);
     }
-    .course-content ul.ctopics li.section .content div.toggle:hover,
-    .course-content ul.ctopics li.section .content div.toggle:focus {
+    .course-content ul.ctopics li.section .content .toggle:hover,
+    .course-content ul.ctopics li.section .content .toggle:focus {
         background-color: rgba(238, 238, 255, 1.0);
     }
     .course-content ul.ctopics li.section.main .content,