MDL-79987 course: Improve one section per page course layout

The following changes have been implemented:
- Activities count instead of group by type.
- Icons before Activities and Progress.
- Arrow icon to navigate to the section.
- Other styling improvements, such as the color for the section name and no hover,
and a separator between the activities summary information and the list of activities
for the highlighted section.

theme/boost/scss/moodle/course.scss

@@ -375,14 +375,6 @@ body:not(.editing)  .sitetopic ul.section {
     margin: 2px 5px 2px 5px;
 }
 
-.course-content .section-summary .section-summary-activities .activity-count {
-    color: $text-muted;
-    font-size: $font-size-sm;
-    margin: 3px;
-    white-space: nowrap;
-    display: inline-block;
-}
-
 .course-content .section-summary .summary {
     margin-top: 5px;
 }
@@ -1366,6 +1358,13 @@ $activity-add-hover: theme-color-level('primary', -10) !default;
     padding-left: 0;
     border-bottom: $border-width solid $border-color;
 
+    .sectionname > a {
+        color: $gray-900;
+        &:hover {
+            text-decoration: none;
+        }
+    }
+
     &:last-child:not(.section-summary) {
         border-bottom: 0;
     }
@@ -1423,12 +1422,22 @@ $activity-add-hover: theme-color-level('primary', -10) !default;
         }
     }
 
-    .section-summary-activities .activity-count {
-        color: $text-muted;
-        font-size: $font-size-sm;
-        margin: 3px;
-        white-space: nowrap;
-        display: inline-block;
+    .section-summary-activities {
+        .icon {
+            width: inherit;
+            color: $primary;
+        }
+    }
+
+    .section-summary-activities + .section {
+        border-top: $border-width solid $border-color;
+        margin-top: map-get($spacers, 3) !important;  // stylelint-disable-line declaration-no-important
+        padding-top: map-get($spacers, 3) !important; // stylelint-disable-line declaration-no-important
+    }
+
+    .section_goto .icon {
+        font-size: $font-size-lg;
+        color: $primary;
     }
 
     // Legacy dndupload classes. Can be removed in 4.4 as part of MDL-77124.

theme/boost/style/moodle.css

@@ -28251,14 +28251,6 @@ body:not(.editing) .sitetopic ul.section .label .mod-indent-outer {
   margin: 2px 5px 2px 5px;
 }
 
-.course-content .section-summary .section-summary-activities .activity-count {
-  color: #6a737b;
-  font-size: 0.8203125rem;
-  margin: 3px;
-  white-space: nowrap;
-  display: inline-block;
-}
-
 .course-content .section-summary .summary {
   margin-top: 5px;
 }
@@ -29140,6 +29132,12 @@ span.editinstructions .alert-link {
   padding-left: 0;
   border-bottom: 1px solid #dee2e6;
 }
+.course-section .sectionname > a {
+  color: #1d2125;
+}
+.course-section .sectionname > a:hover {
+  text-decoration: none;
+}
 .course-section:last-child:not(.section-summary) {
   border-bottom: 0;
 }
@@ -29180,12 +29178,18 @@ span.editinstructions .alert-link {
   margin-top: 0.5rem;
   border-radius: 0.5rem;
 }
-.course-section .section-summary-activities .activity-count {
-  color: #6a737b;
-  font-size: 0.8203125rem;
-  margin: 3px;
-  white-space: nowrap;
-  display: inline-block;
+.course-section .section-summary-activities .icon {
+  width: inherit;
+  color: #0f6cbf;
+}
+.course-section .section-summary-activities + .section {
+  border-top: 1px solid #dee2e6;
+  margin-top: 1rem !important;
+  padding-top: 1rem !important;
+}
+.course-section .section_goto .icon {
+  font-size: 1.171875rem;
+  color: #0f6cbf;
 }
 .course-section.dndupload-dropzone {
   border: 2px dashed #0f6cbf;

theme/classic/style/moodle.css

@@ -28251,14 +28251,6 @@ body:not(.editing) .sitetopic ul.section .label .mod-indent-outer {
   margin: 2px 5px 2px 5px;
 }
 
-.course-content .section-summary .section-summary-activities .activity-count {
-  color: #6a737b;
-  font-size: 0.8203125rem;
-  margin: 3px;
-  white-space: nowrap;
-  display: inline-block;
-}
-
 .course-content .section-summary .summary {
   margin-top: 5px;
 }
@@ -29140,6 +29132,12 @@ span.editinstructions .alert-link {
   padding-left: 0;
   border-bottom: 1px solid #dee2e6;
 }
+.course-section .sectionname > a {
+  color: #1d2125;
+}
+.course-section .sectionname > a:hover {
+  text-decoration: none;
+}
 .course-section:last-child:not(.section-summary) {
   border-bottom: 0;
 }
@@ -29180,12 +29178,18 @@ span.editinstructions .alert-link {
   margin-top: 0.5rem;
   border-radius: 0.25rem;
 }
-.course-section .section-summary-activities .activity-count {
-  color: #6a737b;
-  font-size: 0.8203125rem;
-  margin: 3px;
-  white-space: nowrap;
-  display: inline-block;
+.course-section .section-summary-activities .icon {
+  width: inherit;
+  color: #0f6cbf;
+}
+.course-section .section-summary-activities + .section {
+  border-top: 1px solid #dee2e6;
+  margin-top: 1rem !important;
+  padding-top: 1rem !important;
+}
+.course-section .section_goto .icon {
+  font-size: 1.171875rem;
+  color: #0f6cbf;
 }
 .course-section.dndupload-dropzone {
   border: 2px dashed #0f6cbf;