MOBILE-3320 loading: Improve core-loading layout and animations

2021-05-28 16:16:34 +02:00 · 2021-05-28 16:16:34 +02:00 · f74b7b204f
commit f74b7b204f
parent f5c5b0e65e
39 changed files with 56 additions and 47 deletions
--- a/src/addons/block/activitymodules/components/activitymodules/addon-block-activitymodules.html
+++ b/src/addons/block/activitymodules/components/activitymodules/addon-block-activitymodules.html
@ -3,7 +3,7 @@
        <h2>{{ 'addon.block_activitymodules.pluginname' | translate }}</h2>
    </ion-label>
 </ion-item-divider>
-<core-loading [hideUntil]="loaded" class="core-loading-center">
+<core-loading [hideUntil]="loaded" [fullscreen]="false">
    <ion-item class="ion-text-wrap item-media" *ngFor="let entry of entries" detail="false" button
        (click)="gotoCoureListModType(entry)">
        <img slot="start" [src]="entry.icon" alt="" role="presentation" class="core-module-icon">
--- a/src/addons/block/myoverview/components/myoverview/addon-block-myoverview.html
+++ b/src/addons/block/myoverview/components/myoverview/addon-block-myoverview.html
@ -36,7 +36,7 @@
        </core-context-menu-item>
    </core-context-menu>
 </ion-item-divider>
-<core-loading [hideUntil]="loaded" class="core-loading-center">
+<core-loading [hideUntil]="loaded" [fullscreen]="false">
    <div class="safe-padding-horizontal" [hidden]="showFilter || !showSelectorFilter">
        <!-- "Time" selector. -->
        <core-combobox [label]="'core.show' | translate" [selection]="selectedFilter" (onChange)="selectedChanged($event)">
--- a/src/addons/block/recentlyaccessedcourses/components/recentlyaccessedcourses/addon-block-recentlyaccessedcourses.html
+++ b/src/addons/block/recentlyaccessedcourses/components/recentlyaccessedcourses/addon-block-recentlyaccessedcourses.html
@ -20,7 +20,7 @@
        </core-horizontal-scroll-controls>
    </div>
 </ion-item-divider>
-<core-loading [hideUntil]="loaded" class="core-loading-center safe-area-page">
+<core-loading [hideUntil]="loaded" [fullscreen]="false" class="safe-area-page">
    <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. -->
--- a/src/addons/block/recentlyaccesseditems/components/recentlyaccesseditems/addon-block-recentlyaccesseditems.html
+++ b/src/addons/block/recentlyaccesseditems/components/recentlyaccesseditems/addon-block-recentlyaccesseditems.html
@ -5,7 +5,7 @@
        </core-horizontal-scroll-controls>
    </div>
 </ion-item-divider>
-<core-loading [hideUntil]="loaded" class="core-loading-center safe-area-page">
+<core-loading [hideUntil]="loaded" [fullscreen]="false" class="safe-area-page">
    <div
        [id]="scrollElementId"
        [hidden]="!items || items.length === 0"
--- a/src/addons/block/sitemainmenu/components/sitemainmenu/addon-block-sitemainmenu.html
+++ b/src/addons/block/sitemainmenu/components/sitemainmenu/addon-block-sitemainmenu.html
@ -3,7 +3,7 @@
        <h2>{{ 'addon.block_sitemainmenu.pluginname' | translate }}</h2>
    </ion-label>
 </ion-item-divider>
-<core-loading [hideUntil]="loaded" class="core-loading-center">
+<core-loading [hideUntil]="loaded" [fullscreen]="false">
    <ng-container *ngIf="mainMenuBlock">
        <ion-item class="ion-text-wrap" *ngIf="mainMenuBlock.summary">
            <ion-label>
--- a/src/addons/block/starredcourses/components/starredcourses/addon-block-starredcourses.html
+++ b/src/addons/block/starredcourses/components/starredcourses/addon-block-starredcourses.html
@ -20,7 +20,7 @@
        </core-horizontal-scroll-controls>
    </div>
 </ion-item-divider>
-<core-loading [hideUntil]="loaded" class="core-loading-center safe-area-page">
+<core-loading [hideUntil]="loaded" [fullscreen]="false" class="safe-area-page">
    <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. -->
--- a/src/addons/block/timeline/components/timeline/addon-block-timeline.html
+++ b/src/addons/block/timeline/components/timeline/addon-block-timeline.html
@ -9,7 +9,7 @@
        </core-context-menu-item>
    </core-context-menu>
 </ion-item-divider>
-<core-loading [hideUntil]="loaded" class="core-loading-center">
+<core-loading [hideUntil]="loaded" [fullscreen]="false">
    <div class="safe-padding-horizontal">
        <core-combobox [selection]="filter" (onChange)="switchFilter($event)">
            <ion-select-option class="ion-text-wrap" value="all">
@ -35,12 +35,12 @@
            </ion-select-option>
        </core-combobox>
    </div>
-    <core-loading [hideUntil]="timeline.loaded" [hidden]="sort != 'sortbydates'" class="core-loading-center">
+    <core-loading [hideUntil]="timeline.loaded" [hidden]="sort != 'sortbydates'" [fullscreen]="false">
        <addon-block-timeline-events [events]="timeline.events" showCourse="true" [canLoadMore]="timeline.canLoadMore"
            (loadMore)="loadMoreTimeline()" [from]="dataFrom" [to]="dataTo"></addon-block-timeline-events>
    </core-loading>
    <core-loading [hideUntil]="timelineCourses.loaded" [hidden]="sort != 'sortbycourses'"
-        class="core-loading-center safe-area-page">
+        [fullscreen]="false" class="safe-area-page">
        <ion-grid class="ion-no-padding">
            <ion-row class="ion-no-padding">
                <ion-col *ngFor="let course of timelineCourses.courses" class="ion-no-padding" size="12" size-md="6">
--- a/src/addons/mod/assign/components/index/addon-mod-assign-index.html
+++ b/src/addons/mod/assign/components/index/addon-mod-assign-index.html
@ -28,7 +28,7 @@
 </core-navbar-buttons>

 <!-- Content. -->
-<core-loading [hideUntil]="loaded" class="core-loading-center">
+<core-loading [hideUntil]="loaded">

    <!-- Activity info. -->
    <core-course-module-info *ngIf="showCompletion" [module]="module" [showManualCompletion]="true"
--- a/src/addons/mod/assign/components/submission/addon-mod-assign-submission.html
+++ b/src/addons/mod/assign/components/submission/addon-mod-assign-submission.html
@ -1,4 +1,4 @@
-<core-loading [hideUntil]="loaded" class="core-loading-center">
+<core-loading [hideUntil]="loaded" [fullscreen]="false">

    <!-- User and status of the submission. -->
    <ion-item class="ion-text-wrap" *ngIf="!blindMarking && user" core-user-link [userId]="submitId" [courseId]="courseId"
--- a/src/addons/mod/book/components/index/addon-mod-book-index.html
+++ b/src/addons/mod/book/components/index/addon-mod-book-index.html
@ -21,7 +21,7 @@
 </core-navbar-buttons>

 <!-- Content. -->
-<core-loading [hideUntil]="loaded" class="core-loading-center">
+<core-loading [hideUntil]="loaded">

    <!-- Activity info. -->
    <core-course-module-info *ngIf="showCompletion" [module]="module" [showManualCompletion]="true"
--- a/src/addons/mod/chat/components/index/addon-mod-chat-index.html
+++ b/src/addons/mod/chat/components/index/addon-mod-chat-index.html
@ -24,7 +24,7 @@
 </core-navbar-buttons>

 <!-- Content. -->
-<core-loading [hideUntil]="loaded" class="core-loading-center safe-area-page">
+<core-loading [hideUntil]="loaded" class="safe-area-page">

    <!-- Activity info. -->
    <core-course-module-info *ngIf="showCompletion" [module]="module" [showManualCompletion]="true"
--- a/src/addons/mod/choice/components/index/addon-mod-choice-index.html
+++ b/src/addons/mod/choice/components/index/addon-mod-choice-index.html
@ -26,7 +26,7 @@
 </core-navbar-buttons>

 <!-- Content. -->
-<core-loading [hideUntil]="loaded" class="core-loading-center">
+<core-loading [hideUntil]="loaded">

    <!-- Activity info. -->
    <core-course-module-info *ngIf="showCompletion" [module]="module" [showManualCompletion]="true"
--- a/src/addons/mod/data/components/index/addon-mod-data-index.html
+++ b/src/addons/mod/data/components/index/addon-mod-data-index.html
@ -37,7 +37,7 @@
 </core-navbar-buttons>

 <!-- Content. -->
-<core-loading [hideUntil]="loaded" class="core-loading-center">
+<core-loading [hideUntil]="loaded">

    <!-- Activity info. -->
    <core-course-module-info *ngIf="showCompletion" [module]="module" [showManualCompletion]="true"
--- a/src/addons/mod/feedback/components/index/addon-mod-feedback-index.html
+++ b/src/addons/mod/feedback/components/index/addon-mod-feedback-index.html
@ -26,7 +26,7 @@
 </core-navbar-buttons>

 <!-- Content. -->
-<core-loading [hideUntil]="loaded" class="core-loading-center">
+<core-loading [hideUntil]="loaded">

    <!-- Activity info. -->
    <core-course-module-info *ngIf="showCompletion" [module]="module" [showManualCompletion]="true"
--- a/src/addons/mod/folder/components/index/addon-mod-folder-index.html
+++ b/src/addons/mod/folder/components/index/addon-mod-folder-index.html
@ -23,7 +23,7 @@
 </core-navbar-buttons>

 <!-- Content. -->
-<core-loading [hideUntil]="loaded" class="core-loading-center">
+<core-loading [hideUntil]="loaded">

    <!-- Activity info. -->
    <core-course-module-info *ngIf="showCompletion" [module]="module" [showManualCompletion]="true"
--- a/src/addons/mod/forum/components/index/index.html
+++ b/src/addons/mod/forum/components/index/index.html
@ -41,7 +41,7 @@
        <ion-refresher-content pullingText="{{ 'core.pulltorefresh' | translate }}"></ion-refresher-content>
    </ion-refresher>

-    <core-loading [hideUntil]="discussions.loaded" class="core-loading-center">
+    <core-loading [hideUntil]="discussions.loaded">
        <!-- Activity info. -->
        <core-course-module-info *ngIf="showCompletion" [module]="module" [showManualCompletion]="true"
            (completionChanged)="onCompletionChange()">
--- a/src/addons/mod/forum/components/post-options-menu/post-options-menu.html
+++ b/src/addons/mod/forum/components/post-options-menu/post-options-menu.html
@ -1,4 +1,4 @@
-<core-loading [hideUntil]="loaded" class="core-loading-center">
+<core-loading [hideUntil]="loaded" [fullscreen]="false">
    <ion-item class="ion-text-wrap" (click)="editPost()" *ngIf="offlinePost || (canEdit && isOnline)">
        <ion-icon name="fas-pen" slot="start" aria-hidden="true"></ion-icon>
        <ion-label>
--- a/src/addons/mod/glossary/components/index/addon-mod-glossary-index.html
+++ b/src/addons/mod/glossary/components/index/addon-mod-glossary-index.html
@ -49,7 +49,7 @@
        [autoFocus]="true" [lengthCheck]="2" (onClear)="toggleSearch()" searchArea="AddonModGlossary-{{module.id}}">
    </core-search-box>

-    <core-loading [hideUntil]="entries.loaded" class="core-loading-center">
+    <core-loading [hideUntil]="entries.loaded">
        <!-- Activity info. -->
        <core-course-module-info *ngIf="showCompletion" [module]="module" [showManualCompletion]="true"
            (completionChanged)="onCompletionChange()">
--- a/src/addons/mod/h5pactivity/components/index/addon-mod-h5pactivity-index.html
+++ b/src/addons/mod/h5pactivity/components/index/addon-mod-h5pactivity-index.html
@ -30,7 +30,7 @@
 </core-navbar-buttons>

 <!-- Content. -->
-<core-loading [hideUntil]="loaded" class="core-loading-center safe-area-page">
+<core-loading [hideUntil]="loaded" class="safe-area-page">

    <!-- Activity info. -->
    <core-course-module-info *ngIf="showCompletion" [module]="module" [showManualCompletion]="true"
--- a/src/addons/mod/imscp/components/index/addon-mod-imscp-index.html
+++ b/src/addons/mod/imscp/components/index/addon-mod-imscp-index.html
@ -26,7 +26,7 @@
 </core-navbar-buttons>

 <!-- Content. -->
-<core-loading [hideUntil]="loaded" class="core-loading-center safe-area-page">
+<core-loading [hideUntil]="loaded" class="safe-area-page">

    <!-- Activity info. -->
    <core-course-module-info *ngIf="showCompletion" [module]="module" [showManualCompletion]="true"
--- a/src/addons/mod/lesson/components/index/addon-mod-lesson-index.html
+++ b/src/addons/mod/lesson/components/index/addon-mod-lesson-index.html
@ -26,7 +26,7 @@
 </core-navbar-buttons>

 <!-- Content. -->
-<core-loading [hideUntil]="loaded" class="core-loading-center">
+<core-loading [hideUntil]="loaded">
    <core-tabs [hideUntil]="loaded" [selectedIndex]="selectedTab">
        <!-- Index/Preview tab. -->
        <core-tab [title]="'addon.mod_lesson.preview' | translate" (ionSelect)="indexSelected()">
--- a/src/addons/mod/lti/components/index/addon-mod-lti-index.html
+++ b/src/addons/mod/lti/components/index/addon-mod-lti-index.html
@ -17,7 +17,7 @@
 </core-navbar-buttons>

 <!-- Content. -->
-<core-loading [hideUntil]="loaded" class="core-loading-center safe-area-page">
+<core-loading [hideUntil]="loaded" class="safe-area-page">

    <!-- Activity info. -->
    <core-course-module-info *ngIf="showCompletion" [module]="module" [showManualCompletion]="true"
--- a/src/addons/mod/page/components/index/addon-mod-page-index.html
+++ b/src/addons/mod/page/components/index/addon-mod-page-index.html
@ -23,7 +23,7 @@
 </core-navbar-buttons>

 <!-- Content. -->
-<core-loading [hideUntil]="loaded" class="core-loading-center safe-area-page">
+<core-loading [hideUntil]="loaded" class="safe-area-page">

    <!-- Activity info. -->
    <core-course-module-info *ngIf="showCompletion" [module]="module" [showManualCompletion]="true"
--- a/src/addons/mod/quiz/components/index/addon-mod-quiz-index.html
+++ b/src/addons/mod/quiz/components/index/addon-mod-quiz-index.html
@ -26,7 +26,7 @@
 </core-navbar-buttons>

 <!-- Content. -->
-<core-loading [hideUntil]="loaded" class="core-loading-center">
+<core-loading [hideUntil]="loaded">

    <!-- Activity info. -->
    <core-course-module-info *ngIf="showCompletion" [module]="module" [showManualCompletion]="true"
--- a/src/addons/mod/resource/components/index/addon-mod-resource-index.html
+++ b/src/addons/mod/resource/components/index/addon-mod-resource-index.html
@ -18,7 +18,7 @@
 </core-navbar-buttons>

 <!-- Content. -->
-<core-loading [hideUntil]="loaded" class="core-loading-center safe-area-page">
+<core-loading [hideUntil]="loaded" class="safe-area-page">

    <!-- Activity info. -->
    <core-course-module-info *ngIf="showCompletion" [module]="module" [showManualCompletion]="true"
--- a/src/addons/mod/scorm/components/index/addon-mod-scorm-index.html
+++ b/src/addons/mod/scorm/components/index/addon-mod-scorm-index.html
@ -26,7 +26,7 @@
 </core-navbar-buttons>

 <!-- Content. -->
-<core-loading [hideUntil]="loaded" class="core-loading-center">
+<core-loading [hideUntil]="loaded">

    <!-- Activity info. -->
    <core-course-module-info *ngIf="showCompletion" [module]="module" [showManualCompletion]="true"
--- a/src/addons/mod/survey/components/index/addon-mod-survey-index.html
+++ b/src/addons/mod/survey/components/index/addon-mod-survey-index.html
@ -27,7 +27,7 @@
 </core-navbar-buttons>

 <!-- Content. -->
-<core-loading [hideUntil]="loaded" class="core-loading-center safe-area-page">
+<core-loading [hideUntil]="loaded" class="safe-area-page">

    <!-- Activity info. -->
    <core-course-module-info *ngIf="showCompletion" [module]="module" [showManualCompletion]="true"
--- a/src/addons/mod/url/components/index/addon-mod-url-index.html
+++ b/src/addons/mod/url/components/index/addon-mod-url-index.html
@ -13,7 +13,7 @@
 </core-navbar-buttons>

 <!-- Content. -->
-<core-loading [hideUntil]="loaded" class="core-loading-center">
+<core-loading [hideUntil]="loaded">

    <!-- Activity info. -->
    <core-course-module-info *ngIf="showCompletion" [module]="module" [showManualCompletion]="true"
--- a/src/addons/mod/wiki/components/index/addon-mod-wiki-index.html
+++ b/src/addons/mod/wiki/components/index/addon-mod-wiki-index.html
@ -46,7 +46,7 @@
 </core-navbar-buttons>

 <!-- Content. -->
-<core-loading [hideUntil]="loaded" class="core-loading-center">
+<core-loading [hideUntil]="loaded">

    <!-- Activity info. -->
    <core-course-module-info *ngIf="showCompletion" [module]="module" [showManualCompletion]="true"
--- a/src/addons/mod/workshop/components/index/addon-mod-workshop-index.html
+++ b/src/addons/mod/workshop/components/index/addon-mod-workshop-index.html
@ -26,7 +26,7 @@
 </core-navbar-buttons>

 <!-- Content. -->
-<core-loading [hideUntil]="loaded" class="core-loading-center">
+<core-loading [hideUntil]="loaded">

    <!-- Activity info. -->
    <core-course-module-info *ngIf="showCompletion" [module]="module" [showManualCompletion]="true"
--- a/src/addons/notes/pages/list/list.html
+++ b/src/addons/notes/pages/list/list.html
@ -29,7 +29,7 @@
        <ion-refresher-content pullingText="{{ 'core.pulltorefresh' | translate }}"></ion-refresher-content>
    </ion-refresher>

-    <core-loading [hideUntil]="notesLoaded" class="core-loading-center">
+    <core-loading [hideUntil]="notesLoaded">
        <ion-item class="ion-text-wrap" *ngIf="user">
            <core-user-avatar [user]="user" [courseId]="courseId" slot="start" [linkProfile]="false"></core-user-avatar>
            <ion-label><h2>{{user!.fullname}}</h2></ion-label>
--- a/src/core/components/loading/loading.scss
+++ b/src/core/components/loading/loading.scss
@ -6,7 +6,6 @@
    --loading-text-color: var(--ion-text-color);

    position: static;
-    @include core-transition(height, 200ms);
    color: var(--loading-text-color);

    ion-spinner {
@ -48,7 +47,7 @@
        position: unset;
    }

-    &.core-loading-center {
+    &.core-loading-inline {
        display: block;

        .core-loading-container {
@ -56,4 +55,14 @@
            position: relative;
        }
    }
+
+    &.core-loading-loaded.core-loading-inline {
+        position: relative;
+        min-height: 102px;
+
+        .core-loading-container {
+            padding-top: 10px;
+            position: absolute;
+        }
+    }
 }
--- a/src/core/components/loading/loading.ts
+++ b/src/core/components/loading/loading.ts
@ -49,6 +49,8 @@ export class CoreLoadingComponent implements OnInit, OnChanges, AfterViewInit {

    @Input() hideUntil: unknown; // Determine when should the contents be shown.
    @Input() message?: string; // Message to show while loading.
+    @Input() protected fullscreen = true; // Use the whole screen.
+
    @ViewChild('content') content?: ElementRef;

    uniqueId: string;
@ -69,6 +71,8 @@ export class CoreLoadingComponent implements OnInit, OnChanges, AfterViewInit {
            // Default loading message.
            this.message = Translate.instant('core.loading');
        }
+
+        this.element.classList.toggle('core-loading-inline', !this.fullscreen);
    }

    /**
@ -78,11 +82,9 @@ export class CoreLoadingComponent implements OnInit, OnChanges, AfterViewInit {
        // Add class if loaded on init.
        if (this.hideUntil) {
            this.element.classList.add('core-loading-loaded');
-            this.content?.nativeElement.classList.add('core-loading-content');
-        } else {
-            this.content?.nativeElement.classList.remove('core-loading-content');
-            this.content?.nativeElement.classList.add('core-loading-content-loading');
        }
+
+        this.content?.nativeElement.classList.toggle('core-loading-content', !!this.hideUntil);
    }

    /**
@ -99,12 +101,10 @@ export class CoreLoadingComponent implements OnInit, OnChanges, AfterViewInit {
                    // Change CSS to force calculate height.
                    // Removed 500ms timeout to avoid reallocating html.
                    this.content?.nativeElement.classList.add('core-loading-content');
-                    this.content?.nativeElement.classList.remove('core-loading-content-loading');
                });
            } else {
                this.element.classList.remove('core-loading-loaded');
                this.content?.nativeElement.classList.remove('core-loading-content');
-                this.content?.nativeElement.classList.add('core-loading-content-loading');
            }

            // Trigger the event after a timeout since the elements inside ngIf haven't been added to DOM yet.
--- a/src/core/features/block/components/course-blocks/core-block-course-blocks.html
+++ b/src/core/features/block/components/course-blocks/core-block-course-blocks.html
@ -3,7 +3,7 @@
 </div>

 <div *ngIf="blocks && blocks.length > 0 && !hideBlocks" [class.core-hide-blocks]="hideBottomBlocks" class="core-course-blocks-side">
-    <core-loading [hideUntil]="dataLoaded" class="core-loading-center">
+    <core-loading [hideUntil]="dataLoaded" [fullscreen]="false">
        <ion-list>
            <!-- Course expand="block"s. -->
            <ng-container *ngFor="let block of blocks">
--- a/src/core/features/block/components/pre-rendered-block/core-block-pre-rendered.html
+++ b/src/core/features/block/components/pre-rendered-block/core-block-pre-rendered.html
@ -7,7 +7,7 @@
        </h2>
    </ion-label>
 </ion-item-divider>
-<core-loading [hideUntil]="loaded" class="core-loading-center">
+<core-loading [hideUntil]="loaded" [fullscreen]="false">
    <ion-item *ngIf="block.contents?.content" class="ion-text-wrap core-block-content">
        <ion-label>
            <core-format-text [text]="block.contents?.content" contextLevel="block" [contextInstanceId]="block.instanceid"
--- a/src/core/features/h5p/components/h5p-iframe/core-h5p-iframe.html
+++ b/src/core/features/h5p/components/h5p-iframe/core-h5p-iframe.html
@ -1,4 +1,4 @@
-<core-loading [hideUntil]="iframeSrc" class="core-loading-center safe-area-page">
+<core-loading [hideUntil]="iframeSrc" [fullscreen]="false" class="safe-area-page">
    <core-iframe *ngIf="iframeSrc" [src]="iframeSrc" iframeHeight="auto" [allowFullscreen]="true" (loaded)="iframeLoaded()">
    </core-iframe>
    <script *ngIf="resizeScript && iframeSrc" type="text/javascript" [src]="resizeScript"></script>
--- a/src/core/features/sharedfiles/components/list/list.html
+++ b/src/core/features/sharedfiles/components/list/list.html
@ -6,7 +6,7 @@
 <core-site-picker *ngIf="showSitePicker" [hidden]="!filesLoaded" [initialSite]="siteId" (siteSelected)="changeSite($event)">
 </core-site-picker>

-<core-loading [hideUntil]="filesLoaded" class="core-loading-center">
+<core-loading [hideUntil]="filesLoaded" [fullscreen]="false">
    <ion-list *ngIf="files && files.length > 0">
        <ng-container *ngFor="let file of files; let idx = index">
            <core-local-file *ngIf="file.isFile" [file]="file" [manage]="manage" [overrideClick]="pick"
--- a/src/core/features/sharedfiles/services/handlers/upload.ts
+++ b/src/core/features/sharedfiles/services/handlers/upload.ts
@ -59,7 +59,7 @@ export class CoreSharedFilesUploadHandlerService implements CoreFileUploaderHand
        return {
            title: 'core.sharedfiles.sharedfiles',
            class: 'core-sharedfiles-fileuploader-handler',
-            icon: 'folder',
+            icon: 'fas-folder',
            action: (
                maxSize?: number,
                upload?: boolean,
--- a/src/core/features/siteplugins/components/plugin-content/core-siteplugins-plugin-content.html
+++ b/src/core/features/siteplugins/components/plugin-content/core-siteplugins-plugin-content.html
@ -1,4 +1,4 @@
-<core-loading [hideUntil]="dataLoaded" class="core-loading-center">
+<core-loading [hideUntil]="dataLoaded" [fullscreen]="false">
    <core-compile-html [text]="content" [javascript]="javascript" [jsData]="jsData" [forceCompile]="forceCompile" #compile>
    </core-compile-html>
 </core-loading>