MDL-68417 core_table: add some css styling to loading icon

diff --git a/lib/tablelib.php b/lib/tablelib.php
index 6cb2a6b..2c46b2f 100644 (file)
--- a/lib/tablelib.php
+++ b/lib/tablelib.php
@@ -1645,6 +1645,7 @@ class flexible_table {
         if (is_a($this, \core_table\dynamic::class)) {
             $sortdata = $this->get_sort_order();
             return html_writer::start_tag('div', [
+                'class' => 'table-dynamic position-relative',
                 'data-region' => 'core_table/dynamic',
                 'data-table-handler' => $this->get_handler(),
                 'data-table-component' => $this->get_component(),

diff --git a/theme/boost/scss/moodle/tables.scss b/theme/boost/scss/moodle/tables.scss
index d5e8939..f27cd9b 100644 (file)
--- a/theme/boost/scss/moodle/tables.scss
+++ b/theme/boost/scss/moodle/tables.scss
@@ -46,3 +46,14 @@ table {
         caption-side: top;
     }
 }
+
+.table-dynamic .loading-icon {
+    position: absolute;
+    left: calc(50% - 1.5rem);
+    top: 200px;
+    .icon {
+        height: 3rem;
+        width: 3rem;
+        font-size: 3rem;
+    }
+}

diff --git a/theme/boost/style/moodle.css b/theme/boost/style/moodle.css
index 74d9792..c4a80c0 100644 (file)
--- a/theme/boost/style/moodle.css
+++ b/theme/boost/style/moodle.css
@@ -17168,6 +17168,15 @@ table caption {
   text-align: left;
   caption-side: top; }
 
+.table-dynamic .loading-icon {
+  position: absolute;
+  left: calc(50% - 1.5rem);
+  top: 200px; }
+  .table-dynamic .loading-icon .icon {
+    height: 3rem;
+    width: 3rem;
+    font-size: 3rem; }
+
 .singlebutton {
   display: inline-block; }
   .singlebutton + .singlebutton {

diff --git a/theme/classic/style/moodle.css b/theme/classic/style/moodle.css
index 42a7c53..fd7b76f 100644 (file)
--- a/theme/classic/style/moodle.css
+++ b/theme/classic/style/moodle.css
@@ -17400,6 +17400,15 @@ table caption {
   text-align: left;
   caption-side: top; }
 
+.table-dynamic .loading-icon {
+  position: absolute;
+  left: calc(50% - 1.5rem);
+  top: 200px; }
+  .table-dynamic .loading-icon .icon {
+    height: 3rem;
+    width: 3rem;
+    font-size: 3rem; }
+
 .singlebutton {
   display: inline-block; }
   .singlebutton + .singlebutton {