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 69824078c..613c62a6e 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
@@ -1,15 +1,16 @@
- 1" (click)="openModePicker($event)"
+ 1" (click)="openModePicker($event)"
[attr.aria-label]="'addon.mod_glossary.browsemode' | translate">
-
+
-
+
@@ -77,7 +78,7 @@
-
+
{{ 'addon.mod_glossary.addentry' | translate }}
diff --git a/src/core/components/loading/loading.scss b/src/core/components/loading/loading.scss
index e6cebfac7..4f0a58034 100644
--- a/src/core/components/loading/loading.scss
+++ b/src/core/components/loading/loading.scss
@@ -3,9 +3,9 @@
@mixin inline() {
min-height: var(--internal-loading-inline-min-height);
max-height: 100vh; // In order show it on the page (content will be cut).
+ position: relative;
&:not(.core-loading-loaded) {
- position: relative;
--contents-display: flex;
flex-direction: column;
}
@@ -15,6 +15,7 @@
flex-direction: row;
height: auto;
width: auto;
+ position: absolute;
.core-loading-message {
@include margin(0, 0, 0, 10px);
@@ -32,14 +33,14 @@
--internal-loading-inline-min-height: var(--loading-inline-min-height);
--loading-display: flex;
--loading-display-message: block;
- --contents-display: contents;
+ --contents-display: block;
@include core-transition(all, 200ms);
pointer-events: none;
display: var(--contents-display);
&.core-loading-loaded {
- position: static;
+ --contents-display: contents;
pointer-events: auto;
--internal-loading-inline-min-height: 0px;
@@ -52,11 +53,11 @@
.core-loading-container {
pointer-events: none;
- position: absolute;
+ position: fixed;
@include position(0, 0, 0, 0);
height: 100%;
width: 100%;
- z-index: 3;
+ z-index: 100;
margin: 0;
padding: 0;
color: var(--loading-text-color);
@@ -101,4 +102,6 @@
:host-context(.ios) {
--contents-display: flex;
flex-direction: column;
+ max-height: max-content;
+ width: 100%;
}