Merge pull request #3113 from crazyserver/MOBILE-3814

Mobile 3814

scripts/langindex.json

@@ -1104,14 +1104,19 @@
   "addon.report_insights.notapplicable": "analytics",
   "addon.report_insights.notuseful": "analytics",
   "addon.report_insights.useful": "analytics",
+  "addon.storagemanager.alldata": "tool_wp",
+  "addon.storagemanager.confirmdeleteallsitedata": "local_moodlemobileapp",
+  "addon.storagemanager.confirmdeletecourses": "local_moodlemobileapp",
+  "addon.storagemanager.confirmdeletedatafrom": "local_moodlemobileapp",
   "addon.storagemanager.coursedownloads": "local_moodlemobileapp",
   "addon.storagemanager.courseinfo": "local_moodlemobileapp",
-  "addon.storagemanager.coursesspaceusage": "local_moodlemobileapp",
+  "addon.storagemanager.deleteallsitedata": "local_moodlemobileapp",
-  "addon.storagemanager.deletecourse": "local_moodlemobileapp",
+  "addon.storagemanager.deleteallsitedatainfo": "local_moodlemobileapp",
   "addon.storagemanager.deletecourses": "local_moodlemobileapp",
   "addon.storagemanager.deletedata": "local_moodlemobileapp",
   "addon.storagemanager.deletedatafrom": "local_moodlemobileapp",
   "addon.storagemanager.downloadedcourses": "local_moodlemobileapp",
+  "addon.storagemanager.errordeletedownloadeddata": "local_moodlemobileapp",
   "addon.storagemanager.managedownloads": "local_moodlemobileapp",
   "addon.storagemanager.totaldownloads": "local_moodlemobileapp",
   "addon.storagemanager.totalspaceusage": "local_moodlemobileapp",
@@ -1531,8 +1536,6 @@
   "core.course.completion_setby:manual:done": "course",
   "core.course.completion_setby:manual:markdone": "course",
   "core.course.completionrequirements": "course",
-  "core.course.confirmdeletemodulefiles": "local_moodlemobileapp",
-  "core.course.confirmdeletestoreddata": "local_moodlemobileapp",
   "core.course.confirmdownload": "local_moodlemobileapp",
   "core.course.confirmdownloadunknownsize": "local_moodlemobileapp",
   "core.course.confirmdownloadzerosize": "local_moodlemobileapp",
@@ -2161,8 +2164,6 @@
   "core.settings.currentlanguage": "moodle",
   "core.settings.debugdisplay": "admin",
   "core.settings.debugdisplaydescription": "local_moodlemobileapp",
-  "core.settings.deletesitefiles": "local_moodlemobileapp",
-  "core.settings.deletesitefilestitle": "local_moodlemobileapp",
   "core.settings.developeroptions": "local_moodlemobileapp",
   "core.settings.deviceinfo": "local_moodlemobileapp",
   "core.settings.deviceos": "local_moodlemobileapp",
@@ -2178,7 +2179,6 @@
   "core.settings.enablerichtexteditordescription": "local_moodlemobileapp",
   "core.settings.enablesyncwifi": "local_moodlemobileapp",
   "core.settings.entriesincache": "local_moodlemobileapp",
-  "core.settings.errordeletesitefiles": "local_moodlemobileapp",
   "core.settings.errorsyncsite": "local_moodlemobileapp",
   "core.settings.estimatedfreespace": "local_moodlemobileapp",
   "core.settings.filesystemroot": "local_moodlemobileapp",
@@ -2215,7 +2215,6 @@
   "core.settings.siteplugins": "local_moodlemobileapp",
   "core.settings.sites": "moodle",
   "core.settings.spaceusage": "local_moodlemobileapp",
-  "core.settings.spaceusagehelp": "local_moodlemobileapp",
   "core.settings.synchronization": "local_moodlemobileapp",
   "core.settings.synchronizenow": "local_moodlemobileapp",
   "core.settings.synchronizenowhelp": "local_moodlemobileapp",
@@ -2339,8 +2338,8 @@
   "core.user.webpage": "moodle",
   "core.userdeleted": "moodle",
   "core.userdetails": "moodle",
-  "core.usernotfullysetup": "error",
   "core.usernologin": "local_moodlemobileapp",
+  "core.usernotfullysetup": "error",
   "core.users": "moodle",
   "core.usersuspended": "tool_reportbuilder",
   "core.view": "moodle",

src/addons/block/activitymodules/components/activitymodules/addon-block-activitymodules.html

@@ -4,7 +4,7 @@
     </ion-label>
 </ion-item-divider>
 <core-loading [hideUntil]="loaded" [fullscreen]="false">
-    <ion-item class="ion-text-wrap item-media" *ngFor="let entry of entries" detail="true" button (click)="gotoCoureListModType(entry)">
+    <ion-item class="ion-text-wrap" *ngFor="let entry of entries" detail="true" button (click)="gotoCoureListModType(entry)">
         <core-mod-icon slot="start" [modicon]="entry.icon" [modname]="entry.modName" [showAlt]="false">
         </core-mod-icon>
         <ion-label>{{ entry.name }}</ion-label>

src/addons/block/recentlyaccesseditems/components/recentlyaccesseditems/addon-block-recentlyaccesseditems.html

@@ -14,8 +14,7 @@
             <div class="safe-area-pseudo-padding-start"></div>
             <div *ngFor="let item of items" class="core-horizontal-scroll-item">
                 <ion-card>
-                    <ion-item class="core-course-module-handler item-media ion-text-wrap" detail="false" (click)="action($event, item)"
+                    <ion-item class="core-course-module-handler ion-text-wrap" detail="false" (click)="action($event, item)" button>
-                        button>
                         <core-mod-icon slot="start" *ngIf="item.iconUrl" [modicon]="item.iconUrl" [modname]="item.modname"
                             [componentId]="item.cmid" [showAlt]="false">
                         </core-mod-icon>

src/addons/competency/pages/coursecompetencies/coursecompetencies.html

@@ -114,8 +114,8 @@
                             <p *ngIf="competency.coursemodules.length == 0">
                                 {{ 'addon.competency.noactivities' | translate }}
                             </p>
-                            <ion-item class="ion-text-wrap core-course-module-handler item-media" [attr.aria-label]="activity.name"
+                            <ion-item class="ion-text-wrap core-course-module-handler" [attr.aria-label]="activity.name" core-link
-                                core-link *ngFor="let activity of competency.coursemodules" [href]="activity.url" capture="true">
+                                *ngFor="let activity of competency.coursemodules" [href]="activity.url" capture="true">
                                 <core-mod-icon slot="start" [modicon]="activity.iconurl" [showAlt]="false" *ngIf="activity.iconurl">
                                 </core-mod-icon>
                                 <ion-label>

src/addons/mod/bigbluebuttonbn/components/index/index.scss

@@ -1,7 +1,3 @@
-@import "~theme/globals";
+ion-item > p[slot="end"] {
-
+    font-size: 14px;
-:host {
-    ion-item > p[slot="end"] {
-        font-size: 14px;
-    }
 }

src/addons/mod/bigbluebuttonbn/services/handlers/module.ts

@@ -45,7 +45,7 @@ export class AddonModBBBModuleHandlerService extends CoreModuleHandlerBase imple
         [CoreConstants.FEATURE_GRADE_OUTCOMES]: true,
         [CoreConstants.FEATURE_BACKUP_MOODLE2]: true,
         [CoreConstants.FEATURE_SHOW_DESCRIPTION]: true,
-        [CoreConstants.FEATURE_MOD_PURPOSE]: ModPurpose.MOD_PURPOSE_COMMUNICATION,
+        [CoreConstants.FEATURE_MOD_PURPOSE]: ModPurpose.MOD_PURPOSE_OTHER,
     };
 
     /**

src/addons/storagemanager/lang.json

@@ -1,13 +1,18 @@
 {
-    "deletedata": "Delete offline data",
+    "alldata": "All data",
-    "deletecourse": "Delete offline data from this course",
+    "confirmdeleteallsitedata": "Delete all site downloaded data?",
-    "deletecourses": "Delete offline data from all courses",
+    "confirmdeletecourses": "Delete downloaded data from all courses?",
-    "deletedatafrom": "Delete offline data from {{name}}",
+    "confirmdeletedatafrom": "Delete all downloaded data from '{{name}}'?",
-    "courseinfo": "Download course content to work offline. Your activity will sync automatically when your device is back online.",
-    "managedownloads": "Manage downloads",
     "coursedownloads": "Course downloads",
+    "courseinfo": "Download course content to work offline. Your activity will sync automatically when your device is back online.",
+    "deleteallsitedata": "Delete all site downloaded data",
+    "deleteallsitedatainfo": "This will delete all downloaded data from '{{name}}', including all downloaded courses and data that allows you to work offline.",
+    "deletecourses": "Delete downloaded data from all courses",
+    "deletedata": "Delete downloaded data",
+    "deletedatafrom": "Delete all downloaded data from '{{name}}'",
+    "downloadedcourses": "Downloaded courses",
+    "errordeletedownloadeddata": "Error deleting downloaded data.",
+    "managedownloads": "Manage downloads",
     "totaldownloads": "Total downloads",
-    "totalspaceusage": "Total space usage",
+    "totalspaceusage": "Total space used"
-    "coursesspaceusage": "Courses space usage",
-    "downloadedcourses": "Downloaded courses"
 }

src/addons/storagemanager/pages/course-storage/course-storage.html

@@ -20,7 +20,8 @@
                         <ion-badge color="light">{{ totalSize | coreBytesToSize }}</ion-badge>
                     </ion-label>
                     <ion-button slot="end" (click)="deleteForCourse()" [disabled]="totalSize == 0" color="danger" fill="outline">
-                        <ion-icon name="fas-trash" slot="icon-only" [attr.aria-label]="'addon.storagemanager.deletecourse' | translate">
+                        <ion-icon name="fas-trash" slot="icon-only" [attr.aria-label]="'addon.storagemanager.deletedatafrom' | translate:
+                        { name: title }">
                         </ion-icon>
                     </ion-button>
                 </ion-item>

src/addons/storagemanager/pages/course-storage/course-storage.ts

@@ -282,7 +282,10 @@ export class AddonStorageManagerCourseStoragePage implements OnInit, OnDestroy {
      */
     async deleteForCourse(): Promise<void> {
         try {
-            await CoreDomUtils.showDeleteConfirm('core.course.confirmdeletestoreddata');
+            await CoreDomUtils.showDeleteConfirm(
+                'addon.storagemanager.confirmdeletedatafrom',
+                { name: this.title },
+            );
         } catch (error) {
             if (!CoreDomUtils.isCanceledError(error)) {
                 throw error;
@@ -312,7 +315,10 @@ export class AddonStorageManagerCourseStoragePage implements OnInit, OnDestroy {
      */
     async deleteForSection(section: AddonStorageManagerCourseSection): Promise<void> {
         try {
-            await CoreDomUtils.showDeleteConfirm('core.course.confirmdeletestoreddata');
+            await CoreDomUtils.showDeleteConfirm(
+                'addon.storagemanager.confirmdeletedatafrom',
+                { name: section.name },
+            );
         } catch (error) {
             if (!CoreDomUtils.isCanceledError(error)) {
                 throw error;
@@ -343,7 +349,10 @@ export class AddonStorageManagerCourseStoragePage implements OnInit, OnDestroy {
         }
 
         try {
-            await CoreDomUtils.showDeleteConfirm('core.course.confirmdeletestoreddata');
+            await CoreDomUtils.showDeleteConfirm(
+                'addon.storagemanager.confirmdeletedatafrom',
+                { name: module.name },
+            );
         } catch (error) {
             if (!CoreDomUtils.isCanceledError(error)) {
                 throw error;
@@ -363,7 +372,7 @@ export class AddonStorageManagerCourseStoragePage implements OnInit, OnDestroy {
      * @return Promise<void> Once deleting has finished
      */
     protected async deleteModules(modules: AddonStorageManagerModule[], section?: AddonStorageManagerCourseSection): Promise<void> {
-        const modal = await CoreDomUtils.showModalLoading();
+        const modal = await CoreDomUtils.showModalLoading('core.deleting', true);
 
         const promises: Promise<void>[] = [];
         modules.forEach((module) => {

src/addons/storagemanager/pages/courses-storage/courses-storage.html

@@ -10,25 +10,30 @@
 </ion-header>
 <ion-content>
     <core-loading [hideUntil]="loaded">
-
+        <div class="ion-padding-horizontal ion-text-wrap" *ngIf="downloadedCourses.length">
+            <h2>{{ 'addon.storagemanager.alldata' | translate }}</h2>
+        </div>
         <ion-card>
-            <ion-item class="ion-text-wrap" *ngIf="spaceUsage">
+            <ion-item class="ion-text-wrap total" *ngIf="spaceUsage">
                 <ion-label>
                     <p class="item-heading ion-text-wrap">{{ 'addon.storagemanager.totalspaceusage' | translate }}</p>
                     <ion-badge color="light" *ngIf="spaceUsage.spaceUsage">{{ spaceUsage.spaceUsage | coreBytesToSize }}</ion-badge>
-                    <p>
-                        {{ 'core.settings.spaceusagehelp' | translate }}
-                    </p>
                 </ion-label>
                 <ion-button fill="clear" color="danger" slot="end" (click)="deleteSiteStorage($event)"
                     [hidden]="spaceUsage.spaceUsage! + spaceUsage.cacheEntries! <= 0"
-                    [attr.aria-label]="'core.settings.deletesitefilestitle' | translate" fill="outline">
+                    [attr.aria-label]="'addon.storagemanager.deleteallsitedata' | translate" fill="outline">
                     <ion-icon name="fas-trash" slot="icon-only" aria-hidden="true"></ion-icon>
                 </ion-button>
             </ion-item>
-            <ion-item class="size ion-text-wrap">
+        </ion-card>
+
+        <div class="ion-padding-horizontal ion-text-wrap" *ngIf="downloadedCourses.length">
+            <h2>{{ 'addon.storagemanager.downloadedcourses' | translate }}</h2>
+        </div>
+        <ion-card>
+            <ion-item class="size courses ion-text-wrap" lines="full">
                 <ion-label>
-                    <h2 class="ion-text-wrap">{{ 'addon.storagemanager.coursesspaceusage' | translate }}</h2>
+                    <p class="item-heading">{{ 'addon.storagemanager.totalspaceusage' | translate }}</p>
                     <ion-badge color="light">{{ totalSize | coreBytesToSize }}</ion-badge>
                 </ion-label>
                 <ion-button slot="end" (click)="deleteCompletelyDownloadedCourses($event)"
@@ -37,33 +42,22 @@
                     </ion-icon>
                 </ion-button>
             </ion-item>
-        </ion-card>
+            <ion-item *ngFor="let course of downloadedCourses" class="course" (click)="openCourse(course.id, course.title)" button>
-
+                <ion-label class="ion-text-wrap">
-        <div class="ion-padding-horizontal ion-text-wrap" *ngIf="downloadedCourses.length">
+                    <p class="item-heading">{{ course.title }}</p>
-            <h2>{{ 'addon.storagemanager.downloadedcourses' | translate }}</h2>
+                    <p class="item-heading item-heading-secondary" *ngIf="course.isDownloading">
-        </div>
+                        {{ 'core.downloading' | translate }}
-        <ion-card *ngIf="downloadedCourses.length">
+                    </p>
-            <ion-card-content class="ion-no-padding">
+                    <ion-badge color="light">
-                <ion-list>
+                        {{ course.totalSize | coreBytesToSize }}
-                    <ion-item *ngFor="let course of downloadedCourses" class="course" (click)="openCourse(course.id, course.title)" button>
+                    </ion-badge>
-                        <ion-label class="ion-text-wrap">
+                </ion-label>
-                            <p class="item-heading">{{ course.title }}</p>
+                <ion-button slot="end" (click)="deleteCourse($event, course)" [disabled]="course.isDownloading" color="danger" fill="clear">
-                            <p class="item-heading item-heading-secondary" *ngIf="course.isDownloading">
+                    <ion-icon name="fas-trash" slot="icon-only" [attr.aria-label]="'addon.storagemanager.deletedatafrom' | translate:
-                                {{ 'core.downloading' | translate }}
+                            { name: course.title }">
-                            </p>
+                    </ion-icon>
-                            <ion-badge color="light">
+                </ion-button>
-                                {{ course.totalSize | coreBytesToSize }}
+            </ion-item>
-                            </ion-badge>
-                        </ion-label>
-                        <ion-button slot="end" (click)="deleteCourse($event, course)" [disabled]="course.isDownloading" color="danger"
-                            fill="clear">
-                            <ion-icon name="fas-trash" slot="icon-only"
-                                [attr.aria-label]="'addon.storagemanager.deletedatafrom' | translate: { name: course.displayname }">
-                            </ion-icon>
-                        </ion-button>
-                    </ion-item>
-                </ion-list>
-            </ion-card-content>
         </ion-card>
     </core-loading>
 </ion-content>

src/addons/storagemanager/pages/courses-storage/courses-storage.scss

@@ -1,10 +1,6 @@
-@import "~theme/globals";
+ion-item.courses,
-
+ion-item.total {
-:host {
+    .item-heading {
-    ion-item.course {
+        font-weight: bold;
-        .item-heading {
-            font-weight: bold;
-        }
     }
-
 }

src/addons/storagemanager/pages/courses-storage/courses-storage.ts

@@ -111,7 +111,7 @@ export class AddonStorageManagerCoursesStoragePage implements OnInit, OnDestroy
         event.stopPropagation();
 
         try {
-            await CoreDomUtils.showDeleteConfirm('core.course.confirmdeletestoreddata');
+            await CoreDomUtils.showDeleteConfirm('addon.storagemanager.confirmdeletecourses');
         } catch (error) {
             if (!CoreDomUtils.isCanceledError(error)) {
                 throw error;
@@ -120,7 +120,7 @@ export class AddonStorageManagerCoursesStoragePage implements OnInit, OnDestroy
             return;
         }
 
-        const modal = await CoreDomUtils.showModalLoading();
+        const modal = await CoreDomUtils.showModalLoading('core.deleting', true);
         const deletedCourseIds = this.completelyDownloadedCourses.map((course) => course.id);
 
         try {
@@ -145,7 +145,10 @@ export class AddonStorageManagerCoursesStoragePage implements OnInit, OnDestroy
         event.stopPropagation();
 
         try {
-            await CoreDomUtils.showDeleteConfirm('core.course.confirmdeletestoreddata');
+            await CoreDomUtils.showDeleteConfirm(
+                'addon.storagemanager.confirmdeletedatafrom',
+                { name: course.title },
+            );
         } catch (error) {
             if (!CoreDomUtils.isCanceledError(error)) {
                 throw error;
@@ -154,7 +157,7 @@ export class AddonStorageManagerCoursesStoragePage implements OnInit, OnDestroy
             return;
         }
 
-        const modal = await CoreDomUtils.showModalLoading();
+        const modal = await CoreDomUtils.showModalLoading('core.deleting', true);
 
         try {
             await CoreCourseHelper.deleteCourseFiles(course.id);

src/assets/img/mod/bigbluebuttonbn.svg

@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" style="fill:none" height="74" width="74"><path style="clip-rule:evenodd;fill:#000;fill-rule:evenodd;stroke-width:4.9333334" d="M69.067 37c0 17.71-14.357 32.067-32.067 32.067S4.933 54.71 4.933 37 19.29 4.933 37 4.933 69.067 19.29 69.067 37zM74 37c0 20.434-16.566 37-37 37C16.565 74 0 57.434 0 37 0 16.565 16.565 0 37 0c20.434 0 37 16.565 37 37Zm-49.333 8.617V19.733c1.836 0 3.405.899 4.704 2.695 1.3 1.797 1.95 3.96 1.95 6.488v16.701c0 1.33.665 1.996 1.995 1.996H43.63c1.33 0 1.996-.665 1.996-1.996v-7.918c0-1.287-.665-1.952-1.996-1.997h-1.996c-2.573-.09-4.747-.76-6.52-2.015-1.775-1.254-2.662-2.8-2.662-4.638H43.63c2.396 0 4.435.843 6.122 2.528 1.685 1.686 2.529 3.726 2.529 6.122v7.918c0 2.395-.844 4.436-2.53 6.121-1.686 1.687-3.725 2.529-6.12 2.529H33.315c-2.395 0-4.436-.842-6.12-2.529-1.687-1.685-2.53-3.726-2.53-6.121z"/></svg>
+<svg width="24" height="24" fill="none" xmlns="http://www.w3.org/2000/svg"><circle cx="12" cy="12" r="12" fill="#0F4D9D"/><path d="M8 6.4v8.395c0 .776.273 1.438.82 1.985.547.547 1.208.82 1.985.82h3.345c.777 0 1.439-.273 1.986-.82.546-.547.82-1.209.82-1.985v-2.569c0-.777-.274-1.438-.82-1.985a2.705 2.705 0 0 0-1.986-.82h-3.625c0 .596.288 1.098.863 1.504.575.407 1.28.625 2.115.654h.647c.432.014.648.23.648.647v2.569c0 .431-.216.647-.648.647h-3.345c-.431 0-.647-.216-.647-.647V9.378c0-.82-.21-1.521-.632-2.104C9.104 6.69 8.596 6.4 8 6.4Z" fill="#fff"/></svg>

src/core/components/iframe/iframe.scss

@@ -1,5 +1,3 @@
-@import "~theme/globals";
-
 :host {
     > div {
         max-width: 100%;
@@ -14,7 +12,10 @@
 
     .core-loading-container {
         position: absolute;
-        @include position(0, 0, 0, 0);
+        top: 0;
+        bottom: 0;
+        left: 0;
+        right: 0;
         display: table;
         height: 100%;
         width: 100%;

src/core/directives/collapsible-header.ts

@@ -211,6 +211,7 @@ export class CoreCollapsibleHeaderDirective implements OnDestroy {
             parseInt(getComputedStyle(this.contentH1.parentElement).marginTop || '0', 10)) + 'px',
         );
         this.contentH1.style.setProperty('position', 'absolute');
+        this.contentH1.parentElement.style.setProperty('position', 'relative');
 
         this.setupContent();
     }

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

@@ -3,7 +3,6 @@
         <ion-item id="core-course-module-{{module.id}}" detail="false"
             class="ion-text-wrap core-course-module-handler core-module-main-item {{module.handlerData.class}}"
             (click)="moduleClicked($event)" [attr.aria-label]="module.handlerData.a11yTitle" [ngClass]="{
-                'item-media': module.handlerData.icon,
                 'item-dimmed': module.visible === 0 || module.uservisible === false
             }" [button]="module.handlerData.action && module.uservisible">
 
@@ -16,6 +15,8 @@
                     <core-format-text [text]="module.handlerData.title" contextLevel="module" [contextInstanceId]="module.id"
                         [courseId]="module.course" [attr.aria-label]="module.handlerData.a11yTitle + ', ' + modNameTranslated">
                     </core-format-text>
+                    <ion-icon name="fas-lock" *ngIf="module.visible === 0 || module.uservisible === false"
+                        [attr.aria-label]="'core.restricted' | translate"></ion-icon>
                 </p>
 
                 <div class="core-module-additional-info">
@@ -31,7 +32,7 @@
                     </ion-chip>
 
                     <!-- Hidden badges -->
-                    <ion-badge color="warning" *ngIf="module.visible === 0 && (!section || section.visible)">
+                    <ion-badge color="warning" *ngIf="module.visible === 0">
                         {{ 'core.course.hiddenfromstudents' | translate }}
                     </ion-badge>
                     <ion-badge color="warning" *ngIf="module.visible !== 0 && module.isStealth">
@@ -60,7 +61,6 @@
         </ion-item>
         <ion-item *ngIf="hasInfo" id="core-course-module-{{module.id}}-info" detail="false"
             class="ion-text-wrap core-course-module-handler core-course-module-info {{module.handlerData.class}}" [ngClass]="{
-                'item-media': module.handlerData.icon,
                 'item-dimmed': module.visible === 0 || module.uservisible === false
             }">
             <ion-label collapsible-item>

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

@@ -11,6 +11,10 @@
     ion-item.core-module-main-item {
         --min-height: 52px;
 
+        .core-module-title .item-heading ion-icon {
+            @include margin-horizontal(8px, null);
+        }
+
         .core-module-buttons,
         .buttons.core-module-buttons {
             margin: 0;
@@ -39,6 +43,7 @@
         .core-module-additional-info {
             display: flex;
             align-items: center;
+            flex-wrap: wrap;
         }
     }
 

src/core/features/course/lang.json

@@ -19,8 +19,6 @@
     "completion_setby:manual:done": "{{$a.activityname}} is marked by {{$a.setby}} as done. Press to undo.",
     "completion_setby:manual:markdone": "{{$a.activityname}} is marked by {{$a.setby}} as not done. Press to mark as done.",
     "completionrequirements": "Completion requirements for {{$a}}",
-    "confirmdeletemodulefiles": "Are you sure you want to delete these files?",
-    "confirmdeletestoreddata": "Are you sure you want to delete the stored data?",
     "confirmdownload": "You are about to download {{size}}.{{availableSpace}} Are you sure you want to continue?",
     "confirmdownloadunknownsize": "It was not possible to calculate the size of the download.{{availableSpace}} Are you sure you want to continue?",
     "confirmdownloadzerosize": "You are about to start downloading.{{availableSpace}} Are you sure you want to continue?",

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

@@ -1,6 +1,10 @@
 @import '~theme/globals.scss';
 
 :host {
+    .core-format-progress-list {
+        width: 100%;
+    }
+
     .core-course-thumb {
         height: var(--core-courseimage-on-course-size);
         min-height: var(--core-courseimage-on-course-size);
@@ -9,9 +13,9 @@
         --border-radius: var(--core-courseimage-radius);
     }
 
-    @if ($core-show-courseimage-on-course) {
+    @if ($core-hide-courseimage-on-course) {
         .core-course-thumb {
-            display: block;
+            display: none;
         }
     }
 

src/core/features/course/services/course-helper.ts

@@ -499,7 +499,7 @@ export class CoreCourseHelperProvider {
 
         try {
 
-            await CoreDomUtils.showDeleteConfirm('core.course.confirmdeletestoreddata');
+            await CoreDomUtils.showDeleteConfirm('addon.storagemanager.confirmdeletedatafrom', { name: module.name });
 
             modal = await CoreDomUtils.showModalLoading();
 

src/core/features/courses/components/course-list-item/course-list-item.ts

@@ -259,7 +259,10 @@ export class CoreCoursesCourseListItemComponent implements OnInit, OnDestroy, On
      */
     async deleteCourseStoredData(): Promise<void> {
         try {
-            await CoreDomUtils.showDeleteConfirm('core.course.confirmdeletestoreddata');
+            await CoreDomUtils.showDeleteConfirm(
+                'addon.storagemanager.confirmdeletedatafrom',
+                { name: this.course.displayname || this.course.fullname },
+            );
         } catch (error) {
             if (!CoreDomUtils.isCanceledError(error)) {
                 throw error;

src/core/features/courses/components/course-progress/course-progress.ts

@@ -175,7 +175,10 @@ export class CoreCoursesCourseProgressComponent implements OnInit, OnDestroy, On
      */
     async deleteCourse(): Promise<void> {
         try {
-            await CoreDomUtils.showDeleteConfirm('core.course.confirmdeletestoreddata');
+            await CoreDomUtils.showDeleteConfirm(
+                'addon.storagemanager.confirmdeletedatafrom',
+                { name: this.course.displayname || this.course.fullname },
+            );
         } catch (error) {
             if (!CoreDomUtils.isCanceledError(error)) {
                 throw error;

src/core/features/login/login.scss

@@ -77,11 +77,6 @@
         }
     }
 
-    .core-login-reconnect-warning ion-item {
-        font-size: 0.9em;
-        --background: var(--core-login-input-background);
-    }
-
     @if ($core-fixed-url) {
         .core-sitename, .core-siteurl {
             display: none;

src/core/features/login/pages/reconnect/reconnect.html

@@ -29,7 +29,9 @@
         <ion-card *ngIf="!isLoggedOut" class="core-danger-card core-login-reconnect-warning">
             <ion-item>
                 <ion-icon name="fas-exclamation-circle" slot="start" aria-hidden="true"></ion-icon>
-                <ion-label color="danger">{{ 'core.login.reconnectdescription' | translate }}</ion-label>
+                <ion-label>
+                    <p>{{ 'core.login.reconnectdescription' | translate }}</p>
+                </ion-label>
             </ion-item>
         </ion-card>
     </div>

src/core/features/mainmenu/pages/more/more.scss

@@ -1,5 +1,3 @@
-@import "~theme/globals";
-
 ion-item {
 	--border-color: var(--core-more-item-border, var(--ion-border-color));
 

src/core/features/settings/lang.json

@@ -21,8 +21,6 @@
     "currentlanguage": "Current language",
     "debugdisplay": "Display debug messages",
     "debugdisplaydescription": "If enabled, error modals will display more data about the error if possible.",
-    "deletesitefiles": "Are you sure that you want to delete the downloaded files and cached data from the site '{{sitename}}'? You won't be able to use the app in offline mode.",
-    "deletesitefilestitle": "Delete site files",
     "developeroptions": "Developer options",
     "deviceinfo": "Device info",
     "deviceos": "Device OS",
@@ -38,7 +36,6 @@
     "enablerichtexteditordescription": "If enabled, a text editor will be available when entering content.",
     "enablesyncwifi": "Allow sync only when on Wi-Fi",
     "entriesincache": "{{$a}} entries in cache",
-    "errordeletesitefiles": "Error deleting site files.",
     "errorsyncsite": "Error synchronising site data. Please check your Internet connection and try again.",
     "estimatedfreespace": "Estimated free space",
     "filesystemroot": "File system root",
@@ -75,7 +72,6 @@
     "siteplugins": "Site plugins",
     "sites": "Sites",
     "spaceusage": "Space usage",
-    "spaceusagehelp": "Deleting the stored information of the site will remove all the site offline data. This information allows you to use the app when offline. ",
     "synchronization": "Synchronisation",
     "synchronizenow": "Synchronise now",
     "synchronizenowhelp": "Synchronising a site will send pending changes and all offline activity stored in the device and will synchronise some data like messages and notifications.",

src/core/features/settings/pages/space-usage/space-usage.html

@@ -8,9 +8,6 @@
         </ion-title>
         <ion-buttons slot="end">
             <core-navbar-buttons>
-                <ion-button (click)="showInfo()" [attr.aria-label]="'core.info' | translate">
-                    <ion-icon name="fas-info-circle" slot="icon-only" aria-hidden="true"></ion-icon>
-                </ion-button>
             </core-navbar-buttons>
         </ion-buttons>
     </ion-toolbar>
@@ -28,14 +25,13 @@
                     </p>
                     <p class="ion-text-wrap">{{ site.fullName }}</p>
                     <p>{{ site.siteUrlWithoutProtocol }}</p>
+                    <ion-badge color="light" *ngIf="site.spaceUsage !== undefined">{{ site.spaceUsage | coreBytesToSize }}</ion-badge>
                 </ion-label>
-                <p *ngIf="site.spaceUsage !== undefined" slot="end">
-                    {{ site.spaceUsage | coreBytesToSize }}
-                </p>
                 <ion-button fill="clear" color="danger" slot="end" (click)="deleteSiteStorage(site)"
-                    [hidden]="site.spaceUsage! + site.cacheEntries! <= 0"
+                    [hidden]="site.spaceUsage! + site.cacheEntries! <= 0">
-                    [attr.aria-label]="'core.settings.deletesitefilestitle' | translate">
+                    <ion-icon name="fas-trash" slot="icon-only"
-                    <ion-icon name="fas-trash" slot="icon-only" aria-hidden="true"></ion-icon>
+                        [attr.aria-label]="'addon.storagemanager.deletedatafrom' | translate: { name: site.siteName }">
+                    </ion-icon>
                 </ion-button>
             </ion-item>
             <ion-item-divider>

src/core/features/settings/pages/space-usage/space-usage.ts

@@ -16,8 +16,6 @@ import { Component, OnDestroy, OnInit } from '@angular/core';
 import { IonRefresher } from '@ionic/angular';
 
 import { CoreSiteBasicInfo, CoreSites } from '@services/sites';
-import { CoreDomUtils } from '@services/utils/dom';
-import { Translate } from '@singletons';
 import { CoreEventObserver, CoreEvents } from '@singletons/events';
 
 import { CoreSettingsHelper, CoreSiteSpaceUsage } from '../../services/settings-helper';
@@ -129,16 +127,6 @@ export class CoreSettingsSpaceUsagePage implements OnInit, OnDestroy {
         }
     }
 
-    /**
-     * Show information about space usage actions.
-     */
-    showInfo(): void {
-        CoreDomUtils.showAlert(
-            Translate.instant('core.help'),
-            Translate.instant('core.settings.spaceusagehelp'),
-        );
-    }
-
     /**
      * Page destroyed.
      */

src/core/features/settings/services/settings-helper.ts

@@ -116,10 +116,13 @@ export class CoreSettingsHelperProvider {
 
         siteName = await CoreFilter.formatText(siteName, { clean: true, singleLine: true, filter: false }, [], siteId);
 
-        const title = Translate.instant('core.settings.deletesitefilestitle');
+        const title = Translate.instant('addon.storagemanager.confirmdeleteallsitedata');
-        const message = Translate.instant('core.settings.deletesitefiles', { sitename: siteName });
 
-        await CoreDomUtils.showConfirm(message, title, Translate.instant('core.delete'));
+        await CoreDomUtils.showDeleteConfirm(
+            'addon.storagemanager.deleteallsitedatainfo',
+            { name: siteName },
+            { header:  title },
+        );
 
         const site = await CoreSites.getSite(siteId);
 
@@ -143,7 +146,7 @@ export class CoreSettingsHelperProvider {
                 siteInfo.spaceUsage = 0;
             } else {
                 // Error, recalculate the site usage.
-                CoreDomUtils.showErrorModal('core.settings.errordeletesitefiles', true);
+                CoreDomUtils.showErrorModal('addon.storagemanager.errordeletedownloadeddata', true);
 
                 siteInfo.spaceUsage = await site.getSpaceUsage();
             }

src/core/features/tag/components/list/list.scss

@@ -5,6 +5,7 @@
 
     ion-badge {
         cursor: pointer;
-        @include margin-horizontal(4px, 4px);
+        margin-left: 4px;
+        margin-right: 4px;
     }
 }

src/core/features/user/pages/about/about.scss

@@ -1,5 +1,3 @@
-@import "~theme/globals";
-
 :host {
 
     .core-user-profile-maininfo::part(native) {
@@ -41,7 +39,8 @@
     .core-user-profile-interests {
         ion-badge {
             cursor: pointer;
-            @include margin-horizontal(3px, 3px);
+            margin-left: 4px;
+            margin-right: 4px;
         }
     }
 

src/core/services/utils/dom.ts

@@ -1269,15 +1269,34 @@ export class CoreDomUtilsProvider {
     showDeleteConfirm(
         translateMessage: string = 'core.areyousure',
         translateArgs: Record<string, unknown> = {},
-        options?: AlertOptions,
+        options: AlertOptions = {},
     ): Promise<void> {
-        return this.showConfirm(
+        return new Promise((resolve, reject): void => {
-            Translate.instant(translateMessage, translateArgs),
+            options.message = Translate.instant(translateMessage, translateArgs);
-            undefined,
+
-            Translate.instant('core.delete'),
+            options.buttons = [
-            undefined,
+                {
-            options,
+                    text: Translate.instant('core.cancel'),
-        );
+                    role: 'cancel',
+                    handler: () => {
+                        reject(new CoreCanceledError(''));
+                    },
+                },
+                {
+                    text: Translate.instant('core.delete'),
+                    role: 'destructive',
+                    handler: () => {
+                        resolve();
+                    },
+                },
+            ];
+
+            if (!options.header) {
+                options.cssClass = (options.cssClass || '') + ' core-nohead';
+            }
+
+            this.showAlertWithOptions(options, 0);
+        });
     }
 
     /**

src/theme/components/format-text.scss

@@ -543,6 +543,7 @@ core-rich-text-editor .core-rte-editor {
         padding: .75rem 1.25rem;
         margin-bottom: 1rem;
         border: 0 solid transparent;
+        border-radius: .5rem;
     }
 
     // Headings for larger alerts

src/theme/globals.variables.scss

@@ -90,7 +90,7 @@ $core-dashboard-logo: false !default;
 $core-always-show-main-menu: false !default;
 $core-format-text-never-shorten: false !default;
 
-$core-show-courseimage-on-course: false !default;
+$core-hide-courseimage-on-course: false !default;
 $core-hide-progress-on-course: false !default;
 $core-hide-progress-on-section-selector: false !default;
 

src/theme/theme.base.scss

@@ -414,9 +414,10 @@ ion-alert {
         overflow: auto;
         border-radius: var(--border-radius) !important;
 
-        button.alert-button {
+        button.alert-button.alert-button-role-destructive {
-            color: var(--primary);
+            color: var(--danger);
         }
+
     }
 
     .alert-message {
@@ -673,23 +674,37 @@ body.core-iframe-fullscreen ion-router-outlet {
 
     // Message cards.
     ion-card.core-#{$color-name}-card {
-        --color-base: var(--ion-color-#{$color-name});
+        --color-tint: var(--ion-color-#{$color-name}-tint);
+        --color-shade: var(--ion-color-#{$color-name}-shade);
+        --border-width: 0;
 
-        border-bottom: 3px solid var(--color-base);
+        --border-color: var(--color-tint);
+        --background: var(--color-tint);
+        --color: var(--color-shade);
 
         ion-item {
+            --background: var(--color-tint);
+            --color: var(--color-shade);
             --inner-border-width: 0px;
+            --border-width: 0px;
+
+            ion-label, ion-label > p {
+                --color: var(--color-shade);
+            }
         }
+
         ion-label {
             white-space: normal !important;
         }
         ion-icon {
-            color: var(--color-base);
+            color: var(--color-shade);
+            @include margin-horizontal(null, 16px);
         }
     }
 
     .item.core-#{$color-name}-item {
         --color-base: var(--ion-color-#{$color-name});
+        --color-shade: var(--ion-color-#{$color-name}-shade);
 
         --border-width: 0 0 3px 0;
         --border-color: var(--color-base);
@@ -1260,7 +1275,6 @@ ion-item.item-input ion-input.has-focus {
 
 ion-item-divider.item,
 ion-item.item.divider {
-    --inner-padding-end: 8px;
     min-height: var(--min-height);
     border-bottom-width: var(--item-divider-border-width);
     --border-width: var(--item-divider-border-width);

src/theme/theme.dark.scss

@@ -69,6 +69,7 @@
 
     --core-header-toolbar-background:   var(--gray-900);
     --core-header-toolbar-color:        var(--white);
+    --core-header-toolbar-border-color: var(--stroke);
 
     --core-tabs-background: var(--gray-800);
     --core-tab-background: var(--core-tabs-background);