From dace9898d04967d4871bde0220a44bcb3f83971f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Pau=20Ferrer=20Oca=C3=B1a?= <crazyserver@gmail.com>
Date: Tue, 16 Nov 2021 12:58:46 +0100
Subject: [PATCH] MOBILE-3810 module: Add basic info to core-course-module-info

---
 .../index/addon-mod-assign-index.html         | 67 +++++++---------
 .../index/addon-mod-book-index.html           | 25 +++---
 .../index/addon-mod-chat-index.html           | 16 ++--
 .../index/addon-mod-choice-index.html         | 31 ++++----
 .../index/addon-mod-data-index.html           | 27 +++----
 .../index/addon-mod-feedback-index.html       | 39 ++++------
 .../index/addon-mod-folder-index.html         | 17 ++--
 .../mod/forum/components/index/index.html     | 77 ++++++++-----------
 .../index/addon-mod-glossary-index.html       | 30 ++++----
 .../index/addon-mod-h5pactivity-index.html    | 24 +++---
 .../index/addon-mod-imscp-index.html          | 11 ++-
 .../index/addon-mod-lesson-index.html         | 26 +++----
 .../components/index/addon-mod-lti-index.html | 17 ++--
 .../index/addon-mod-page-index.html           | 16 ++--
 .../index/addon-mod-quiz-index.html           | 62 +++++++--------
 .../index/addon-mod-resource-index.html       | 18 ++---
 .../index/addon-mod-scorm-index.html          | 26 +++----
 .../index/addon-mod-survey-index.html         | 45 +++++------
 .../components/index/addon-mod-url-index.html | 16 ++--
 .../index/addon-mod-wiki-index.html           | 33 ++++----
 src/addons/mod/wiki/pages/index/index.ts      |  4 +-
 .../index/addon-mod-workshop-index.html       | 40 ++++++----
 .../course/classes/main-resource-component.ts |  4 +-
 .../module-description/module-description.ts  |  4 +-
 .../module-info/core-course-module-info.html  | 53 +++++++++----
 .../module-info/course-module-info.scss       |  6 +-
 .../components/module-info/module-info.ts     | 35 ++++++++-
 .../core-course-unsupported-module.html       |  5 +-
 28 files changed, 365 insertions(+), 409 deletions(-)

diff --git a/src/addons/mod/assign/components/index/addon-mod-assign-index.html b/src/addons/mod/assign/components/index/addon-mod-assign-index.html
index ef0cd7d5d..1efbaa292 100644
--- a/src/addons/mod/assign/components/index/addon-mod-assign-index.html
+++ b/src/addons/mod/assign/components/index/addon-mod-assign-index.html
@@ -1,15 +1,14 @@
 <!-- Buttons to add to the header. -->
 <core-navbar-buttons slot="end">
     <core-context-menu>
-        <core-context-menu-item *ngIf="externalUrl" [priority]="900" [content]="'core.openinbrowser' | translate"
-            [href]="externalUrl" iconAction="fas-external-link-alt" [showBrowserWarning]="false">
+        <core-context-menu-item *ngIf="externalUrl" [priority]="900" [content]="'core.openinbrowser' | translate" [href]="externalUrl"
+            iconAction="fas-external-link-alt" [showBrowserWarning]="false">
         </core-context-menu-item>
         <core-context-menu-item *ngIf="assign && (description || (assign.introattachments && assign.introattachments.length))"
-            [priority]="800" [content]="'core.moduleintro' | translate" (action)="expandDescription()"
-            iconAction="fas-arrow-right">
+            [priority]="800" [content]="'core.moduleintro' | translate" (action)="expandDescription()" iconAction="fas-arrow-right">
         </core-context-menu-item>
-        <core-context-menu-item *ngIf="blog" [priority]="750" content="{{'addon.blog.blog' | translate}}"
-            iconAction="far-newspaper" (action)="gotoBlog()">
+        <core-context-menu-item *ngIf="blog" [priority]="750" content="{{'addon.blog.blog' | translate}}" iconAction="far-newspaper"
+            (action)="gotoBlog()">
         </core-context-menu-item>
         <core-context-menu-item *ngIf="loaded && !hasOffline && isOnline" [priority]="700" [content]="'core.refresh' | translate"
             (action)="doRefresh(null, $event)" [iconAction]="refreshIcon" [closeOnClick]="false">
@@ -31,26 +30,15 @@
 <core-loading [hideUntil]="loaded">
 
     <!-- Activity info. -->
-    <core-course-module-info *ngIf="showCompletion" [module]="module" [showManualCompletion]="true"
-        (completionChanged)="onCompletionChange()">
+    <core-course-module-info [module]="module" (completionChanged)="onCompletionChange()" [description]="description"
+        [component]="component" [componentId]="componentId" [courseId]="courseId">
+        <ion-list inset="true" description *ngIf="assign && assign.introattachments && assign.introattachments.length">
+            <core-file *ngFor="let file of assign.introattachments" [file]="file" [component]="component" [componentId]="componentId">
+            </core-file>
+        </ion-list>
     </core-course-module-info>
 
-    <!-- Description and intro attachments. -->
-    <ion-card *ngIf="description">
-        <ion-item class="ion-text-wrap">
-            <ion-label>
-                <core-format-text [text]="description" [component]="component" [componentId]="componentId" maxHeight="120"
-                    contextLevel="module" [contextInstanceId]="module.id" [courseId]="courseId"
-                    (onClick)="expandDescription($event)">
-                </core-format-text>
-            </ion-label>
-        </ion-item>
-    </ion-card>
 
-    <ion-card *ngIf="assign && assign.introattachments && assign.introattachments.length">
-        <core-file *ngFor="let file of assign.introattachments" [file]="file" [component]="component" [componentId]="componentId">
-        </core-file>
-    </ion-card>
 
     <!-- Assign has something offline. -->
     <ion-card class="core-warning-card" *ngIf="hasOffline">
@@ -90,8 +78,7 @@
             </ion-item>
 
             <!-- Summary of all submissions. -->
-            <ion-item class="ion-text-wrap" *ngIf="summary && summary.participantcount" (click)="goToSubmissionList()" detail="true"
-                button>
+            <ion-item class="ion-text-wrap" *ngIf="summary && summary.participantcount" (click)="goToSubmissionList()" detail="true" button>
                 <ion-label>
                     <h2 *ngIf="assign.teamsubmission">{{ 'addon.mod_assign.numberofteams' | translate }}</h2>
                     <h2 *ngIf="!assign.teamsubmission">{{ 'addon.mod_assign.numberofparticipants' | translate }}</h2>
@@ -109,48 +96,48 @@
 
             <!-- Summary of submissions with draft status. -->
             <ion-item class="ion-text-wrap" *ngIf="assign.submissiondrafts && summary && summary.submissionsenabled"
-                [class.hide-detail]="!summary.submissiondraftscount"
-                detail="true"
-                [button]="summary.submissiondraftscount"
+                [class.hide-detail]="!summary.submissiondraftscount" detail="true" [button]="summary.submissiondraftscount"
                 (click)="goToSubmissionList(submissionStatusDraft, !!summary.submissiondraftscount)">
-                <ion-label><h2>{{ 'addon.mod_assign.numberofdraftsubmissions' | translate }}</h2></ion-label>
+                <ion-label>
+                    <h2>{{ 'addon.mod_assign.numberofdraftsubmissions' | translate }}</h2>
+                </ion-label>
                 <ion-badge slot="end" color="primary">
                     <span aria-hidden="true">{{ summary.submissiondraftscount }}</span>
                     <span class="sr-only">
                         {{ 'addon.mod_assign.numberofdraftsubmissionscountdescription' | translate:
-                            {count: summary.submissiondraftscount} }}
+                        {count: summary.submissiondraftscount} }}
                     </span>
                 </ion-badge>
             </ion-item>
 
             <!-- Summary of submissions with submitted status. -->
             <ion-item class="ion-text-wrap" *ngIf="summary && summary.submissionsenabled"
-                [class.hide-detail]="!summary.submissionssubmittedcount"
-                detail="true"
-                [button]="summary.submissionssubmittedcount"
+                [class.hide-detail]="!summary.submissionssubmittedcount" detail="true" [button]="summary.submissionssubmittedcount"
                 (click)="goToSubmissionList(submissionStatusSubmitted, !!summary.submissionssubmittedcount)">
-                <ion-label><h2>{{ 'addon.mod_assign.numberofsubmittedassignments' | translate }}</h2></ion-label>
+                <ion-label>
+                    <h2>{{ 'addon.mod_assign.numberofsubmittedassignments' | translate }}</h2>
+                </ion-label>
                 <ion-badge slot="end" color="primary">
                     <span aria-hidden="true">{{ summary.submissionssubmittedcount }}</span>
                     <span class="sr-only">
                         {{ 'addon.mod_assign.numberofsubmittedassignmentscountdescription' | translate:
-                            {count: summary.submissionssubmittedcount} }}
+                        {count: summary.submissionssubmittedcount} }}
                     </span>
                 </ion-badge>
             </ion-item>
 
             <!-- Summary of submissions that need grading. -->
             <ion-item class="ion-text-wrap" *ngIf="summary && summary.submissionsenabled && !assign.teamsubmission"
-                [class.hide-detail]="!needsGradingAvailable"
-                detail="true"
-                [button]="needsGradingAvailable"
+                [class.hide-detail]="!needsGradingAvailable" detail="true" [button]="needsGradingAvailable"
                 (click)="goToSubmissionList(needGrading, needsGradingAvailable)">
-                <ion-label><h2>{{ 'addon.mod_assign.numberofsubmissionsneedgrading' | translate }}</h2></ion-label>
+                <ion-label>
+                    <h2>{{ 'addon.mod_assign.numberofsubmissionsneedgrading' | translate }}</h2>
+                </ion-label>
                 <ion-badge slot="end" color="primary">
                     <span aria-hidden="true">{{ summary.submissionsneedgradingcount }}</span>
                     <span class="sr-only">
                         {{ 'addon.mod_assign.numberofsubmissionsneedgradingcountdescription' | translate:
-                            {count: summary.submissionsneedgradingcount} }}
+                        {count: summary.submissionsneedgradingcount} }}
                     </span>
                 </ion-badge>
             </ion-item>
diff --git a/src/addons/mod/book/components/index/addon-mod-book-index.html b/src/addons/mod/book/components/index/addon-mod-book-index.html
index 7be6e735b..f6f090647 100644
--- a/src/addons/mod/book/components/index/addon-mod-book-index.html
+++ b/src/addons/mod/book/components/index/addon-mod-book-index.html
@@ -4,12 +4,12 @@
         <ion-icon name="fas-bookmark" slot="icon-only" aria-hidden="true"></ion-icon>
     </ion-button>
     <core-context-menu>
-        <core-context-menu-item *ngIf="externalUrl" [priority]="900" [content]="'core.openinbrowser' | translate"
-            [href]="externalUrl" iconAction="fas-external-link-alt" [showBrowserWarning]="false"></core-context-menu-item>
+        <core-context-menu-item *ngIf="externalUrl" [priority]="900" [content]="'core.openinbrowser' | translate" [href]="externalUrl"
+            iconAction="fas-external-link-alt" [showBrowserWarning]="false"></core-context-menu-item>
         <core-context-menu-item *ngIf="description" [priority]="800" [content]="'core.moduleintro' | translate"
             (action)="expandDescription()" iconAction="fas-arrow-right"></core-context-menu-item>
-        <core-context-menu-item *ngIf="blog" [priority]="750" content="{{'addon.blog.blog' | translate}}"
-            iconAction="far-newspaper" (action)="gotoBlog()"></core-context-menu-item>
+        <core-context-menu-item *ngIf="blog" [priority]="750" content="{{'addon.blog.blog' | translate}}" iconAction="far-newspaper"
+            (action)="gotoBlog()"></core-context-menu-item>
         <core-context-menu-item [priority]="700" [content]="'core.refresh' | translate" (action)="doRefresh(null, $event)"
             [iconAction]="refreshIcon" [closeOnClick]="false"></core-context-menu-item>
         <core-context-menu-item *ngIf="prefetchStatusIcon" [priority]="600" [content]="prefetchText" (action)="prefetch($event)"
@@ -24,13 +24,10 @@
 <core-loading [hideUntil]="loaded">
 
     <!-- Activity info. -->
-    <core-course-module-info *ngIf="showCompletion" [module]="module" [showManualCompletion]="true"
-        (completionChanged)="onCompletionChange()">
+    <core-course-module-info [module]="module" (completionChanged)="onCompletionChange()" [description]="description"
+        [component]="component" [componentId]="componentId" [courseId]="courseId">
     </core-course-module-info>
 
-    <core-course-module-description [description]="description" [component]="component" [componentId]="componentId"
-        contextLevel="module" [contextInstanceId]="module.id" [courseId]="courseId"></core-course-module-description>
-
     <ion-card class="core-warning-card" *ngIf="warning">
         <ion-item>
             <ion-icon name="fas-exclamation-triangle" slot="start" aria-hidden="true"></ion-icon>
@@ -39,9 +36,8 @@
     </ion-card>
 
     <div class="ion-padding safe-area-padding-horizontal">
-        <core-navigation-bar *ngIf="displayNavBar" [previous]="previousChapter?.id"
-            [previousTitle]="previousNavBarTitle" [next]="nextChapter?.id" [nextTitle]="nextNavBarTitle"
-            (action)="changeChapter($event)">
+        <core-navigation-bar *ngIf="displayNavBar" [previous]="previousChapter?.id" [previousTitle]="previousNavBarTitle"
+            [next]="nextChapter?.id" [nextTitle]="nextNavBarTitle" (action)="changeChapter($event)">
         </core-navigation-bar>
 
         <core-format-text [component]="component" [componentId]="componentId" [text]="chapterContent" contextLevel="module"
@@ -51,9 +47,8 @@
             <core-tag-list [tags]="tags"></core-tag-list>
         </div>
 
-        <core-navigation-bar *ngIf="displayNavBar" [previous]="previousChapter?.id"
-            [previousTitle]="previousNavBarTitle" [next]="nextChapter?.id" [nextTitle]="nextNavBarTitle"
-            (action)="changeChapter($event)"></core-navigation-bar>
+        <core-navigation-bar *ngIf="displayNavBar" [previous]="previousChapter?.id" [previousTitle]="previousNavBarTitle"
+            [next]="nextChapter?.id" [nextTitle]="nextNavBarTitle" (action)="changeChapter($event)"></core-navigation-bar>
     </div>
 
 </core-loading>
diff --git a/src/addons/mod/chat/components/index/addon-mod-chat-index.html b/src/addons/mod/chat/components/index/addon-mod-chat-index.html
index 8f1069746..93265acea 100644
--- a/src/addons/mod/chat/components/index/addon-mod-chat-index.html
+++ b/src/addons/mod/chat/components/index/addon-mod-chat-index.html
@@ -1,14 +1,14 @@
 <!-- Buttons to add to the header. -->
 <core-navbar-buttons slot="end">
     <core-context-menu>
-        <core-context-menu-item *ngIf="externalUrl" [priority]="900" [content]="'core.openinbrowser' | translate"
-            [href]="externalUrl" iconAction="fas-external-link-alt" [showBrowserWarning]="false">
+        <core-context-menu-item *ngIf="externalUrl" [priority]="900" [content]="'core.openinbrowser' | translate" [href]="externalUrl"
+            iconAction="fas-external-link-alt" [showBrowserWarning]="false">
         </core-context-menu-item>
         <core-context-menu-item *ngIf="description" [priority]="800" [content]="'core.moduleintro' | translate"
             (action)="expandDescription()" iconAction="fas-arrow-right">
         </core-context-menu-item>
-        <core-context-menu-item *ngIf="blog" [priority]="750" content="{{'addon.blog.blog' | translate}}"
-            iconAction="far-newspaper" (action)="gotoBlog()">
+        <core-context-menu-item *ngIf="blog" [priority]="750" content="{{'addon.blog.blog' | translate}}" iconAction="far-newspaper"
+            (action)="gotoBlog()">
         </core-context-menu-item>
         <core-context-menu-item *ngIf="loaded && isOnline" [priority]="700" [content]="'core.refresh' | translate"
             (action)="doRefresh(null, $event)" [iconAction]="refreshIcon" [closeOnClick]="false">
@@ -27,14 +27,10 @@
 <core-loading [hideUntil]="loaded" class="safe-area-padding">
 
     <!-- Activity info. -->
-    <core-course-module-info *ngIf="showCompletion" [module]="module" [showManualCompletion]="true"
-        (completionChanged)="onCompletionChange()">
+    <core-course-module-info [module]="module" (completionChanged)="onCompletionChange()" [description]="description"
+        [component]="component" [componentId]="componentId" [courseId]="courseId">
     </core-course-module-info>
 
-    <core-course-module-description [description]="description" [component]="component" [componentId]="componentId"
-        contextLevel="module" [contextInstanceId]="module.id" [courseId]="courseId">
-    </core-course-module-description>
-
     <ion-card *ngIf="chatInfo" class="core-info-card">
         <ion-item>
             <ion-icon name="fas-clock" slot="start" aria-hidden="true"></ion-icon>
diff --git a/src/addons/mod/choice/components/index/addon-mod-choice-index.html b/src/addons/mod/choice/components/index/addon-mod-choice-index.html
index 60a41827e..f0e2aa0f5 100644
--- a/src/addons/mod/choice/components/index/addon-mod-choice-index.html
+++ b/src/addons/mod/choice/components/index/addon-mod-choice-index.html
@@ -1,14 +1,14 @@
 <!-- Buttons to add to the header. -->
 <core-navbar-buttons slot="end">
     <core-context-menu>
-        <core-context-menu-item *ngIf="externalUrl" [priority]="900" [content]="'core.openinbrowser' | translate"
-            [href]="externalUrl" iconAction="fas-external-link-alt" [showBrowserWarning]="false">
+        <core-context-menu-item *ngIf="externalUrl" [priority]="900" [content]="'core.openinbrowser' | translate" [href]="externalUrl"
+            iconAction="fas-external-link-alt" [showBrowserWarning]="false">
         </core-context-menu-item>
         <core-context-menu-item *ngIf="description" [priority]="800" [content]="'core.moduleintro' | translate"
             (action)="expandDescription()" iconAction="fas-arrow-right">
         </core-context-menu-item>
-        <core-context-menu-item *ngIf="blog" [priority]="750" content="{{'addon.blog.blog' | translate}}"
-            iconAction="far-newspaper" (action)="gotoBlog()">
+        <core-context-menu-item *ngIf="blog" [priority]="750" content="{{'addon.blog.blog' | translate}}" iconAction="far-newspaper"
+            (action)="gotoBlog()">
         </core-context-menu-item>
         <core-context-menu-item *ngIf="loaded && !hasOffline && isOnline" [priority]="700" [content]="'core.refresh' | translate"
             (action)="doRefresh(null, $event)" [iconAction]="refreshIcon" [closeOnClick]="false">
@@ -29,14 +29,10 @@
 <core-loading [hideUntil]="loaded">
 
     <!-- Activity info. -->
-    <core-course-module-info *ngIf="showCompletion" [module]="module" [showManualCompletion]="true"
-        (completionChanged)="onCompletionChange()">
+    <core-course-module-info [module]="module" (completionChanged)="onCompletionChange()" [description]="description"
+        [component]="component" [componentId]="componentId" [courseId]="courseId">
     </core-course-module-info>
 
-    <core-course-module-description [description]="description" [component]="component" [componentId]="componentId"
-        contextLevel="module" [contextInstanceId]="module.id" [courseId]="courseId">
-    </core-course-module-description>
-
     <!-- Activity availability messages -->
     <ion-card class="core-info-card" *ngIf="choiceNotOpenYet">
         <ion-item>
@@ -54,8 +50,7 @@
             <ion-label>
                 <p *ngIf="options.length">
                     {{ 'addon.mod_choice.yourselection' | translate }}
-                    <core-format-text [text]="options[0].text" contextLevel="module" [contextInstanceId]="module.id"
-                        [courseId]="courseId">
+                    <core-format-text [text]="options[0].text" contextLevel="module" [contextInstanceId]="module.id" [courseId]="courseId">
                     </core-format-text>
                 </p>
                 <p>{{ 'addon.mod_choice.expired' | translate:{$a: closeTimeReadable} }}</p>
@@ -145,10 +140,12 @@
                                 </p>
                             </ion-label>
                         </ion-item-divider>
-                        <ion-item *ngFor="let user of result.userresponses" core-user-link [courseId]="courseId"
-                            [userId]="user.userid" [attr.aria-label]="user.fullname" class="ion-text-wrap">
+                        <ion-item *ngFor="let user of result.userresponses" core-user-link [courseId]="courseId" [userId]="user.userid"
+                            [attr.aria-label]="user.fullname" class="ion-text-wrap">
                             <core-user-avatar [user]="user" slot="start" [courseId]="courseId"></core-user-avatar>
-                            <ion-label><p>{{user.fullname}}</p></ion-label>
+                            <ion-label>
+                                <p>{{user.fullname}}</p>
+                            </ion-label>
                         </ion-item>
                     </ion-item-group>
                 </ion-col>
@@ -159,7 +156,9 @@
     <ion-card class="core-info-card" *ngIf="!canSeeResults && !choiceNotOpenYet">
         <ion-item>
             <ion-icon name="fas-info-circle" slot="start" aria-hidden="true"></ion-icon>
-            <ion-label><p>{{ 'addon.mod_choice.noresultsviewable' | translate }}</p></ion-label>
+            <ion-label>
+                <p>{{ 'addon.mod_choice.noresultsviewable' | translate }}</p>
+            </ion-label>
         </ion-item>
     </ion-card>
 </core-loading>
diff --git a/src/addons/mod/data/components/index/addon-mod-data-index.html b/src/addons/mod/data/components/index/addon-mod-data-index.html
index 7f8633b5d..f8a993361 100644
--- a/src/addons/mod/data/components/index/addon-mod-data-index.html
+++ b/src/addons/mod/data/components/index/addon-mod-data-index.html
@@ -4,28 +4,27 @@
         <ion-icon name="fas-search" slot="icon-only" aria-hidden="true"></ion-icon>
     </ion-button>
     <core-context-menu>
-        <core-context-menu-item *ngIf="externalUrl" [priority]="900" [content]="'core.openinbrowser' | translate"
-            [href]="externalUrl" iconAction="fas-external-link-alt" [showBrowserWarning]="false">
+        <core-context-menu-item *ngIf="externalUrl" [priority]="900" [content]="'core.openinbrowser' | translate" [href]="externalUrl"
+            iconAction="fas-external-link-alt" [showBrowserWarning]="false">
         </core-context-menu-item>
         <core-context-menu-item *ngIf="description" [priority]="800" [content]="'core.moduleintro' | translate"
             (action)="expandDescription()" iconAction="fas-arrow-right">
         </core-context-menu-item>
-        <core-context-menu-item *ngIf="blog" [priority]="750" content="{{'addon.blog.blog' | translate}}"
-            iconAction="far-newspaper" (action)="gotoBlog()">
+        <core-context-menu-item *ngIf="blog" [priority]="750" content="{{'addon.blog.blog' | translate}}" iconAction="far-newspaper"
+            (action)="gotoBlog()">
         </core-context-menu-item>
         <core-context-menu-item *ngIf="loaded && !(hasOffline || hasOfflineRatings) && isOnline" [priority]="700"
-            [content]="'core.refresh' | translate" (action)="doRefresh(null, $event)" [iconAction]="refreshIcon"
-            [closeOnClick]="false">
+            [content]="'core.refresh' | translate" (action)="doRefresh(null, $event)" [iconAction]="refreshIcon" [closeOnClick]="false">
         </core-context-menu-item>
         <core-context-menu-item *ngIf="loaded && (hasOffline || hasOfflineRatings) && isOnline" [priority]="600"
             [content]="'core.settings.synchronizenow' | translate" (action)="doRefresh(null, $event, true)" [iconAction]="syncIcon"
             [closeOnClick]="false">
         </core-context-menu-item>
-        <core-context-menu-item [priority]="500" *ngIf="canAdd" [content]="'addon.mod_data.addentries' | translate"
-            iconAction="fas-plus" (action)="gotoAddEntries()">
+        <core-context-menu-item [priority]="500" *ngIf="canAdd" [content]="'addon.mod_data.addentries' | translate" iconAction="fas-plus"
+            (action)="gotoAddEntries()">
         </core-context-menu-item>
-        <core-context-menu-item [priority]="400" *ngIf="firstEntry" [content]="'addon.mod_data.single' | translate"
-            iconAction="fas-file" (action)="gotoEntry(firstEntry)">
+        <core-context-menu-item [priority]="400" *ngIf="firstEntry" [content]="'addon.mod_data.single' | translate" iconAction="fas-file"
+            (action)="gotoEntry(firstEntry)">
         </core-context-menu-item>
         <core-context-menu-item *ngIf="prefetchStatusIcon" [priority]="300" [content]="prefetchText" (action)="prefetch($event)"
             [iconAction]="prefetchStatusIcon" [closeOnClick]="false">
@@ -40,14 +39,10 @@
 <core-loading [hideUntil]="loaded">
 
     <!-- Activity info. -->
-    <core-course-module-info *ngIf="showCompletion" [module]="module" [showManualCompletion]="true"
-        (completionChanged)="onCompletionChange()">
+    <core-course-module-info [module]="module" (completionChanged)="onCompletionChange()" [description]="description"
+        [component]="component" [componentId]="componentId" [courseId]="courseId">
     </core-course-module-info>
 
-    <core-course-module-description [description]="description" [component]="component" [componentId]="componentId"
-        contextLevel="module" [contextInstanceId]="module.id" [courseId]="courseId">
-    </core-course-module-description>
-
     <!-- Data done in offline but not synchronized -->
     <ion-card class="core-warning-card" *ngIf="hasOffline || hasOfflineRatings">
         <ion-item>
diff --git a/src/addons/mod/feedback/components/index/addon-mod-feedback-index.html b/src/addons/mod/feedback/components/index/addon-mod-feedback-index.html
index 124241f10..b6852c689 100644
--- a/src/addons/mod/feedback/components/index/addon-mod-feedback-index.html
+++ b/src/addons/mod/feedback/components/index/addon-mod-feedback-index.html
@@ -1,14 +1,14 @@
 <!-- Buttons to add to the header. -->
 <core-navbar-buttons slot="end">
     <core-context-menu>
-        <core-context-menu-item *ngIf="externalUrl" [priority]="900" [content]="'core.openinbrowser' | translate"
-            [href]="externalUrl" iconAction="fas-external-link-alt" [showBrowserWarning]="false">
+        <core-context-menu-item *ngIf="externalUrl" [priority]="900" [content]="'core.openinbrowser' | translate" [href]="externalUrl"
+            iconAction="fas-external-link-alt" [showBrowserWarning]="false">
         </core-context-menu-item>
         <core-context-menu-item *ngIf="description" [priority]="800" [content]="'core.moduleintro' | translate"
             (action)="expandDescription()" iconAction="fas-arrow-right">
         </core-context-menu-item>
-        <core-context-menu-item *ngIf="blog" [priority]="750" content="{{'addon.blog.blog' | translate}}"
-            iconAction="far-newspaper" (action)="gotoBlog()">
+        <core-context-menu-item *ngIf="blog" [priority]="750" content="{{'addon.blog.blog' | translate}}" iconAction="far-newspaper"
+            (action)="gotoBlog()">
         </core-context-menu-item>
         <core-context-menu-item *ngIf="loaded && !hasOffline && isOnline" [priority]="700" [content]="'core.refresh' | translate"
             (action)="doRefresh(null, $event)" [iconAction]="refreshIcon" [closeOnClick]="false">
@@ -29,22 +29,18 @@
 <core-loading [hideUntil]="loaded">
 
     <!-- Activity info. -->
-    <core-course-module-info *ngIf="showCompletion" [module]="module" [showManualCompletion]="true"
-        (completionChanged)="onCompletionChange()">
+    <core-course-module-info [module]="module" (completionChanged)="onCompletionChange()" [description]="description"
+        [component]="component" [componentId]="componentId" [courseId]="courseId">
     </core-course-module-info>
 
-    <core-course-module-description [description]="description" [component]="component" [componentId]="componentId"
-        contextLevel="module" [contextInstanceId]="module.id" [courseId]="courseId">
-    </core-course-module-description>
-
     <core-tabs [hideUntil]="tabsReady" [selectedIndex]="firstSelectedTab">
         <core-tab [title]="'addon.mod_feedback.overview' | translate" id="overview" (ionSelect)="tabChanged('overview')">
             <ng-template>
                 <ng-container *ngTemplateOutlet="tabOverview"></ng-container>
             </ng-template>
         </core-tab>
-        <core-tab *ngIf="showAnalysis && access && access.canviewreports" id="analysis"
-            [title]="'addon.mod_feedback.analysis' | translate" (ionSelect)="tabChanged('analysis')">
+        <core-tab *ngIf="showAnalysis && access && access.canviewreports" id="analysis" [title]="'addon.mod_feedback.analysis' | translate"
+            (ionSelect)="tabChanged('analysis')">
             <ng-template>
                 <ng-container *ngTemplateOutlet="tabAnalysis"></ng-container>
             </ng-template>
@@ -73,10 +69,8 @@
                 </ion-select-option>
             </ion-select>
         </ion-item>
-        <ion-item class="ion-text-wrap" (click)="openRespondents()"
-            [class.hide-detail]="!(access.canviewreports && completedCount > 0)"
-            detail="true"
-            [button]="access.canviewreports && completedCount > 0">
+        <ion-item class="ion-text-wrap" (click)="openRespondents()" [class.hide-detail]="!(access.canviewreports && completedCount > 0)"
+            detail="true" [button]="access.canviewreports && completedCount > 0">
             <ion-label>
                 <h2>{{ 'addon.mod_feedback.completed_feedbacks' | translate }}</h2>
             </ion-label>
@@ -87,8 +81,8 @@
                 </span>
             </ion-badge>
         </ion-item>
-        <ion-item class="ion-text-wrap" *ngIf="!access.isanonymous && access.canviewreports" (click)="openNonRespondents()"
-            detail="true" button>
+        <ion-item class="ion-text-wrap" *ngIf="!access.isanonymous && access.canviewreports" (click)="openNonRespondents()" detail="true"
+            button>
             <ion-label>
                 <h2>{{ 'addon.mod_feedback.show_nonrespondents' | translate }}</h2>
             </ion-label>
@@ -208,12 +202,12 @@
                     <ion-label>
                         <p class="item-heading">
                             {{item.num}}. <core-format-text [component]="component" [componentId]="componentId" [text]="item.name"
-                            contextLevel="module" [contextInstanceId]="module.id" [courseId]="courseId">
+                                contextLevel="module" [contextInstanceId]="module.id" [courseId]="courseId">
                             </core-format-text>
                         </p>
                         <p>
-                            <core-format-text [component]="component" [componentId]="componentId" [text]="item.label"
-                                contextLevel="module" [contextInstanceId]="module.id" [courseId]="courseId">
+                            <core-format-text [component]="component" [componentId]="componentId" [text]="item.label" contextLevel="module"
+                                [contextInstanceId]="module.id" [courseId]="courseId">
                             </core-format-text>
                         </p>
                         <ng-container [ngSwitch]="item.templateName">
@@ -232,8 +226,7 @@
                             </ng-container>
                             <ng-container *ngSwitchCase="'chart'">
                                 <core-chart [type]="item.chartType" [data]="item.chartData" [labels]="item.labels" height="300"
-                                    contextLevel="module" [contextInstanceId]="module.id" [wsNotFiltered]="true"
-                                    [courseId]="courseId">
+                                    contextLevel="module" [contextInstanceId]="module.id" [wsNotFiltered]="true" [courseId]="courseId">
                                 </core-chart>
                                 <p *ngIf="item.average">
                                     {{ 'addon.mod_feedback.average' | translate }}: {{item.average | number : '1.2-2'}}
diff --git a/src/addons/mod/folder/components/index/addon-mod-folder-index.html b/src/addons/mod/folder/components/index/addon-mod-folder-index.html
index 4763418b3..e44e8a1b7 100644
--- a/src/addons/mod/folder/components/index/addon-mod-folder-index.html
+++ b/src/addons/mod/folder/components/index/addon-mod-folder-index.html
@@ -1,14 +1,14 @@
 <!-- Buttons to add to the header. -->
 <core-navbar-buttons slot="end">
     <core-context-menu>
-        <core-context-menu-item *ngIf="externalUrl" [priority]="900" [content]="'core.openinbrowser' | translate"
-            [href]="externalUrl" iconAction="fas-external-link-alt" [showBrowserWarning]="false">
+        <core-context-menu-item *ngIf="externalUrl" [priority]="900" [content]="'core.openinbrowser' | translate" [href]="externalUrl"
+            iconAction="fas-external-link-alt" [showBrowserWarning]="false">
         </core-context-menu-item>
         <core-context-menu-item *ngIf="description" [priority]="800" [content]="'core.moduleintro' | translate"
             (action)="expandDescription()" iconAction="fas-arrow-right">
         </core-context-menu-item>
-        <core-context-menu-item *ngIf="blog" [priority]="750" content="{{'addon.blog.blog' | translate}}"
-             iconAction="far-newspaper" (action)="gotoBlog()">
+        <core-context-menu-item *ngIf="blog" [priority]="750" content="{{'addon.blog.blog' | translate}}" iconAction="far-newspaper"
+            (action)="gotoBlog()">
         </core-context-menu-item>
         <core-context-menu-item *ngIf="!subfolder" [priority]="700" [content]="'core.refresh' | translate"
             (action)="doRefresh(null, $event)" [iconAction]="refreshIcon" [closeOnClick]="false">
@@ -26,14 +26,11 @@
 <core-loading [hideUntil]="loaded">
 
     <!-- Activity info. -->
-    <core-course-module-info *ngIf="showCompletion" [module]="module" [showManualCompletion]="true"
-        (completionChanged)="onCompletionChange()">
+    <core-course-module-info [module]="module" (completionChanged)="onCompletionChange()" [description]="description"
+        [component]="component" [componentId]="componentId" [courseId]="courseId">
+        <h3 *ngIf="subfolder" title>{{subfolder.filename}}</h3>
     </core-course-module-info>
 
-    <core-course-module-description [description]="description" [component]="component" [componentId]="componentId"
-        contextLevel="module" [contextInstanceId]="module.id" [courseId]="courseId">
-    </core-course-module-description>
-
     <ion-list *ngIf="contents && (contents.files.length + contents.folders.length > 0)">
         <ng-container *ngFor="let folder of contents.folders">
             <ion-item class="item-file" (click)="openFolder(folder)" detail="true" button>
diff --git a/src/addons/mod/forum/components/index/index.html b/src/addons/mod/forum/components/index/index.html
index 3703497a6..642a96d2f 100644
--- a/src/addons/mod/forum/components/index/index.html
+++ b/src/addons/mod/forum/components/index/index.html
@@ -1,38 +1,30 @@
 <!-- Buttons to add to the header. -->
 <core-navbar-buttons slot="end">
     <core-context-menu>
-        <core-context-menu-item *ngIf="externalUrl"
-            [priority]="900" [content]="'core.openinbrowser' | translate" [href]="externalUrl" iconAction="fas-external-link-alt"
-            [showBrowserWarning]="false">
+        <core-context-menu-item *ngIf="externalUrl" [priority]="900" [content]="'core.openinbrowser' | translate" [href]="externalUrl"
+            iconAction="fas-external-link-alt" [showBrowserWarning]="false">
         </core-context-menu-item>
         <core-context-menu-item *ngIf="description" [priority]="800" [content]="'core.moduleintro' | translate"
             (action)="expandDescription()" iconAction="fas-arrow-right">
         </core-context-menu-item>
-        <core-context-menu-item *ngIf="blog"
-            [priority]="750" content="{{'addon.blog.blog' | translate}}" iconAction="far-newspaper" (action)="gotoBlog()">
+        <core-context-menu-item *ngIf="blog" [priority]="750" content="{{'addon.blog.blog' | translate}}" iconAction="far-newspaper"
+            (action)="gotoBlog()">
         </core-context-menu-item>
-        <core-context-menu-item
-            *ngIf="discussions.loaded && !(hasOffline || hasOfflineRatings) && isOnline"
-            [priority]="700" [content]="'addon.mod_forum.refreshdiscussions' | translate" [iconAction]="refreshIcon" [closeOnClick]="false"
+        <core-context-menu-item *ngIf="discussions.loaded && !(hasOffline || hasOfflineRatings) && isOnline" [priority]="700"
+            [content]="'addon.mod_forum.refreshdiscussions' | translate" [iconAction]="refreshIcon" [closeOnClick]="false"
             (action)="doRefresh(null, $event)">
         </core-context-menu-item>
-        <core-context-menu-item
-            *ngIf="discussions.loaded && (hasOffline || hasOfflineRatings) && isOnline"
-            [priority]="600" [content]="'core.settings.synchronizenow' | translate" [iconAction]="syncIcon" [closeOnClick]="false"
+        <core-context-menu-item *ngIf="discussions.loaded && (hasOffline || hasOfflineRatings) && isOnline" [priority]="600"
+            [content]="'core.settings.synchronizenow' | translate" [iconAction]="syncIcon" [closeOnClick]="false"
             (action)="doRefresh(null, $event, true)">
         </core-context-menu-item>
-        <core-context-menu-item *ngIf="prefetchStatusIcon"
-            [priority]="500" [content]="prefetchText" [iconAction]="prefetchStatusIcon" [closeOnClick]="false"
-            (action)="prefetch($event)">
+        <core-context-menu-item *ngIf="prefetchStatusIcon" [priority]="500" [content]="prefetchText" [iconAction]="prefetchStatusIcon"
+            [closeOnClick]="false" (action)="prefetch($event)">
         </core-context-menu-item>
-        <core-context-menu-item *ngIf="size"
-            iconDescription="fas-archive" iconAction="fas-trash"
-            [priority]="400" [content]="'core.clearstoreddata' | translate:{$a: size}" [closeOnClick]="false"
-            (action)="removeFiles($event)">
+        <core-context-menu-item *ngIf="size" iconDescription="fas-archive" iconAction="fas-trash" [priority]="400"
+            [content]="'core.clearstoreddata' | translate:{$a: size}" [closeOnClick]="false" (action)="removeFiles($event)">
         </core-context-menu-item>
-        <core-context-menu-item *ngIf="sortingAvailable"
-            iconAction="fas-sort"
-            [priority]="300" [content]="'core.sort' | translate"
+        <core-context-menu-item *ngIf="sortingAvailable" iconAction="fas-sort" [priority]="300" [content]="'core.sort' | translate"
             (action)="showSortOrderSelector()">
         </core-context-menu-item>
     </core-context-menu>
@@ -46,15 +38,16 @@
 
     <core-loading [hideUntil]="discussions.loaded">
         <!-- Activity info. -->
-        <core-course-module-info *ngIf="showCompletion" [module]="module" [showManualCompletion]="true"
-            (completionChanged)="onCompletionChange()">
+        <core-course-module-info [module]="module" (completionChanged)="onCompletionChange()"
+            [description]="forum && forum.type != 'single' && description" [component]="component"
+            [componentId]="componentId" [courseId]="courseId">
+            <ion-item>
+                <ion-label>
+                    {{descriptionNote}}
+                </ion-label>
+            </ion-item>
         </core-course-module-info>
 
-        <core-course-module-description *ngIf="forum && forum.type != 'single'"
-            [description]="description" [component]="component" [componentId]="componentId" [note]="descriptionNote"
-            contextLevel="module" [contextInstanceId]="module && module.id" [courseId]="courseId">
-        </core-course-module-description>
-
         <!-- Forum discussions found to be synchronized -->
         <ion-card class="core-warning-card" *ngIf="hasOffline || hasOfflineRatings">
             <ion-item>
@@ -72,23 +65,17 @@
         </ion-card>
 
         <ng-container *ngIf="forum">
-            <core-empty-box *ngIf="discussions.empty" icon="far-comments"
-                [message]="'addon.mod_forum.forumnodiscussionsyet' | translate">
+            <core-empty-box *ngIf="discussions.empty" icon="far-comments" [message]="'addon.mod_forum.forumnodiscussionsyet' | translate">
             </core-empty-box>
 
             <div *ngIf="!discussions.empty && sortingAvailable && selectedSortOrder" class="ion-text-wrap">
-                <core-combobox
-                    [modalOptions]="sortOrderSelectorModalOptions"
-                    listboxId="addon-mod-forum-sort-selector"
-                    [label]="('core.sort' | translate)"
-                    (onChange)="setSortOrder($event)"
-                    [selection]="selectedSortOrder.label | translate"
+                <core-combobox [modalOptions]="sortOrderSelectorModalOptions" listboxId="addon-mod-forum-sort-selector"
+                    [label]="('core.sort' | translate)" (onChange)="setSortOrder($event)" [selection]="selectedSortOrder.label | translate"
                     interface="modal">
                 </core-combobox>
             </div>
 
-            <ion-item *ngFor="let discussion of discussions.items"
-                class="addon-mod-forum-discussion" detail="true"
+            <ion-item *ngFor="let discussion of discussions.items" class="addon-mod-forum-discussion" detail="true"
                 [lines]="discussion.groupname && 'none'" [attr.aria-current]="discussions.getItemAriaCurrent(discussion)"
                 (click)="discussions.select(discussion)" button>
                 <ion-label>
@@ -98,15 +85,12 @@
                                 [attr.aria-label]="'addon.mod_forum.discussionpinned' | translate"></ion-icon>
                             <ion-icon name="fas-star" class="addon-forum-star" *ngIf="!discussion.pinned && discussion.starred"
                                 [attr.aria-label]="'addon.mod_forum.favourites' | translate"></ion-icon>
-                            <core-format-text
-                                [text]="discussion.subject"
-                                contextLevel="module" [contextInstanceId]="module && module.id" [courseId]="courseId">
+                            <core-format-text [text]="discussion.subject" contextLevel="module" [contextInstanceId]="module && module.id"
+                                [courseId]="courseId">
                             </core-format-text>
                         </p>
-                        <ion-button *ngIf="canPin || discussion.canlock || discussion.canfavourite"
-                            fill="clear" color="dark"
-                            [attr.aria-label]="('core.displayoptions' | translate)"
-                            (click)="showOptionsMenu($event, discussion)">
+                        <ion-button *ngIf="canPin || discussion.canlock || discussion.canfavourite" fill="clear" color="dark"
+                            [attr.aria-label]="('core.displayoptions' | translate)" (click)="showOptionsMenu($event, discussion)">
                             <ion-icon name="ellipsis-vertical" slot="icon-only" aria-hidden="true">
                             </ion-icon>
                         </ion-button>
@@ -158,8 +142,7 @@
                 </ion-label>
             </ion-item>
 
-            <core-infinite-loading
-                [enabled]="discussions.onlineLoaded && !discussions.completed" [error]="discussions.fetchFailed"
+            <core-infinite-loading [enabled]="discussions.onlineLoaded && !discussions.completed" [error]="discussions.fetchFailed"
                 (action)="fetchMoreDiscussions($event)">
             </core-infinite-loading>
         </ng-container>
diff --git a/src/addons/mod/glossary/components/index/addon-mod-glossary-index.html b/src/addons/mod/glossary/components/index/addon-mod-glossary-index.html
index 02b9e0405..61cee7db8 100644
--- a/src/addons/mod/glossary/components/index/addon-mod-glossary-index.html
+++ b/src/addons/mod/glossary/components/index/addon-mod-glossary-index.html
@@ -10,18 +10,17 @@
     </ion-button>
 
     <core-context-menu>
-        <core-context-menu-item *ngIf="externalUrl" [priority]="900" [content]="'core.openinbrowser' | translate"
-            [href]="externalUrl" iconAction="fas-external-link-alt" [showBrowserWarning]="false">
+        <core-context-menu-item *ngIf="externalUrl" [priority]="900" [content]="'core.openinbrowser' | translate" [href]="externalUrl"
+            iconAction="fas-external-link-alt" [showBrowserWarning]="false">
         </core-context-menu-item>
         <core-context-menu-item *ngIf="description" [priority]="800" [content]="'core.moduleintro' | translate"
             (action)="expandDescription()" iconAction="fas-arrow-right">
         </core-context-menu-item>
-        <core-context-menu-item *ngIf="blog" [priority]="750" content="{{'addon.blog.blog' | translate}}"
-            iconAction="far-newspaper" (action)="gotoBlog()">
+        <core-context-menu-item *ngIf="blog" [priority]="750" content="{{'addon.blog.blog' | translate}}" iconAction="far-newspaper"
+            (action)="gotoBlog()">
         </core-context-menu-item>
         <core-context-menu-item *ngIf="loaded && !(hasOffline || hasOfflineRatings) && isOnline" [priority]="700"
-            [content]="'core.refresh' | translate" (action)="doRefresh(null, $event)" [iconAction]="refreshIcon"
-            [closeOnClick]="false">
+            [content]="'core.refresh' | translate" (action)="doRefresh(null, $event)" [iconAction]="refreshIcon" [closeOnClick]="false">
         </core-context-menu-item>
         <core-context-menu-item *ngIf="loaded && (hasOffline || hasOfflineRatings) && isOnline" [priority]="600"
             (action)="doRefresh(null, $event, true)" [content]="'core.settings.synchronizenow' | translate" [iconAction]="syncIcon"
@@ -51,14 +50,10 @@
 
     <core-loading [hideUntil]="loaded">
         <!-- Activity info. -->
-        <core-course-module-info *ngIf="showCompletion && !isSearch" [module]="module" [showManualCompletion]="true"
-            (completionChanged)="onCompletionChange()">
+        <core-course-module-info *ngIf="!isSearch" [module]="module" (completionChanged)="onCompletionChange()" [description]="description"
+            [component]="component" [componentId]="componentId" [courseId]="courseId">
         </core-course-module-info>
 
-        <core-course-module-description *ngIf="!isSearch" [description]="description" [component]="component" [componentId]="componentId"
-            contextLevel="module" [contextInstanceId]="module.id" [courseId]="courseId">
-        </core-course-module-description>
-
         <!-- Has offline data to be synchronized -->
         <ion-card class="core-warning-card" *ngIf="hasOffline || hasOfflineRatings">
             <ion-item>
@@ -69,7 +64,9 @@
 
         <ion-list *ngIf="!isSearch && entries.offlineEntries.length > 0">
             <ion-item-divider>
-                <ion-label><h2>{{ 'addon.mod_glossary.entriestobesynced' | translate }}</h2></ion-label>
+                <ion-label>
+                    <h2>{{ 'addon.mod_glossary.entriestobesynced' | translate }}</h2>
+                </ion-label>
             </ion-item-divider>
             <ion-item *ngFor="let entry of entries.offlineEntries" (click)="entries.select(entry)" detail="false" button
                 [attr.aria-current]="entries.getItemAriaCurrent(entry)">
@@ -84,11 +81,12 @@
         <ion-list *ngIf="entries.onlineEntries.length > 0">
             <ng-container *ngFor="let entry of entries.onlineEntries; let index = index">
                 <ion-item-divider *ngIf="getDivider && showDivider(entry, entries.onlineEntries[index - 1])">
-                    <ion-label><h2>{{ getDivider!(entry) }}</h2></ion-label>
+                    <ion-label>
+                        <h2>{{ getDivider!(entry) }}</h2>
+                    </ion-label>
                 </ion-item-divider>
 
-                <ion-item button (click)="entries.select(entry)" [attr.aria-current]="entries.getItemAriaCurrent(entry)"
-                    detail="false">
+                <ion-item button (click)="entries.select(entry)" [attr.aria-current]="entries.getItemAriaCurrent(entry)" detail="false">
                     <ion-label>
                         <core-format-text [text]="entry.concept" contextLevel="module" [contextInstanceId]="glossary!.coursemodule"
                             [courseId]="courseId">
diff --git a/src/addons/mod/h5pactivity/components/index/addon-mod-h5pactivity-index.html b/src/addons/mod/h5pactivity/components/index/addon-mod-h5pactivity-index.html
index ca3d3524f..1811b5b44 100644
--- a/src/addons/mod/h5pactivity/components/index/addon-mod-h5pactivity-index.html
+++ b/src/addons/mod/h5pactivity/components/index/addon-mod-h5pactivity-index.html
@@ -5,18 +5,17 @@
             [priority]="1000" [content]="'addon.mod_h5pactivity.review_my_attempts' | translate" (action)="viewMyAttempts()"
             iconAction="stats-chart">
         </core-context-menu-item>
-        <core-context-menu-item *ngIf="canViewAllAttempts"
-            [priority]="1000" [content]="'addon.mod_h5pactivity.review_attempts' | translate" (action)="viewAllAttempts()"
-            iconAction="stats-chart">
+        <core-context-menu-item *ngIf="canViewAllAttempts" [priority]="1000" [content]="'addon.mod_h5pactivity.review_attempts' | translate"
+            (action)="viewAllAttempts()" iconAction="stats-chart">
         </core-context-menu-item>
-        <core-context-menu-item *ngIf="externalUrl" [priority]="900" [content]="'core.openinbrowser' | translate"
-            [href]="externalUrl" iconAction="fas-external-link-alt" [showBrowserWarning]="false">
+        <core-context-menu-item *ngIf="externalUrl" [priority]="900" [content]="'core.openinbrowser' | translate" [href]="externalUrl"
+            iconAction="fas-external-link-alt" [showBrowserWarning]="false">
         </core-context-menu-item>
         <core-context-menu-item *ngIf="description" [priority]="800" [content]="'core.moduleintro' | translate"
             (action)="expandDescription()" iconAction="fas-arrow-right">
         </core-context-menu-item>
-        <core-context-menu-item *ngIf="blog" [priority]="750" content="{{'addon.blog.blog' | translate}}"
-            iconAction="far-newspaper" (action)="gotoBlog()">
+        <core-context-menu-item *ngIf="blog" [priority]="750" content="{{'addon.blog.blog' | translate}}" iconAction="far-newspaper"
+            (action)="gotoBlog()">
         </core-context-menu-item>
         <core-context-menu-item *ngIf="loaded && !hasOffline && isOnline" [priority]="700" [content]="'core.refresh' | translate"
             (action)="doRefresh(null, $event)" [iconAction]="refreshIcon" [closeOnClick]="false">
@@ -37,14 +36,10 @@
 <core-loading [hideUntil]="loaded" class="safe-area-padding">
 
     <!-- Activity info. -->
-    <core-course-module-info *ngIf="showCompletion" [module]="module" [showManualCompletion]="true"
-        (completionChanged)="onCompletionChange()">
+    <core-course-module-info [module]="module" (completionChanged)="onCompletionChange()" [description]="description"
+        [component]="component" [componentId]="componentId" [courseId]="courseId">
     </core-course-module-info>
 
-    <core-course-module-description [description]="description" [component]="component" [componentId]="componentId"
-        contextLevel="module" [contextInstanceId]="module.id" [courseId]="courseId">
-    </core-course-module-description>
-
     <!-- Offline data stored. -->
     <ion-card class="core-warning-card" *ngIf="hasOffline">
         <ion-item>
@@ -79,8 +74,7 @@
         </ion-item>
 
         <!-- Button to download the package. -->
-        <ion-button *ngIf="!downloading && needsDownload" class="ion-text-wrap ion-margin" expand="block"
-            (click)="downloadAndPlay($event)">
+        <ion-button *ngIf="!downloading && needsDownload" class="ion-text-wrap ion-margin" expand="block" (click)="downloadAndPlay($event)">
             {{ 'addon.mod_h5pactivity.downloadh5pfile' | translate }}
         </ion-button>
 
diff --git a/src/addons/mod/imscp/components/index/addon-mod-imscp-index.html b/src/addons/mod/imscp/components/index/addon-mod-imscp-index.html
index 98901925b..4f15b3bc9 100644
--- a/src/addons/mod/imscp/components/index/addon-mod-imscp-index.html
+++ b/src/addons/mod/imscp/components/index/addon-mod-imscp-index.html
@@ -4,14 +4,14 @@
         <ion-icon name="fas-bookmark" slot="icon-only" aria-hidden="true"></ion-icon>
     </ion-button>
     <core-context-menu>
-        <core-context-menu-item *ngIf="externalUrl" [priority]="900" [content]="'core.openinbrowser' | translate"
-            [href]="externalUrl" iconAction="fas-external-link-alt" [showBrowserWarning]="false">
+        <core-context-menu-item *ngIf="externalUrl" [priority]="900" [content]="'core.openinbrowser' | translate" [href]="externalUrl"
+            iconAction="fas-external-link-alt" [showBrowserWarning]="false">
         </core-context-menu-item>
         <core-context-menu-item *ngIf="description" [priority]="800" [content]="'core.moduleintro' | translate"
             (action)="expandDescription()" iconAction="fas-arrow-right">
         </core-context-menu-item>
-        <core-context-menu-item *ngIf="blog" [priority]="750" content="{{'addon.blog.blog' | translate}}"
-            iconAction="far-newspaper" (action)="gotoBlog()">
+        <core-context-menu-item *ngIf="blog" [priority]="750" content="{{'addon.blog.blog' | translate}}" iconAction="far-newspaper"
+            (action)="gotoBlog()">
         </core-context-menu-item>
         <core-context-menu-item [priority]="700" [content]="'core.refresh' | translate" (action)="doRefresh(null, $event)"
             [iconAction]="refreshIcon" [closeOnClick]="false">
@@ -29,8 +29,7 @@
 <core-loading [hideUntil]="loaded" class="safe-area-padding">
 
     <!-- Activity info. -->
-    <core-course-module-info *ngIf="showCompletion" [module]="module" [showManualCompletion]="true"
-        (completionChanged)="onCompletionChange()">
+    <core-course-module-info [module]="module" (completionChanged)="onCompletionChange()">
     </core-course-module-info>
 
     <ion-card class="core-warning-card" *ngIf="warning">
diff --git a/src/addons/mod/lesson/components/index/addon-mod-lesson-index.html b/src/addons/mod/lesson/components/index/addon-mod-lesson-index.html
index d8948ccbb..aa28071e4 100644
--- a/src/addons/mod/lesson/components/index/addon-mod-lesson-index.html
+++ b/src/addons/mod/lesson/components/index/addon-mod-lesson-index.html
@@ -1,14 +1,14 @@
 <!-- Buttons to add to the header. -->
 <core-navbar-buttons slot="end">
     <core-context-menu>
-        <core-context-menu-item *ngIf="externalUrl" [priority]="900" [content]="'core.openinbrowser' | translate"
-            [href]="externalUrl" iconAction="fas-external-link-alt" [showBrowserWarning]="false">
+        <core-context-menu-item *ngIf="externalUrl" [priority]="900" [content]="'core.openinbrowser' | translate" [href]="externalUrl"
+            iconAction="fas-external-link-alt" [showBrowserWarning]="false">
         </core-context-menu-item>
         <core-context-menu-item *ngIf="description" [priority]="800" [content]="'core.moduleintro' | translate"
             (action)="expandDescription()" iconAction="fas-arrow-right">
         </core-context-menu-item>
-        <core-context-menu-item *ngIf="blog" [priority]="750" content="{{'addon.blog.blog' | translate}}"
-            iconAction="far-newspaper" (action)="gotoBlog()">
+        <core-context-menu-item *ngIf="blog" [priority]="750" content="{{'addon.blog.blog' | translate}}" iconAction="far-newspaper"
+            (action)="gotoBlog()">
         </core-context-menu-item>
         <core-context-menu-item *ngIf="loaded && !hasOffline && isOnline" [priority]="700" [content]="'core.refresh' | translate"
             (action)="doRefresh(null, $event)" [iconAction]="refreshIcon" [closeOnClick]="false">
@@ -33,14 +33,10 @@
             <ng-template>
 
                 <!-- Activity info. -->
-                <core-course-module-info *ngIf="showCompletion" [module]="module" [showManualCompletion]="true"
-                    (completionChanged)="onCompletionChange()">
+                <core-course-module-info [module]="module" (completionChanged)="onCompletionChange()" [description]="description"
+                    [component]="component" [componentId]="componentId" [courseId]="courseId">
                 </core-course-module-info>
 
-                <core-course-module-description [description]="description" [component]="component" [componentId]="componentId"
-                    contextLevel="module" [contextInstanceId]="module.id" [courseId]="courseId">
-                </core-course-module-description>
-
                 <!-- Prevent access messages. Only show the first one. -->
                 <ion-card class="core-info-card" *ngIf="lesson && preventReasons.length">
                     <ion-item>
@@ -132,13 +128,11 @@
 
                             <ng-container *ngIf="!leftDuringTimed && !finishedOffline">
                                 <!-- User hasn't left during the session, show a start button. -->
-                                <ion-button class="ion-text-wrap ion-margin" expand="block" *ngIf="!canManage"
-                                    (click)="start(false)">
+                                <ion-button class="ion-text-wrap ion-margin" expand="block" *ngIf="!canManage" (click)="start(false)">
                                     {{ 'core.start' | translate }}
                                     <ion-icon name="fas-chevron-right" slot="end" aria-hidden="true"></ion-icon>
                                 </ion-button>
-                                <ion-button class="ion-text-wrap ion-margin" expand="block" *ngIf="canManage"
-                                    (click)="start(false)">
+                                <ion-button class="ion-text-wrap ion-margin" expand="block" *ngIf="canManage" (click)="start(false)">
                                     {{ 'addon.mod_lesson.preview' | translate }}
                                     <ion-icon name="fas-search" slot="end" aria-hidden="true"></ion-icon>
                                 </ion-button>
@@ -295,8 +289,8 @@
                             <ion-card-title>{{ 'addon.mod_lesson.overview' | translate }}</ion-card-title>
                         </ion-card-header>
 
-                        <ion-item class="ion-text-wrap" *ngFor="let student of overview.students" button
-                            (click)="openRetake(student.id)" detail="true">
+                        <ion-item class="ion-text-wrap" *ngFor="let student of overview.students" button (click)="openRetake(student.id)"
+                            detail="true">
                             <core-user-avatar [user]="student" slot="start" [userId]="student.id" [courseId]="courseId">
                             </core-user-avatar>
                             <ion-label>
diff --git a/src/addons/mod/lti/components/index/addon-mod-lti-index.html b/src/addons/mod/lti/components/index/addon-mod-lti-index.html
index 184f09284..ef10e579e 100644
--- a/src/addons/mod/lti/components/index/addon-mod-lti-index.html
+++ b/src/addons/mod/lti/components/index/addon-mod-lti-index.html
@@ -1,14 +1,14 @@
 <!-- Buttons to add to the header. -->
 <core-navbar-buttons slot="end">
     <core-context-menu>
-        <core-context-menu-item *ngIf="externalUrl" [priority]="900" [content]="'core.openinbrowser' | translate"
-            [href]="externalUrl" iconAction="fas-external-link-alt" [showBrowserWarning]="false">
+        <core-context-menu-item *ngIf="externalUrl" [priority]="900" [content]="'core.openinbrowser' | translate" [href]="externalUrl"
+            iconAction="fas-external-link-alt" [showBrowserWarning]="false">
         </core-context-menu-item>
         <core-context-menu-item *ngIf="description" [priority]="800" [content]="'core.moduleintro' | translate"
             (action)="expandDescription()" iconAction="fas-arrow-right">
         </core-context-menu-item>
-        <core-context-menu-item *ngIf="blog" [priority]="750" content="{{'addon.blog.blog' | translate}}"
-            iconAction="far-newspaper" (action)="gotoBlog()">
+        <core-context-menu-item *ngIf="blog" [priority]="750" content="{{'addon.blog.blog' | translate}}" iconAction="far-newspaper"
+            (action)="gotoBlog()">
         </core-context-menu-item>
         <core-context-menu-item *ngIf="loaded && isOnline" [priority]="700" [content]="'core.refresh' | translate"
             (action)="doRefresh(null, $event)" [iconAction]="refreshIcon" [closeOnClick]="false">
@@ -20,14 +20,11 @@
 <core-loading [hideUntil]="loaded" class="safe-area-padding">
 
     <!-- Activity info. -->
-    <core-course-module-info *ngIf="showCompletion" [module]="module" [showManualCompletion]="true"
-        (completionChanged)="onCompletionChange()">
+    <core-course-module-info [module]="module" (completionChanged)="onCompletionChange()"
+        [description]="lti && lti.showdescriptionlaunch && description" [component]="component" [componentId]="componentId"
+        [courseId]="courseId">
     </core-course-module-info>
 
-    <core-course-module-description *ngIf="lti && lti.showdescriptionlaunch" [description]="description" [component]="component"
-        [componentId]="componentId" contextLevel="module" [contextInstanceId]="module.id" [courseId]="courseId">
-    </core-course-module-description>
-
     <div class="ion-padding">
         <ion-button expand="block" (click)="launch()">
             <ion-icon name="fas-external-link-alt" slot="start" aria-hidden="true"></ion-icon>
diff --git a/src/addons/mod/page/components/index/addon-mod-page-index.html b/src/addons/mod/page/components/index/addon-mod-page-index.html
index fcc229d26..2dcb76d66 100644
--- a/src/addons/mod/page/components/index/addon-mod-page-index.html
+++ b/src/addons/mod/page/components/index/addon-mod-page-index.html
@@ -1,14 +1,14 @@
 <!-- Buttons to add to the header. -->
 <core-navbar-buttons slot="end">
     <core-context-menu>
-        <core-context-menu-item *ngIf="externalUrl" [priority]="900" [content]="'core.openinbrowser' | translate"
-            [href]="externalUrl" iconAction="fas-external-link-alt" [showBrowserWarning]="false">
+        <core-context-menu-item *ngIf="externalUrl" [priority]="900" [content]="'core.openinbrowser' | translate" [href]="externalUrl"
+            iconAction="fas-external-link-alt" [showBrowserWarning]="false">
         </core-context-menu-item>
         <core-context-menu-item *ngIf="description" [priority]="800" [content]="'core.moduleintro' | translate"
             (action)="expandDescription()" iconAction="fas-arrow-right">
         </core-context-menu-item>
-        <core-context-menu-item *ngIf="blog" [priority]="750" content="{{'addon.blog.blog' | translate}}"
-            iconAction="far-newspaper" (action)="gotoBlog()">
+        <core-context-menu-item *ngIf="blog" [priority]="750" content="{{'addon.blog.blog' | translate}}" iconAction="far-newspaper"
+            (action)="gotoBlog()">
         </core-context-menu-item>
         <core-context-menu-item [priority]="700" [content]="'core.refresh' | translate" (action)="doRefresh(null, $event)"
             [iconAction]="refreshIcon" [closeOnClick]="false">
@@ -26,14 +26,10 @@
 <core-loading [hideUntil]="loaded" class="safe-area-padding">
 
     <!-- Activity info. -->
-    <core-course-module-info *ngIf="showCompletion" [module]="module" [showManualCompletion]="true"
-        (completionChanged)="onCompletionChange()">
+    <core-course-module-info [module]="module" (completionChanged)="onCompletionChange()" [description]="displayDescription && description"
+        [component]="component" [componentId]="componentId" [courseId]="courseId">
     </core-course-module-info>
 
-    <core-course-module-description *ngIf="displayDescription" [description]="description" [component]="component"
-        [componentId]="componentId" contextLevel="module" [contextInstanceId]="module.id" [courseId]="courseId">
-    </core-course-module-description>
-
     <ion-card class="core-warning-card" *ngIf="warning">
         <ion-item>
             <ion-icon name="fas-exclamation-triangle" slot="start" aria-hidden="true"></ion-icon>
diff --git a/src/addons/mod/quiz/components/index/addon-mod-quiz-index.html b/src/addons/mod/quiz/components/index/addon-mod-quiz-index.html
index 94e4bcc51..519746fe0 100644
--- a/src/addons/mod/quiz/components/index/addon-mod-quiz-index.html
+++ b/src/addons/mod/quiz/components/index/addon-mod-quiz-index.html
@@ -1,14 +1,14 @@
 <!-- Buttons to add to the header. -->
 <core-navbar-buttons slot="end">
     <core-context-menu>
-        <core-context-menu-item *ngIf="externalUrl" [priority]="900" [content]="'core.openinbrowser' | translate"
-            [href]="externalUrl" iconAction="fas-external-link-alt" [showBrowserWarning]="false">
+        <core-context-menu-item *ngIf="externalUrl" [priority]="900" [content]="'core.openinbrowser' | translate" [href]="externalUrl"
+            iconAction="fas-external-link-alt" [showBrowserWarning]="false">
         </core-context-menu-item>
         <core-context-menu-item *ngIf="description" [priority]="800" [content]="'core.moduleintro' | translate"
             (action)="expandDescription()" iconAction="fas-arrow-right">
         </core-context-menu-item>
-        <core-context-menu-item *ngIf="blog" [priority]="750" content="{{'addon.blog.blog' | translate}}"
-            [iconAction]="'far-newspaper'" (action)="gotoBlog()">
+        <core-context-menu-item *ngIf="blog" [priority]="750" content="{{'addon.blog.blog' | translate}}" [iconAction]="'far-newspaper'"
+            (action)="gotoBlog()">
         </core-context-menu-item>
         <core-context-menu-item *ngIf="loaded && !hasOffline && isOnline" [priority]="700" [content]="'core.refresh' | translate"
             (action)="doRefresh(null, $event)" [iconAction]="refreshIcon" [closeOnClick]="false">
@@ -29,19 +29,17 @@
 <core-loading [hideUntil]="loaded">
 
     <!-- Activity info. -->
-    <core-course-module-info *ngIf="showCompletion" [module]="module" [showManualCompletion]="true"
-        (completionChanged)="onCompletionChange()">
+    <core-course-module-info [module]="module" (completionChanged)="onCompletionChange()" [description]="description"
+        [component]="component" [componentId]="componentId" [courseId]="courseId">
     </core-course-module-info>
 
-    <core-course-module-description [description]="description" [component]="component" [componentId]="componentId"
-        contextLevel="module" [contextInstanceId]="module.id" [courseId]="courseId">
-    </core-course-module-description>
-
     <!-- Access rules description messages. -->
     <ion-card *ngIf="gradeMethodReadable || accessRules.length || syncTime">
         <ion-list>
             <ion-item class="ion-text-wrap" *ngFor="let rule of accessRules">
-                <ion-label><p>{{ rule }}</p></ion-label>
+                <ion-label>
+                    <p>{{ rule }}</p>
+                </ion-label>
             </ion-item>
             <ion-item class="ion-text-wrap" *ngIf="gradeMethodReadable">
                 <ion-label>
@@ -55,7 +53,7 @@
                     <p>{{ 'addon.mod_quiz.outof' | translate: { $a: {
                         grade: bestGrade.gradetopass,
                         maxgrade: quiz.gradeFormatted
-                    } } }}</p>
+                        } } }}</p>
                 </ion-label>
             </ion-item>
             <ion-item class="ion-text-wrap" *ngIf="syncTime">
@@ -96,15 +94,9 @@
             </ion-item>
             <div role="rowgroup">
                 <!-- List of attempts. -->
-                <ion-item
-                    button
-                    detail="true"
-                    *ngFor="let attempt of attempts"
-                    class="ion-text-wrap"
-                    [ngClass]='{"addon-mod_quiz-highlighted": attempt.highlightGrade}'
-                    [attr.aria-label]="'core.seemoredetail' | translate"
-                    (click)="viewAttempt(attempt.id)"
-                >
+                <ion-item button detail="true" *ngFor="let attempt of attempts" class="ion-text-wrap"
+                    [ngClass]='{"addon-mod_quiz-highlighted": attempt.highlightGrade}' [attr.aria-label]="'core.seemoredetail' | translate"
+                    (click)="viewAttempt(attempt.id)">
                     <ion-label>
                         <ion-row class="ion-align-items-center" role="row">
                             <ion-col class="ion-text-center" *ngIf="quiz.showAttemptColumn && attempt.preview" role="cell">
@@ -142,17 +134,21 @@
             <ion-item class="ion-text-wrap" *ngIf="gradebookFeedback">
                 <ion-label>
                     <p class="item-heading">{{ 'addon.mod_quiz.comment' | translate }}</p>
-                    <p><core-format-text [component]="component" [componentId]="componentId" [text]="gradebookFeedback"
-                        contextLevel="module" [contextInstanceId]="module.id" [courseId]="courseId">
-                    </core-format-text></p>
+                    <p>
+                        <core-format-text [component]="component" [componentId]="componentId" [text]="gradebookFeedback"
+                            contextLevel="module" [contextInstanceId]="module.id" [courseId]="courseId">
+                        </core-format-text>
+                    </p>
                 </ion-label>
             </ion-item>
             <ion-item class="ion-text-wrap" *ngIf="quiz.showFeedbackColumn && overallFeedback">
                 <ion-label>
                     <p class="item-heading">{{ 'addon.mod_quiz.overallfeedback' | translate }}</p>
-                    <p><core-format-text [component]="component" [componentId]="componentId" [text]="overallFeedback"
-                        contextLevel="module" [contextInstanceId]="module.id" [courseId]="courseId">
-                    </core-format-text></p>
+                    <p>
+                        <core-format-text [component]="component" [componentId]="componentId" [text]="overallFeedback" contextLevel="module"
+                            [contextInstanceId]="module.id" [courseId]="courseId">
+                        </core-format-text>
+                    </p>
                 </ion-label>
             </ion-item>
         </ion-list>
@@ -163,10 +159,14 @@
         <ion-list>
             <!-- Error messages. -->
             <ion-item class="ion-text-wrap core-danger-item addon-mod_quiz-prevent-messages" *ngFor="let message of preventMessages">
-                <ion-label><p>{{ message }}</p></ion-label>
+                <ion-label>
+                    <p>{{ message }}</p>
+                </ion-label>
             </ion-item>
             <ion-item class="ion-text-wrap core-danger-item addon-mod_quiz-no-questions" *ngIf="quiz.hasquestions === 0">
-                <ion-label><p>{{ 'addon.mod_quiz.noquestions' | translate }}</p></ion-label>
+                <ion-label>
+                    <p>{{ 'addon.mod_quiz.noquestions' | translate }}</p>
+                </ion-label>
             </ion-item>
             <ion-item class="ion-text-wrap core-danger-item addon-mod_quiz-unsupported-questions"
                 *ngIf="!hasSupportedQuestions && unsupportedQuestions.length">
@@ -226,7 +226,9 @@
 
             <!-- Spinner shown while downloading or calculating. -->
             <ion-item class="ion-text-center" *ngIf="showStatusSpinner">
-                <ion-label><ion-spinner [attr.aria-label]="'core.loading' | translate"></ion-spinner></ion-label>
+                <ion-label>
+                    <ion-spinner [attr.aria-label]="'core.loading' | translate"></ion-spinner>
+                </ion-label>
             </ion-item>
         </ion-list>
     </ion-card>
diff --git a/src/addons/mod/resource/components/index/addon-mod-resource-index.html b/src/addons/mod/resource/components/index/addon-mod-resource-index.html
index 704d31dd1..4c8e7daf6 100644
--- a/src/addons/mod/resource/components/index/addon-mod-resource-index.html
+++ b/src/addons/mod/resource/components/index/addon-mod-resource-index.html
@@ -1,12 +1,12 @@
 <!-- Buttons to add to the header. -->
 <core-navbar-buttons slot="end">
     <core-context-menu>
-        <core-context-menu-item *ngIf="externalUrl" [priority]="900" [content]="'core.openinbrowser' | translate"
-            [href]="externalUrl" iconAction="fas-external-link-alt" [showBrowserWarning]="false"></core-context-menu-item>
+        <core-context-menu-item *ngIf="externalUrl" [priority]="900" [content]="'core.openinbrowser' | translate" [href]="externalUrl"
+            iconAction="fas-external-link-alt" [showBrowserWarning]="false"></core-context-menu-item>
         <core-context-menu-item *ngIf="description" [priority]="800" [content]="'core.moduleintro' | translate"
             (action)="expandDescription()" iconAction="fas-arrow-right"></core-context-menu-item>
-        <core-context-menu-item *ngIf="blog" [priority]="750" content="{{'addon.blog.blog' | translate}}"
-            iconAction="far-newspaper" (action)="gotoBlog()"></core-context-menu-item>
+        <core-context-menu-item *ngIf="blog" [priority]="750" content="{{'addon.blog.blog' | translate}}" iconAction="far-newspaper"
+            (action)="gotoBlog()"></core-context-menu-item>
         <core-context-menu-item [priority]="700" [content]="'core.refresh' | translate" (action)="doRefresh(null, $event)"
             [iconAction]="refreshIcon" [closeOnClick]="false"></core-context-menu-item>
         <core-context-menu-item *ngIf="prefetchStatusIcon" [priority]="600" [content]="prefetchText" (action)="prefetch($event)"
@@ -21,15 +21,11 @@
 <core-loading [hideUntil]="loaded" class="safe-area-padding core-loading-fullheight">
 
     <!-- Activity info. -->
-    <core-course-module-info *ngIf="showCompletion" [module]="module" [showManualCompletion]="true"
-        (completionChanged)="onCompletionChange()">
+    <core-course-module-info [module]="module" [courseId]="courseId" (completionChanged)="onCompletionChange()"
+        [description]="mode != 'iframe' && (mode != 'embedded' || displayDescription) && description" [component]="component"
+        [componentId]="componentId">
     </core-course-module-info>
 
-    <core-course-module-description *ngIf="mode != 'iframe' && (mode != 'embedded' || displayDescription)"
-        [description]="description" [component]="component" [componentId]="componentId" contextLevel="module"
-        [contextInstanceId]="module.id" [courseId]="courseId">
-    </core-course-module-description>
-
     <ion-card class="core-warning-card" *ngIf="warning">
         <ion-item>
             <ion-icon name="fas-exclamation-triangle" slot="start" aria-hidden="true"></ion-icon>
diff --git a/src/addons/mod/scorm/components/index/addon-mod-scorm-index.html b/src/addons/mod/scorm/components/index/addon-mod-scorm-index.html
index 23c75ba08..58f417175 100644
--- a/src/addons/mod/scorm/components/index/addon-mod-scorm-index.html
+++ b/src/addons/mod/scorm/components/index/addon-mod-scorm-index.html
@@ -1,14 +1,14 @@
 <!-- Buttons to add to the header. -->
 <core-navbar-buttons slot="end">
     <core-context-menu>
-        <core-context-menu-item *ngIf="externalUrl" [priority]="900" [content]="'core.openinbrowser' | translate"
-            [href]="externalUrl" iconAction="fas-external-link-alt" [showBrowserWarning]="false">
+        <core-context-menu-item *ngIf="externalUrl" [priority]="900" [content]="'core.openinbrowser' | translate" [href]="externalUrl"
+            iconAction="fas-external-link-alt" [showBrowserWarning]="false">
         </core-context-menu-item>
         <core-context-menu-item *ngIf="description" [priority]="800" [content]="'core.moduleintro' | translate"
             (action)="expandDescription()" iconAction="fas-arrow-right">
         </core-context-menu-item>
-        <core-context-menu-item *ngIf="blog" [priority]="750" content="{{'addon.blog.blog' | translate}}"
-            iconAction="far-newspaper" (action)="gotoBlog()">
+        <core-context-menu-item *ngIf="blog" [priority]="750" content="{{'addon.blog.blog' | translate}}" iconAction="far-newspaper"
+            (action)="gotoBlog()">
         </core-context-menu-item>
         <core-context-menu-item *ngIf="loaded && !hasOffline && isOnline" [priority]="700" [content]="'core.refresh' | translate"
             (action)="doRefresh(null, $event)" [iconAction]="refreshIcon" [closeOnClick]="false">
@@ -29,14 +29,10 @@
 <core-loading [hideUntil]="loaded" class="safe-area-padding">
 
     <!-- Activity info. -->
-    <core-course-module-info *ngIf="showCompletion" [module]="module" [showManualCompletion]="true"
-        (completionChanged)="onCompletionChange()">
+    <core-course-module-info [module]="module" (completionChanged)="onCompletionChange()" [description]="description"
+        [component]="component" [componentId]="componentId" [courseId]="courseId">
     </core-course-module-info>
 
-    <core-course-module-description [description]="description" [component]="component" [componentId]="componentId"
-        contextLevel="module" [contextInstanceId]="module.id" [courseId]="courseId">
-    </core-course-module-description>
-
     <!-- Warning message. -->
     <ion-card class="core-info-card" *ngIf="scorm && scorm.warningMessage">
         <ion-item>
@@ -134,8 +130,8 @@
             <ion-list>
                 <ion-item class="ion-text-wrap" *ngIf="organizations.length > 1">
                     <ion-label>{{ 'addon.mod_scorm.organizations' | translate }}</ion-label>
-                    <ion-select [(ngModel)]="currentOrganization.identifier" (ionChange)="loadOrganization()"
-                        interface="action-sheet" [interfaceOptions]="{header: 'addon.mod_scorm.organizations' | translate}">
+                    <ion-select [(ngModel)]="currentOrganization.identifier" (ionChange)="loadOrganization()" interface="action-sheet"
+                        [interfaceOptions]="{header: 'addon.mod_scorm.organizations' | translate}">
                         <ion-select-option *ngFor="let org of organizations" [value]="org.identifier">
                             {{ org.title }}
                         </ion-select-option>
@@ -155,8 +151,7 @@
                         <p>{{ currentOrganization.title }}</p>
                         <div *ngFor="let sco of toc" class="core-padding-{{sco.level}} addon-mod_scorm-type-{{sco.scormtype}}">
                             <p *ngIf="sco.isvisible">
-                                <ion-icon *ngIf="sco.icon" [name]="sco.icon.icon" [attr.aria-label]="sco.icon.description"
-                                    slot="start">
+                                <ion-icon *ngIf="sco.icon" [name]="sco.icon.icon" [attr.aria-label]="sco.icon.description" slot="start">
                                 </ion-icon>
                                 <button class="as-link" *ngIf="sco.prereq && sco.launch" (click)="open($event, false, sco.id)">
                                     <core-format-text [text]="sco.title" contextLevel="module" [contextInstanceId]="module.id"
@@ -205,8 +200,7 @@
             <ion-list>
                 <ng-container *ngIf="!downloading && !skip">
                     <!-- Create new attempt -->
-                    <ion-item class="ion-text-wrap"
-                        *ngIf="!scorm.forcenewattempt && numAttempts > 0 && !incomplete && attemptsLeft > 0">
+                    <ion-item class="ion-text-wrap" *ngIf="!scorm.forcenewattempt && numAttempts > 0 && !incomplete && attemptsLeft > 0">
                         <ion-label>{{ 'addon.mod_scorm.newattempt' | translate }}</ion-label>
                         <ion-checkbox slot="end" name="newAttempt" [(ngModel)]="startNewAttempt">
                         </ion-checkbox>
diff --git a/src/addons/mod/survey/components/index/addon-mod-survey-index.html b/src/addons/mod/survey/components/index/addon-mod-survey-index.html
index 5bf012e3e..16ebaa871 100644
--- a/src/addons/mod/survey/components/index/addon-mod-survey-index.html
+++ b/src/addons/mod/survey/components/index/addon-mod-survey-index.html
@@ -1,21 +1,21 @@
 <!-- Buttons to add to the header. -->
 <core-navbar-buttons slot="end">
     <core-context-menu>
-        <core-context-menu-item *ngIf="externalUrl" [priority]="900" [content]="'core.openinbrowser' | translate"
-            [href]="externalUrl" iconAction="fas-external-link-alt" [showBrowserWarning]="false">
+        <core-context-menu-item *ngIf="externalUrl" [priority]="900" [content]="'core.openinbrowser' | translate" [href]="externalUrl"
+            iconAction="fas-external-link-alt" [showBrowserWarning]="false">
         </core-context-menu-item>
         <core-context-menu-item *ngIf="description" [priority]="800" [content]="'core.moduleintro' | translate"
             (action)="expandDescription()" iconAction="fas-arrow-right">
         </core-context-menu-item>
-        <core-context-menu-item *ngIf="blog" [priority]="750" content="{{'addon.blog.blog' | translate}}"
-            iconAction="far-newspaper" (action)="gotoBlog()">
+        <core-context-menu-item *ngIf="blog" [priority]="750" content="{{'addon.blog.blog' | translate}}" iconAction="far-newspaper"
+            (action)="gotoBlog()">
         </core-context-menu-item>
         <core-context-menu-item *ngIf="loaded && !hasOffline && isOnline" [priority]="700" [content]="'core.refresh' | translate"
             (action)="doRefresh(null, $event)" [iconAction]="refreshIcon" [closeOnClick]="false">
         </core-context-menu-item>
         <core-context-menu-item *ngIf="loaded && hasOffline && isOnline" [priority]="600"
-            [content]="'core.settings.synchronizenow' | translate" (action)="doRefresh(null, $event, true)"
-            [iconAction]="syncIcon" [closeOnClick]="false">
+            [content]="'core.settings.synchronizenow' | translate" (action)="doRefresh(null, $event, true)" [iconAction]="syncIcon"
+            [closeOnClick]="false">
         </core-context-menu-item>
         <core-context-menu-item *ngIf="prefetchStatusIcon" [priority]="500" [content]="prefetchText" (action)="prefetch($event)"
             [iconAction]="prefetchStatusIcon" [closeOnClick]="false">
@@ -30,15 +30,11 @@
 <core-loading [hideUntil]="loaded" class="safe-area-padding">
 
     <!-- Activity info. -->
-    <core-course-module-info *ngIf="showCompletion" [module]="module" [showManualCompletion]="true"
-        (completionChanged)="onCompletionChange()">
+    <core-course-module-info [module]="module" (completionChanged)="onCompletionChange()"
+        [description]="survey && !survey.surveydone && !hasOffline && description" [component]="component"
+        [componentId]="componentId" [courseId]="courseId">
     </core-course-module-info>
 
-    <core-course-module-description *ngIf="survey && !survey.surveydone && !hasOffline" [description]="description"
-        [component]="component" [componentId]="componentId" contextLevel="module" [contextInstanceId]="module.id"
-        [courseId]="courseId">
-    </core-course-module-description>
-
     <!-- Survey already done -->
     <ion-card class="ion-padding" *ngIf="survey && survey.surveydone">
         <p class="ion-padding">{{ 'addon.mod_survey.surveycompletednograph' | translate }}</p>
@@ -63,7 +59,7 @@
             <ng-container *ngFor="let question of questions; let questionIndex=index; let isEven=even;"
                 class="ion-no-padding ion-text-wrap">
                 <!-- Parent question (Category header) -->
-                <ng-container *ngIf="question.multiArray?.length" >
+                <ng-container *ngIf="question.multiArray?.length">
                     <h3 class="ion-padding-horizontal" [class.ion-padding-top]="questionIndex == 1">{{ question.text }}</h3>
                     <ion-row class="ion-align-items-center ion-hide-md-down ion-padding">
                         <ion-col size="7" class="ion-padding">{{ 'addon.mod_survey.responses' | translate }}</ion-col>
@@ -73,15 +69,16 @@
                         </ion-col>
                     </ion-row>
                     <ion-item class="ion-text-wrap addon-mod_survey-question" [class.even]="isEven" lines="full">
-                        <ion-label><p>{{ question.intro }}</p></ion-label>
+                        <ion-label>
+                            <p>{{ question.intro }}</p>
+                        </ion-label>
                     </ion-item>
                 </ng-container>
 
                 <!-- Subquestion -->
                 <ng-container *ngIf="question.parent !== 0">
                     <ion-radio-group [(ngModel)]="answers[question.name]" [required]="question.required" [name]="question.name">
-                        <ion-row *ngIf="question.parent !== 0" class="ion-align-items-center ion-padding-horizontal"
-                            [class.even]="isEven">
+                        <ion-row *ngIf="question.parent !== 0" class="ion-align-items-center ion-padding-horizontal" [class.even]="isEven">
 
                             <ion-col size="7">
                                 <ion-label id="addon-mod_survey-{{question.id}}">
@@ -93,19 +90,17 @@
 
                             <!-- Tablet view: radio buttons -->
                             <ion-col class="ion-hide-md-down ion-text-center" size="1"
-                                *ngFor="let option of question.optionsArray; let value=index;"
-                                >
+                                *ngFor="let option of question.optionsArray; let value=index;">
                                 <!-- Empty slot to avoid errors on migration tslint checks -->
                                 <ion-radio [value]="value + 1" [attr.aria-label]="question.num + '. '+question.text + ': ' + option">
                                 </ion-radio>
                             </ion-col>
                             <ion-col class="ion-hide-md-up" size="5">
                                 <ion-select class="ion-padding" [(ngModel)]="answers[question.name]" [required]="question.required"
-                                    [attr.aria-labelledby]="'addon-mod_survey-'+question.id" interface="action-sheet"
-                                    [name]="question.name" [interfaceOptions]="{header: question.text}">
+                                    [attr.aria-labelledby]="'addon-mod_survey-'+question.id" interface="action-sheet" [name]="question.name"
+                                    [interfaceOptions]="{header: question.text}">
                                     <ion-select-option value="-1" selected disabled>{{ 'core.choose' | translate }}</ion-select-option>
-                                    <ion-select-option *ngFor="let option of question.optionsArray; let value=index;"
-                                        [value]="value +1">
+                                    <ion-select-option *ngFor="let option of question.optionsArray; let value=index;" [value]="value +1">
                                         {{option}}
                                     </ion-select-option>
                                 </ion-select>
@@ -126,8 +121,8 @@
                         </ion-col>
                         <ion-col size="5">
                             <ion-select class="ion-padding" [(ngModel)]="answers[question.name]" [required]="question.required"
-                                [attr.aria-labelledby]="'addon-mod_survey-'+question.id" interface="action-sheet"
-                                [name]="question.name" [interfaceOptions]="{header: question.text}">
+                                [attr.aria-labelledby]="'addon-mod_survey-'+question.id" interface="action-sheet" [name]="question.name"
+                                [interfaceOptions]="{header: question.text}">
                                 <ion-select-option *ngFor="let option of question.optionsArray; let value=index;" [value]="value">
                                     {{option}}
                                 </ion-select-option>
diff --git a/src/addons/mod/url/components/index/addon-mod-url-index.html b/src/addons/mod/url/components/index/addon-mod-url-index.html
index 722bdfafd..491e186eb 100644
--- a/src/addons/mod/url/components/index/addon-mod-url-index.html
+++ b/src/addons/mod/url/components/index/addon-mod-url-index.html
@@ -1,12 +1,12 @@
 <!-- Buttons to add to the header. -->
 <core-navbar-buttons slot="end">
     <core-context-menu>
-        <core-context-menu-item *ngIf="externalUrl" [priority]="900" [content]="'core.openinbrowser' | translate"
-            [href]="externalUrl" iconAction="fas-external-link-alt" [showBrowserWarning]="false"></core-context-menu-item>
+        <core-context-menu-item *ngIf="externalUrl" [priority]="900" [content]="'core.openinbrowser' | translate" [href]="externalUrl"
+            iconAction="fas-external-link-alt" [showBrowserWarning]="false"></core-context-menu-item>
         <core-context-menu-item *ngIf="description" [priority]="800" [content]="'core.moduleintro' | translate"
             (action)="expandDescription()" iconAction="fas-arrow-right"></core-context-menu-item>
-        <core-context-menu-item *ngIf="blog" [priority]="750" content="{{'addon.blog.blog' | translate}}"
-            iconAction="far-newspaper" (action)="gotoBlog()"></core-context-menu-item>
+        <core-context-menu-item *ngIf="blog" [priority]="750" content="{{'addon.blog.blog' | translate}}" iconAction="far-newspaper"
+            (action)="gotoBlog()"></core-context-menu-item>
         <core-context-menu-item [priority]="700" [content]="'core.refresh' | translate" (action)="doRefresh(null, $event)"
             [iconAction]="refreshIcon" [closeOnClick]="false"></core-context-menu-item>
     </core-context-menu>
@@ -16,14 +16,10 @@
 <core-loading [hideUntil]="loaded" class="core-loading-fullheight">
 
     <!-- Activity info. -->
-    <core-course-module-info *ngIf="showCompletion" [module]="module" [showManualCompletion]="true"
-        (completionChanged)="onCompletionChange()">
+    <core-course-module-info [module]="module" (completionChanged)="onCompletionChange()" [description]="displayDescription && description"
+        [component]="component" [componentId]="componentId" [courseId]="courseId">
     </core-course-module-info>
 
-    <core-course-module-description *ngIf="displayDescription" [description]="description" [component]="component"
-        [componentId]="componentId" contextLevel="module" [contextInstanceId]="module.id" [courseId]="courseId">
-    </core-course-module-description>
-
     <div *ngIf="shouldIframe || (shouldEmbed && isOther)" class="addon-mod_url-embedded-url">
         <core-iframe [src]="url"></core-iframe>
     </div>
diff --git a/src/addons/mod/wiki/components/index/addon-mod-wiki-index.html b/src/addons/mod/wiki/components/index/addon-mod-wiki-index.html
index 07a1a2638..5eecab5a1 100644
--- a/src/addons/mod/wiki/components/index/addon-mod-wiki-index.html
+++ b/src/addons/mod/wiki/components/index/addon-mod-wiki-index.html
@@ -1,8 +1,8 @@
 <!-- Buttons to add to the header. -->
 <core-navbar-buttons slot="end">
     <!-- Select subwiki. -->
-    <ion-button *ngIf="subwikiData.count > 1" (click)="showSubwikiPicker($event)"
-        [attr.aria-label]="'addon.mod_wiki.subwiki' | translate" aria-haspopup="true">
+    <ion-button *ngIf="subwikiData.count > 1" (click)="showSubwikiPicker($event)" [attr.aria-label]="'addon.mod_wiki.subwiki' | translate"
+        aria-haspopup="true">
         <ion-icon *ngIf="!groupWiki" name="fas-user" aria-hidden="true"></ion-icon>
         <ion-icon *ngIf="groupWiki" name="fas-users" aria-hidden="true"></ion-icon>
     </ion-button>
@@ -13,18 +13,17 @@
     </ion-button>
 
     <core-context-menu>
-        <core-context-menu-item *ngIf="externalUrl" [priority]="900" [content]="'core.openinbrowser' | translate"
-            [href]="externalUrl" iconAction="fas-external-link-alt" [showBrowserWarning]="false">
+        <core-context-menu-item *ngIf="externalUrl" [priority]="900" [content]="'core.openinbrowser' | translate" [href]="externalUrl"
+            iconAction="fas-external-link-alt" [showBrowserWarning]="false">
         </core-context-menu-item>
         <core-context-menu-item *ngIf="description" [priority]="800" [content]="'core.moduleintro' | translate"
             (action)="expandDescription()" iconAction="fas-arrow-right">
         </core-context-menu-item>
-        <core-context-menu-item *ngIf="blog" [priority]="750" content="{{'addon.blog.blog' | translate}}"
-            iconAction="far-newspaper" (action)="gotoBlog()">
+        <core-context-menu-item *ngIf="blog" [priority]="750" content="{{'addon.blog.blog' | translate}}" iconAction="far-newspaper"
+            (action)="gotoBlog()">
         </core-context-menu-item>
         <core-context-menu-item *ngIf="loaded && !hasOffline && isOnline && !pageIsOffline" [priority]="700"
-            [content]="'core.refresh' | translate" (action)="doRefresh(null, $event)" [iconAction]="refreshIcon"
-            [closeOnClick]="false">
+            [content]="'core.refresh' | translate" (action)="doRefresh(null, $event)" [iconAction]="refreshIcon" [closeOnClick]="false">
         </core-context-menu-item>
         <core-context-menu-item *ngIf="loaded && isOnline && (hasOffline || pageIsOffline)" [priority]="600"
             [content]="'core.settings.synchronizenow' | translate" (action)="doRefresh(null, $event, true)" [iconAction]="syncIcon"
@@ -33,8 +32,8 @@
         <core-context-menu-item *ngIf="canEdit && (isOnline || pageIsOffline)" [priority]="590" [content]="'core.edit' | translate"
             iconAction="fas-edit" (action)="goToEditPage()">
         </core-context-menu-item>
-        <core-context-menu-item *ngIf="canEdit" [priority]="580" [content]="'addon.mod_wiki.createpage' | translate"
-            iconAction="fas-plus" (action)="goToNewPage()">
+        <core-context-menu-item *ngIf="canEdit" [priority]="580" [content]="'addon.mod_wiki.createpage' | translate" iconAction="fas-plus"
+            (action)="goToNewPage()">
         </core-context-menu-item>
         <core-context-menu-item *ngIf="prefetchStatusIcon" [priority]="500" [content]="prefetchText" (action)="prefetch($event)"
             [iconAction]="prefetchStatusIcon" [closeOnClick]="false">
@@ -49,15 +48,12 @@
 <core-loading [hideUntil]="loaded">
 
     <!-- Activity info. -->
-    <core-course-module-info *ngIf="showCompletion" [module]="module" [showManualCompletion]="true"
-        (completionChanged)="onCompletionChange()">
+    <core-course-module-info [module]="module" (completionChanged)="onCompletionChange()" [description]="description"
+        [component]="component" [componentId]="componentId" [courseId]="courseId">
+        <h3 *ngIf="pageTitle" title>{{pageTitle}}</h3>
     </core-course-module-info>
 
-    <div *ngIf="description || pageIsOffline || hasOffline || pageWarning">
-        <core-course-module-description [description]="description" [component]="component" [componentId]="componentId"
-            contextLevel="module" [contextInstanceId]="module.id" [courseId]="courseId">
-        </core-course-module-description>
-
+    <div *ngIf="pageIsOffline || hasOffline || pageWarning">
         <!-- Wiki has something offline. -->
         <ion-card class="core-warning-card" *ngIf="pageIsOffline || hasOffline">
             <ion-item>
@@ -82,8 +78,7 @@
             <core-format-text *ngIf="pageContent" [component]="component" [componentId]="componentId" [text]="pageContent"
                 contextLevel="module" [contextInstanceId]="module.id" [courseId]="courseId">
             </core-format-text>
-            <core-empty-box *ngIf="!pageContent" icon="fas-file-alt" [message]="'addon.mod_wiki.nocontent' | translate"
-                inline="true">
+            <core-empty-box *ngIf="!pageContent" icon="fas-file-alt" [message]="'addon.mod_wiki.nocontent' | translate" inline="true">
             </core-empty-box>
         </article>
 
diff --git a/src/addons/mod/wiki/pages/index/index.ts b/src/addons/mod/wiki/pages/index/index.ts
index 3b6058055..e98a10c9f 100644
--- a/src/addons/mod/wiki/pages/index/index.ts
+++ b/src/addons/mod/wiki/pages/index/index.ts
@@ -52,9 +52,7 @@ export class AddonModWikiIndexPage extends CoreCourseModuleMainActivityPage<Addo
     }
 
     /**
-     * Update some data based on the data received.
-     *
-     * @param data The data received.
+     * @inheritdoc
      */
     updateData(data: { name: string } | string): void {
         if (typeof data == 'string') {
diff --git a/src/addons/mod/workshop/components/index/addon-mod-workshop-index.html b/src/addons/mod/workshop/components/index/addon-mod-workshop-index.html
index d06955e61..35f7cac49 100644
--- a/src/addons/mod/workshop/components/index/addon-mod-workshop-index.html
+++ b/src/addons/mod/workshop/components/index/addon-mod-workshop-index.html
@@ -1,14 +1,14 @@
 <!-- Buttons to add to the header. -->
 <core-navbar-buttons slot="end">
     <core-context-menu>
-        <core-context-menu-item *ngIf="externalUrl" [priority]="900" [content]="'core.openinbrowser' | translate"
-            [href]="externalUrl" iconAction="fas-external-link-alt" [showBrowserWarning]="false">
+        <core-context-menu-item *ngIf="externalUrl" [priority]="900" [content]="'core.openinbrowser' | translate" [href]="externalUrl"
+            iconAction="fas-external-link-alt" [showBrowserWarning]="false">
         </core-context-menu-item>
         <core-context-menu-item *ngIf="description" [priority]="800" [content]="'core.moduleintro' | translate"
             (action)="expandDescription()" iconAction="fas-arrow-right">
         </core-context-menu-item>
-        <core-context-menu-item *ngIf="blog" [priority]="750" content="{{'addon.blog.blog' | translate}}"
-            iconAction="far-newspaper" (action)="gotoBlog()">
+        <core-context-menu-item *ngIf="blog" [priority]="750" content="{{'addon.blog.blog' | translate}}" iconAction="far-newspaper"
+            (action)="gotoBlog()">
         </core-context-menu-item>
         <core-context-menu-item *ngIf="loaded && !hasOffline && isOnline" [priority]="700" [content]="'core.refresh' | translate"
             (action)="doRefresh(null, $event)" [iconAction]="refreshIcon" [closeOnClick]="false">
@@ -22,15 +22,15 @@
         </core-context-menu-item>
         <core-context-menu-item *ngIf="size" [priority]="200" [content]="'core.clearstoreddata' | translate:{$a: size}"
             iconDescription="fas-archive" (action)="removeFiles($event)" iconAction="fas-trash" [closeOnClick]="false">
-        </core-context-menu-item>    </core-context-menu>
+        </core-context-menu-item>
+    </core-context-menu>
 </core-navbar-buttons>
 
 <!-- Content. -->
 <core-loading [hideUntil]="loaded">
 
     <!-- Activity info. -->
-    <core-course-module-info *ngIf="showCompletion" [module]="module" [showManualCompletion]="true"
-        (completionChanged)="onCompletionChange()">
+    <core-course-module-info [module]="module" (completionChanged)="onCompletionChange()">
     </core-course-module-info>
 
     <ion-card *ngIf="phases">
@@ -87,9 +87,8 @@
                 <ion-item class="ion-text-wrap">
                     <ion-label>
                         <h2>{{ 'addon.mod_workshop.conclusion' | translate }}</h2>
-                        <core-format-text fullOnClick="true" [component]="component" [componentId]="module.id"
-                            [text]="workshop!.conclusion" contextLevel="module" [contextInstanceId]="module.id"
-                            [courseId]="courseId">
+                        <core-format-text fullOnClick="true" [component]="component" [componentId]="module.id" [text]="workshop!.conclusion"
+                            contextLevel="module" [contextInstanceId]="module.id" [courseId]="courseId">
                         </core-format-text>
                     </ion-label>
                 </ion-item>
@@ -97,7 +96,9 @@
 
             <ion-card *ngIf="userGrades">
                 <ion-item-divider class="ion-text-wrap">
-                    <ion-label><h2>{{ 'addon.mod_workshop.yourgrades' | translate }}</h2></ion-label>
+                    <ion-label>
+                        <h2>{{ 'addon.mod_workshop.yourgrades' | translate }}</h2>
+                    </ion-label>
                 </ion-item-divider>
                 <ion-item class="ion-text-wrap" *ngIf="userGrades.submissionlongstrgrade">
                     <ion-label>
@@ -120,8 +121,7 @@
                 <ion-label>
                     <h2>{{ 'addon.mod_workshop.areainstructauthors' | translate }}</h2>
                     <core-format-text fullOnClick="true" [component]="component" [componentId]="module.id"
-                        [text]="workshop!.instructauthors" contextLevel="module" [contextInstanceId]="module.id"
-                        [courseId]="courseId">
+                        [text]="workshop!.instructauthors" contextLevel="module" [contextInstanceId]="module.id" [courseId]="courseId">
                     </core-format-text>
                 </ion-label>
             </ion-item>
@@ -166,7 +166,9 @@
         <ng-container *ngIf="workshop!.phase >= PHASE_CLOSED">
             <ion-card *ngIf="publishedSubmissions && publishedSubmissions.length">
                 <ion-item-divider class="ion-text-wrap">
-                    <ion-label><h2>{{ 'addon.mod_workshop.publishedsubmissions' | translate }}</h2></ion-label>
+                    <ion-label>
+                        <h2>{{ 'addon.mod_workshop.publishedsubmissions' | translate }}</h2>
+                    </ion-label>
                 </ion-item-divider>
                 <ng-container *ngFor="let submission of publishedSubmissions">
                     <addon-mod-workshop-submission [submission]="submission" [courseId]="workshop!.course" [module]="module"
@@ -192,10 +194,14 @@
 
             <ion-card *ngIf="canAssess">
                 <ion-item-divider class="ion-text-wrap">
-                    <ion-label><h2>{{ 'addon.mod_workshop.assignedassessments' | translate }}</h2></ion-label>
+                    <ion-label>
+                        <h2>{{ 'addon.mod_workshop.assignedassessments' | translate }}</h2>
+                    </ion-label>
                 </ion-item-divider>
                 <ion-item class="ion-text-wrap" *ngIf="!assessments || !assessments.length">
-                    <ion-label><p>{{ 'addon.mod_workshop.assignedassessmentsnone' | translate }}</p></ion-label>
+                    <ion-label>
+                        <p>{{ 'addon.mod_workshop.assignedassessmentsnone' | translate }}</p>
+                    </ion-label>
                 </ion-item>
                 <ng-container *ngFor="let assessment of (assessments || [])">
                     <addon-mod-workshop-submission [submission]="assessment.submission" [assessment]="assessment"
@@ -203,7 +209,7 @@
                         class="core-as-item">
                     </addon-mod-workshop-submission>
                 </ng-container>
-            </ion-card >
+            </ion-card>
         </ng-container>
 
         <!-- MULTIPLE PHASES SUBMISSION OR GREATER only teachers -->
diff --git a/src/core/features/course/classes/main-resource-component.ts b/src/core/features/course/classes/main-resource-component.ts
index e01d48d86..722907a73 100644
--- a/src/core/features/course/classes/main-resource-component.ts
+++ b/src/core/features/course/classes/main-resource-component.ts
@@ -70,7 +70,6 @@ export class CoreCourseModuleMainResourceComponent implements OnInit, OnDestroy,
     isDestroyed = false; // Whether the component is destroyed, used when calling fillContextMenu.
     contextMenuStatusObserver?: CoreEventObserver; // Observer of package status, used when calling fillContextMenu.
     contextFileStatusObserver?: CoreEventObserver; // Observer of file status, used when calling fillContextMenu.
-    showCompletion = false; // Whether to show completion inside the activity.
 
     protected fetchContentDefaultError = 'core.course.errorgetmodule'; // Default error to show when loading contents.
     protected isCurrentView = false; // Whether the component is in the current view.
@@ -80,6 +79,7 @@ export class CoreCourseModuleMainResourceComponent implements OnInit, OnDestroy,
     protected completionObserver?: CoreEventObserver;
     protected logger: CoreLogger;
     protected debouncedUpdateModule?: () => void; // Update the module after a certain time.
+    protected showCompletion = false; // Whether to show completion inside the activity.
 
     constructor(
         @Optional() @Inject('') loggerName: string = 'CoreCourseModuleMainResourceComponent',
@@ -97,7 +97,7 @@ export class CoreCourseModuleMainResourceComponent implements OnInit, OnDestroy,
         this.componentId = this.module.id;
         this.externalUrl = this.module.url;
         this.courseId = this.courseId || this.module.course!;
-        this.showCompletion = !!CoreSites.getCurrentSite()?.isVersionGreaterEqualThan('3.11');
+        this.showCompletion = !!CoreSites.getRequiredCurrentSite().isVersionGreaterEqualThan('3.11');
 
         if (this.showCompletion) {
             CoreCourseHelper.calculateModuleCompletionData(this.module, this.courseId);
diff --git a/src/core/features/course/components/module-description/module-description.ts b/src/core/features/course/components/module-description/module-description.ts
index d5fcf1139..6fc2ed236 100644
--- a/src/core/features/course/components/module-description/module-description.ts
+++ b/src/core/features/course/components/module-description/module-description.ts
@@ -28,7 +28,9 @@ import { Component, Input } from '@angular/core';
  *
  * Example usage:
  *
- * <core-course-module-description [description]="myDescription"></core-course-module-description
+ * <core-course-module-description [description]="myDescription"></core-course-module-description>
+ *
+ * @deprecated since 4.0 use core-course-module-info
  */
 @Component({
     selector: 'core-course-module-description',
diff --git a/src/core/features/course/components/module-info/core-course-module-info.html b/src/core/features/course/components/module-info/core-course-module-info.html
index d69b3148a..acd0b90e5 100644
--- a/src/core/features/course/components/module-info/core-course-module-info.html
+++ b/src/core/features/course/components/module-info/core-course-module-info.html
@@ -1,18 +1,37 @@
-<ion-card *ngIf="module.dates?.length || (module.completiondata && (module.completiondata.isautomatic || showManualCompletion))">
-    <ion-item class="ion-text-wrap">
-        <ion-label>
-            <!-- Activity dates. -->
-            <div *ngIf="module.dates && module.dates.length" class="core-module-dates">
-                <p *ngFor="let date of module.dates">
-                    <strong>{{ date.label }}</strong> {{ date.timestamp * 1000 | coreFormatDate:'strftimedatetime' }}
-                </p>
-            </div>
+<ion-item class="ion-text-wrap" lines="none">
+    <core-mod-icon slot="start" [modicon]="modicon" [modname]="module.modname" [componentId]="module.instance">
+    </core-mod-icon>
+    <ion-label>
+        <h2>
+            <core-format-text [text]="module.name" contextLevel="module" [component]="component" [componentId]="componentId"
+                [contextInstanceId]="module.id" [courseId]="courseId">
+            </core-format-text>
+        </h2>
+        <ng-content select="[title]"></ng-content>
+    </ion-label>
+</ion-item>
+<ion-item class="ion-text-wrap" *ngIf="description" lines="none">
+    <ion-label>
+        <core-format-text [text]="description" [component]="component" [componentId]="componentId" contextLevel="module"
+            [contextInstanceId]="module.id" [courseId]="courseId" maxHeight="120">
+        </core-format-text>
+    </ion-label>
+</ion-item>
+<ng-content select="[description]"></ng-content>
+<ion-item class="ion-text-wrap" lines="none" *ngIf="showCompletion && (module.dates?.length || module.completiondata)">
+    <ion-label>
+        <!-- Activity dates. -->
+        <div *ngIf="module.dates && module.dates.length" class="core-module-dates">
+            <p *ngFor="let date of module.dates">
+                <strong>{{ date.label }}</strong> {{ date.timestamp * 1000 | coreFormatDate:'strftimedatetime' }}
+            </p>
+        </div>
 
-            <!-- Module completion. -->
-            <core-course-module-completion *ngIf="module.completiondata" [completion]="module.completiondata"
-                [moduleName]="module.name" [moduleId]="module.id" [showCompletionConditions]="true"
-                [showManualCompletion]="showManualCompletion" (completionChanged)="completionChanged.emit($event)">
-            </core-course-module-completion>
-        </ion-label>
-    </ion-item>
-</ion-card>
+        <!-- Module completion. -->
+        <core-course-module-completion *ngIf="module.completiondata" [completion]="module.completiondata" [moduleName]="module.name"
+            [moduleId]="module.id" [showCompletionConditions]="true" [showManualCompletion]="true"
+            (completionChanged)="completionChanged.emit($event)">
+        </core-course-module-completion>
+    </ion-label>
+</ion-item>
+<ng-content></ng-content>
diff --git a/src/core/features/course/components/module-info/course-module-info.scss b/src/core/features/course/components/module-info/course-module-info.scss
index ddf0beb55..a4d1bf7e1 100644
--- a/src/core/features/course/components/module-info/course-module-info.scss
+++ b/src/core/features/course/components/module-info/course-module-info.scss
@@ -2,5 +2,9 @@
 
 :host {
     display: block;
+    box-shadow: 0px 3px 3px rgba(var(--drop-shadow));
+    margin-bottom: 8px;
+    background-color: var(--contrast-background);
+    
     @include padding-horizontal(var(--ion-safe-area-left), var(--ion-safe-area-right));
-}
\ No newline at end of file
+}
diff --git a/src/core/features/course/components/module-info/module-info.ts b/src/core/features/course/components/module-info/module-info.ts
index 254ad3c7c..13cbd4e40 100644
--- a/src/core/features/course/components/module-info/module-info.ts
+++ b/src/core/features/course/components/module-info/module-info.ts
@@ -12,21 +12,48 @@
 // See the License for the specific language governing permissions and
 // limitations under the License.
 
-import { Component, EventEmitter, Input, Output } from '@angular/core';
+import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
 import { CoreCourseModule, CoreCourseModuleCompletionData } from '@features/course/services/course-helper';
+import { CoreCourseModuleDelegate } from '@features/course/services/module-delegate';
+import { CoreSites } from '@services/sites';
 
 /**
- * Display info about a module: dates and completion.
+ * Display info about a module:
+ *
+ * Description:
+ * Module descriptions are shortened by default, allowing the user to see the full description by clicking in it.
+ *
+ * Completion dates, status and buttons.
+ *
+ * You can add also add custom information that will be included at the end.
  */
 @Component({
     selector: 'core-course-module-info',
     templateUrl: 'core-course-module-info.html',
     styleUrls: ['course-module-info.scss'],
 })
-export class CoreCourseModuleInfoComponent {
+export class CoreCourseModuleInfoComponent implements OnInit {
 
     @Input() module!: CoreCourseModule; // The module to render.
-    @Input() showManualCompletion = false; // Whether to show manual completion.
+    @Input() courseId!: number; // The courseId the module belongs to.
+
+    @Input() component!: string; // Component for format text directive.
+    @Input() componentId!: string | number; // Component ID to use in conjunction with the component.
+
+    @Input() description?: string | false; // The description to display. If false, no description will be shown.
+
     @Output() completionChanged = new EventEmitter<CoreCourseModuleCompletionData>(); // Notify when completion changes.
 
+    modicon = '';
+    showCompletion = false; // Whether to show completion.
+
+    /**
+     * @inheritdoc
+     */
+    async ngOnInit(): Promise<void> {
+        this.modicon = await CoreCourseModuleDelegate.getModuleIconSrc(this.module.modname, this.module.modicon, this.module);
+
+        this.showCompletion = CoreSites.getRequiredCurrentSite().isVersionGreaterEqualThan('3.11');
+    }
+
 }
diff --git a/src/core/features/course/components/unsupported-module/core-course-unsupported-module.html b/src/core/features/course/components/unsupported-module/core-course-unsupported-module.html
index 10fb79074..4e27e6c44 100644
--- a/src/core/features/course/components/unsupported-module/core-course-unsupported-module.html
+++ b/src/core/features/course/components/unsupported-module/core-course-unsupported-module.html
@@ -1,7 +1,6 @@
 <div class="ion-padding">
-    <core-course-module-description [description]="module?.description" contextLevel="module"
-        [contextInstanceId]="module?.id" [courseId]="courseId">
-    </core-course-module-description>
+    <core-course-module-info [description]="module?.description" [courseId]="courseId" [module]="module">
+    </core-course-module-info>
 
     <h2 *ngIf="!isDisabledInSite && isSupportedByTheApp">{{ 'core.whoops' | translate }}</h2>
     <h2 *ngIf="isDisabledInSite || !isSupportedByTheApp">{{ 'core.uhoh' | translate }}</h2>