Moved course enrolment icon over course image.

trema-tech · May 19, 2024 · 0993b4f · 0993b4f
1 parent 018db13
commit 0993b4f
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 3 deletions.
diff --git a/classes/output/core/course_renderer.php b/classes/output/core/course_renderer.php
@@ -247,19 +247,18 @@ protected function coursecat_coursebox_content(coursecat_helper $chelper, $cours
         $content .= '<h3 class="h5 card-title m-1">' . $coursenamelink . '</h4>';
         $content .= html_writer::end_tag('div');
 
-        $content .= html_writer::start_tag('div', ['class' => 'card-block text-center']);
-
         // Print enrolmenticons.
+        $content .= html_writer::start_tag('div', ['class' => 'enrolmenticon']);
         if ($icons = enrol_get_course_info_icons($course)) {
             foreach ($icons as $pixicon) {
                 $content .= $this->render($pixicon);
             }
         }
+        $content .= html_writer::end_tag('div'); // End enrolment icon.
 
         $content .= html_writer::start_tag('div', ['class' => 'pull-right']);
         $content .= html_writer::end_tag('div'); // End pull-right.
 
-        $content .= html_writer::end_tag('div'); // End card-block.
 
         // Display course contacts. See core_course_list_element::get_course_contacts().
         if ($showcardcontact && $course->has_course_contacts()) {

diff --git a/scss/trema/courselist.scss b/scss/trema/courselist.scss
@@ -39,6 +39,18 @@
             height: auto;
         }
     }
+
+    .enrolmenticon {
+        position: absolute;
+        background-color: rgba(255, 255, 255, .9);
+        top: 72px;
+        left: 8px;
+        border-radius: $softness;
+        .img, .icon {
+            padding: 4px;
+            margin: 0px;
+       }
+    }
 }
 
 body #page .card-see-more .btn {