MOBILE-3814 course: Move course summary button to toolbar

src/core/features/course/components/format/core-course-format.html

@@ -2,7 +2,7 @@
 <core-navbar-buttons slot="end" *ngIf="loaded">
     <core-context-menu>
         <core-context-menu-item [hidden]="!displayCourseIndex || !sections || !sections.length" [priority]="500"
-            [content]="'core.course.courseindex' | translate" (action)="openCourseIndex()" iconAction="menu">
+            [content]="'core.course.courseindex' | translate" (action)="openCourseIndex()" iconAction="fas-list-ul">
         </core-context-menu-item>
     </core-context-menu>
 </core-navbar-buttons>

src/core/features/course/components/format/format.scss

@@ -10,3 +10,8 @@
         flex: 1;
     }
 }
+
+.course-section {
+    --padding-start: 12px;
+    --inner-padding-end: 12px;
+}

src/core/features/course/pages/contents/contents.html

@@ -1,8 +1,5 @@
 <core-navbar-buttons slot="end">
     <core-context-menu>
-        <core-context-menu-item [priority]="1800" [content]="'core.course.coursesummary' | translate" (action)="openCourseSummary()"
-            iconAction="fas-info-circle">
-        </core-context-menu-item>
         <core-context-menu-item *ngFor="let item of courseMenuHandlers" [priority]="item.priority" (action)="openMenuItem(item)"
             [content]="item.data.title | translate" [iconAction]="item.data.icon" [class]="item.data.class">
         </core-context-menu-item>

src/core/features/course/pages/contents/contents.ts

@@ -379,16 +379,6 @@ export class CoreCourseContentsPage implements OnInit, OnDestroy {
         }
     }
 
-    /**
-     * Open the course summary
-     */
-    openCourseSummary(): void {
-        CoreNavigator.navigateToSitePath(
-            `/course/${this.course.id}/preview`,
-            { params: { course: this.course, avoidOpenCourse: true } },
-        );
-    }
-
     /**
      * Opens a menu item registered to the delegate.
      *

src/core/features/course/pages/index/index.html

@@ -9,29 +9,23 @@
             </h1>
         </ion-title>
 
-        <ion-buttons slot="end"></ion-buttons>
+        <ion-buttons slot="end">
+            <ion-button fill="clear" (click)="openCourseSummary()" [attr.aria-label]="'core.course.coursesummary' | translate">
+                <ion-icon name="fas-info-circle" slot="icon-only" aria-hidden="true"></ion-icon>
+            </ion-button>
+        </ion-buttons>
     </ion-toolbar>
 </ion-header>
-<ion-item lines="full" class="core-format-progress-list ion-text-wrap collapsible-title">
+<ion-item class="core-format-progress-list ion-text-wrap collapsible-title list-item-limited-width">
     <ion-avatar slot="start" class="core-course-thumb" *ngIf="imageThumb">
         <img [src]="imageThumb" core-external-content alt="" />
     </ion-avatar>
     <ion-label>
-        <ion-row>
+        <p *ngIf="category">
-            <ion-col>
+            <core-format-text [text]="category" contextLevel="coursecat" [contextInstanceId]="course!.categoryid">
-                <p *ngIf="category">
+            </core-format-text>
-                    <core-format-text [text]="category" contextLevel="coursecat" [contextInstanceId]="course!.categoryid">
+        </p>
-                    </core-format-text>
+        <h1>{{ title }}</h1>
-                </p>
-                <h1>{{ title }}</h1>
-            </ion-col>
-            <ion-col size="auto" class="ion-align-self-center">
-                <ion-button fill="clear" (click)="openCourseSummary()" [attr.aria-label]="'core.course.coursesummary' | translate"
-                    color="dark">
-                    <ion-icon name="fas-info-circle" slot="icon-only" aria-hidden="true"></ion-icon>
-                </ion-button>
-            </ion-col>
-        </ion-row>
         <div class="core-course-progress" *ngIf="progress !== undefined">
             <core-progress-bar [progress]="progress" a11yText="core.course.aria:sectionprogress">
             </core-progress-bar>