MDL-73908 block_calendar_upcoming: new mod icons

blocks/timeline/styles.css

@@ -16,11 +16,6 @@
 #block-region-side-pre .block_timeline h6.event-action a.btn {
     width: auto;
 }
-/* Override the width/height of the .activityiconcontainer class in the timeline block. */
-.block_timeline .activityiconcontainer {
-    width: 40px;
-    height: 40px;
-}
 
 .block_timeline .timeline-action-button {
     margin-left: auto;

blocks/timeline/templates/event-list-item.mustache

@@ -53,7 +53,7 @@
             <small class="text-right text-nowrap align-self-center ml-1">
                 {{#userdate}} {{timesort}}, {{#str}} strftimetime24, core_langconfig {{/str}} {{/userdate}}
             </small>
-            <div class="activityiconcontainer {{purpose}} courseicon align-self-top align-self-center mx-3  mb-1 mb-sm-0 text-nowrap">
+            <div class="activityiconcontainer small {{purpose}} courseicon align-self-top align-self-center mx-3  mb-1 mb-sm-0 text-nowrap">
                 {{#icon}}{{#pix}} {{key}}, {{component}}, {{alttext}} {{/pix}}{{/icon}}
             </div>
             <div class="event-name-container flex-grow-1 line-height-3 nowrap text-truncate">

calendar/templates/upcoming_mini.mustache

@@ -40,19 +40,25 @@
     {{> core/overlay_loading}}
     {{#events}}
         <div{{!
-            }} class="event"{{!
+            }} class="event d-flex border-bottom pt-2 pb-3"{{!
             }} data-eventtype-{{normalisedeventtype}}="1"{{!
             }} data-region="event-item"{{!
         }}>
-            <span>{{#icon}}{{#pix}} {{key}}, {{component}}, {{alttext}} {{/pix}}{{/icon}}</span>
-            <a{{!
-                }} data-type="event"{{!
-                }} data-action="view-event"{{!
-                }} data-event-id="{{id}}"{{!
-                }} href="{{viewurl}}"{{!
-            }}>{{{name}}}</a>
-            <div class="date">{{{formattedtime}}}</div>
-            <hr>
+            <div class="activityiconcontainer small {{{purpose}}} courseicon mr-3">
+                {{#icon}}{{#pix}} {{key}}, {{component}}, {{alttext}} {{/pix}}{{/icon}}
+            </div>
+            <div class="overflow-auto">
+                <h6 class="d-flex mb-1">
+                    <a{{!
+                        }} class="text-truncate"{{!
+                        }} data-type="event"{{!
+                        }} data-action="view-event"{{!
+                        }} data-event-id="{{id}}"{{!
+                        }} href="{{viewurl}}"{{!
+                    }}>{{{name}}}</a>
+                </h6>
+                <div class="date small">{{{formattedtime}}}</div>
+            </div>
         </div>
     {{/events}}
     {{^events}}

theme/boost/scss/moodle/blocks.scss

@@ -244,7 +244,6 @@ $card-gutter : $card-deck-margin * 2;
     }
 }
 
-
 .block_recentlyaccessedcourses {
     .paging-bar-container {
         margin-top: -2.4rem;

theme/boost/scss/moodle/icons.scss

@@ -140,6 +140,10 @@ $iconsizes: map-merge((
         height: 24px;
         width: 24px;
     }
+    &.small {
+        width: $activity-iconcontainer-width - 10px;
+        height: $activity-iconcontainer-height - 10px;
+    }
 }
 
 @each $type, $value in $activity-icon-colors {

theme/boost/style/moodle.css

@@ -12359,6 +12359,9 @@ body.dragging .dragging {
     margin: 0;
     height: 24px;
     width: 24px; }
+  .activityiconcontainer.small {
+    width: 40px;
+    height: 40px; }
 
 .activityiconcontainer.administration {
   background-color: #5d63f6; }

theme/classic/style/moodle.css

@@ -12359,6 +12359,9 @@ body.dragging .dragging {
     margin: 0;
     height: 24px;
     width: 24px; }
+  .activityiconcontainer.small {
+    width: 40px;
+    height: 40px; }
 
 .activityiconcontainer.administration {
   background-color: #5d63f6; }