diff --git a/src/addons/block/recentlyaccessedcourses/components/recentlyaccessedcourses/addon-block-recentlyaccessedcourses.html b/src/addons/block/recentlyaccessedcourses/components/recentlyaccessedcourses/addon-block-recentlyaccessedcourses.html
index e0cc57102..c5680098a 100644
--- a/src/addons/block/recentlyaccessedcourses/components/recentlyaccessedcourses/addon-block-recentlyaccessedcourses.html
+++ b/src/addons/block/recentlyaccessedcourses/components/recentlyaccessedcourses/addon-block-recentlyaccessedcourses.html
@@ -14,7 +14,7 @@
     </div>
 </ion-item-divider>
 <core-loading [hideUntil]="loaded" class="core-loading-center safe-area-page">
-    <core-empty-box *ngIf="courses.length == 0" image="assets/img/icons/courses.svg"
+    <core-empty-box *ngIf="courses.length == 0" image="assets/img/icons/courses.svg" inline="true"
         [message]="'addon.block_recentlyaccessedcourses.nocourses' | translate"></core-empty-box>
     <!-- List of courses. -->
      <div class="core-horizontal-scroll">
diff --git a/src/addons/block/recentlyaccesseditems/components/recentlyaccesseditems/addon-block-recentlyaccesseditems.html b/src/addons/block/recentlyaccesseditems/components/recentlyaccesseditems/addon-block-recentlyaccesseditems.html
index 615d39f7f..bc9ffadb7 100644
--- a/src/addons/block/recentlyaccesseditems/components/recentlyaccesseditems/addon-block-recentlyaccesseditems.html
+++ b/src/addons/block/recentlyaccesseditems/components/recentlyaccesseditems/addon-block-recentlyaccesseditems.html
@@ -25,7 +25,7 @@
         </div>
     </div>
 
-    <core-empty-box *ngIf="items.length <= 0" image="assets/img/icons/activities.svg"
+    <core-empty-box *ngIf="items.length <= 0" image="assets/img/icons/activities.svg" inline="true"
         [message]="'addon.block_recentlyaccesseditems.noitems' | translate"></core-empty-box>
 
 </core-loading>
diff --git a/src/addons/block/starredcourses/components/starredcourses/addon-block-starredcourses.html b/src/addons/block/starredcourses/components/starredcourses/addon-block-starredcourses.html
index 5623b314a..90064a66d 100644
--- a/src/addons/block/starredcourses/components/starredcourses/addon-block-starredcourses.html
+++ b/src/addons/block/starredcourses/components/starredcourses/addon-block-starredcourses.html
@@ -14,10 +14,10 @@
     </div>
 </ion-item-divider>
 <core-loading [hideUntil]="loaded" class="core-loading-center safe-area-page">
-    <core-empty-box *ngIf="courses.length == 0" image="assets/img/icons/courses.svg"
+    <core-empty-box *ngIf="courses.length == 0" image="assets/img/icons/courses.svg" inline="true"
         [message]="'addon.block_starredcourses.nocourses' | translate"></core-empty-box>
     <!-- List of courses. -->
-    <div class="core-horizontal-scroll">
+    <div class="core-horizontal-scroll" *ngIf="courses.length > 0">
         <ng-container *ngFor="let course of courses">
             <core-courses-course-progress [course]="course" class="core-block_starredcourses"
                 [showDownload]="downloadCourseEnabled && downloadEnabled"></core-courses-course-progress>
diff --git a/src/addons/block/timeline/components/timeline/addon-block-timeline.html b/src/addons/block/timeline/components/timeline/addon-block-timeline.html
index 6635ba016..bbce37627 100644
--- a/src/addons/block/timeline/components/timeline/addon-block-timeline.html
+++ b/src/addons/block/timeline/components/timeline/addon-block-timeline.html
@@ -51,7 +51,7 @@
                 </ion-col>
             </ion-row>
         </ion-grid>
-        <core-empty-box *ngIf="timelineCourses.courses.length == 0" image="assets/img/icons/courses.svg"
+        <core-empty-box *ngIf="timelineCourses.courses.length == 0" image="assets/img/icons/courses.svg" inline="true"
             [message]="'addon.block_timeline.nocoursesinprogress' | translate"></core-empty-box>
     </core-loading>
 </core-loading>
diff --git a/src/core/components/loading/loading.scss b/src/core/components/loading/loading.scss
index 53746da0e..a6d075729 100644
--- a/src/core/components/loading/loading.scss
+++ b/src/core/components/loading/loading.scss
@@ -1,14 +1,13 @@
+@import "~theme/globals";
+
 :host {
     position: static;
-    -webkit-transition: height 200ms ease-in-out;
-    transition: height 200ms ease-in-out;
+    @include core-transition(height, 200ms);
+    --loading-background: rgba(255, 255, 255, 0.26);
 
     > .core-loading-container {
         position: absolute;
-        top: 0;
-        right: 0;
-        left: 0;
-        bottom: 0;
+        @include position(0, 0, 0, 0);
         display: table;
         height: 100%;
         width: 100%;
@@ -17,7 +16,7 @@
         z-index: 3;
         margin: 0;
         padding: 10px 0 0 0;
-        background-color: rgba(255, 255, 255, 0.26);
+        background-color: var(--loading-background);
         -webkit-transition: all 200ms ease-in-out;
         transition: all 200ms ease-in-out;
 
@@ -29,7 +28,7 @@
     }
 
     .core-loading-content {
-        display: inline;
+        display: contents;
         padding-bottom: 1px; /* This makes height be real */
     }
 
@@ -45,8 +44,12 @@
         display: block;
 
         .core-loading-container {
-            margin-top: 10px;
+            padding-top: 20px;
             position: relative;
         }
     }
 }
+
+:host-context(body.dark) {
+    --loading-background: rgba(0, 0, 0, 0.26);
+}
diff --git a/src/core/features/course/components/format/core-course-format.html b/src/core/features/course/components/format/core-course-format.html
index 83df84652..50e81e8e7 100644
--- a/src/core/features/course/components/format/core-course-format.html
+++ b/src/core/features/course/components/format/core-course-format.html
@@ -155,7 +155,7 @@
 
 <!-- Template to render a section download button/progress. -->
 <ng-template #sectionDownloadTemplate let-section="section">
-    <div *ngIf="section && downloadEnabled" slot="end">
+    <div *ngIf="section && downloadEnabled" slot="end" class="core-button-spinner core-section-download">
         <!-- Download progress. -->
         <ion-badge class="core-course-download-section-progress"
             *ngIf="section.isDownloading && section.total > 0 && section.count < section.total">
diff --git a/src/core/features/course/components/format/format.scss b/src/core/features/course/components/format/format.scss
index b79f185c3..0c0b7aca9 100644
--- a/src/core/features/course/components/format/format.scss
+++ b/src/core/features/course/components/format/format.scss
@@ -1,8 +1,4 @@
-// ion-app.app-root ion-badge.core-course-download-section-progress {
-//     display: block;
-//     @include float(start);
-//     @include margin(12px, 12px, null, 12px);
-// }
+@import '~theme/globals.scss';
 
 :host {
 
@@ -52,4 +48,14 @@
         }
     }
 
+    .core-section-download.core-button-spinner {
+        display: flex;
+        align-items: center;
+        @include margin-horizontal(10px);
+
+        ion-badge.core-course-download-courses-progress {
+            @include margin(null, 12px, null, null);
+        }
+    }
+
 }