MDL-75671 theme_boost: Refactor float classes for BS5

- Add SCSS code for float  utility classes to the Boostrap 5 bridge SCSS file
- Replace all occurrences in the codebase (float-left > float-start, float-sm-right > float-sm-end, ...)

admin/roles/classes/define_role_table_advanced.php

@@ -655,7 +655,7 @@ protected function print_field($name, $caption, $field, $helpicon = null) {
             echo "</label>\n";
         }
         if ($helpicon) {
-            echo '<span class="float-sm-right text-nowrap">'.$helpicon.'</span>';
+            echo '<span class="float-sm-end text-nowrap">'.$helpicon.'</span>';
         }
         echo '</div>';
         if (isset($this->errors[$name])) {

admin/tool/admin_presets/templates/export_import.mustache

@@ -40,7 +40,7 @@
     }
 }}
 
-<div class="mt-2 mb-1 float-right">
+<div class="mt-2 mb-1 float-end">
     {{#export}}{{> core/single_button}}{{/export}}
     {{#import}}{{> core/single_button}}{{/import}}
 </div>

admin/tool/componentlibrary/content/bootstrap/components/forms.md

@@ -383,7 +383,7 @@ At times, you maybe need to use margin or padding utilities to create that perfe
     </div>
   </div>
   <fieldset class="form-group row">
-    <legend class="col-form-label col-sm-2 float-sm-left pt-0">Radios</legend>
+    <legend class="col-form-label col-sm-2 float-sm-start pt-0">Radios</legend>
     <div class="col-sm-10">
       <div class="form-check">
         <input class="form-check-input" type="radio" name="gridRadios" id="gridRadios1" value="option1" checked>

admin/tool/componentlibrary/content/bootstrap/components/spinners.md

@@ -105,7 +105,7 @@ Use [flexbox utilities][flex], [float utilities][float], or [text alignment][tex
 
 {{< example >}}
 <div class="clearfix">
-  <div class="spinner-border float-right" role="status">
+  <div class="spinner-border float-end" role="status">
     <span class="sr-only">Loading...</span>
   </div>
 </div>

admin/tool/componentlibrary/content/bootstrap/content/images.md

@@ -33,8 +33,8 @@ In addition to our [border-radius utilities]({{< docsref "/utilities/borders" >}
 Align images with the [helper float classes]({{< docsref "/utilities/float" >}}) or [text alignment classes]({{< docsref "/utilities/text#text-alignment" >}}). `block`-level images can be centered using [the `.mx-auto` margin utility class]({{< docsref "/utilities/spacing#horizontal-centering" >}}).
 
 {{< example >}}
-{{< placeholder width="200" height="200" class="rounded float-left" >}}
-{{< placeholder width="200" height="200" class="rounded float-right" >}}
+{{< placeholder width="200" height="200" class="rounded float-start" >}}
+{{< placeholder width="200" height="200" class="rounded float-end" >}}
 {{< /example >}}
 
 {{< example >}}

admin/tool/componentlibrary/content/bootstrap/utilities/clearfix.md

@@ -31,7 +31,7 @@ The following example shows how the clearfix can be used. Without the clearfix t
 
 {{< example >}}
 <div class="bg-info clearfix">
-  <button type="button" class="btn btn-secondary float-left">Example Button floated left</button>
-  <button type="button" class="btn btn-secondary float-right">Example Button floated right</button>
+  <button type="button" class="btn btn-secondary float-start">Example Button floated left</button>
+  <button type="button" class="btn btn-secondary float-end">Example Button floated right</button>
 </div>
 {{< /example >}}

admin/tool/componentlibrary/content/bootstrap/utilities/float.md

@@ -15,8 +15,8 @@ These utility classes float an element to the left or right, or disable floating
 Toggle a float with a class:
 
 {{< example >}}
-<div class="float-left">Float left on all viewport sizes</div><br>
-<div class="float-right">Float right on all viewport sizes</div><br>
+<div class="float-start">Float left on all viewport sizes</div><br>
+<div class="float-end">Float right on all viewport sizes</div><br>
 <div class="float-none">Don't float on all viewport sizes</div>
 {{< /example >}}
 
@@ -41,10 +41,10 @@ Or by Sass mixin:
 Responsive variations also exist for each `float` value.
 
 {{< example >}}
-<div class="float-sm-left">Float left on viewports sized SM (small) or wider</div><br>
-<div class="float-md-left">Float left on viewports sized MD (medium) or wider</div><br>
-<div class="float-lg-left">Float left on viewports sized LG (large) or wider</div><br>
-<div class="float-xl-left">Float left on viewports sized XL (extra-large) or wider</div><br>
+<div class="float-sm-start">Float left on viewports sized SM (small) or wider</div><br>
+<div class="float-md-start">Float left on viewports sized MD (medium) or wider</div><br>
+<div class="float-lg-start">Float left on viewports sized LG (large) or wider</div><br>
+<div class="float-xl-start">Float left on viewports sized XL (extra-large) or wider</div><br>
 {{< /example >}}
 
 Here are all the support classes;

admin/tool/dataprivacy/templates/data_deletion.mustache

@@ -58,13 +58,13 @@
         <div class="alert alert-info">
             {{#str}}datadeletionpagehelp, tool_dataprivacy{{/str}}
         </div>
-        <div class="float-left">
+        <div class="float-start">
             {{#filter}}
                 {{> core/single_select}}
             {{/filter}}
         </div>
         {{#existingcontexts}}
-            <div class="float-right">
+            <div class="float-end">
                 <button data-action="markfordeletion" class="btn btn-secondary">{{#str}}deleteselected, moodle{{/str}}</button>
             </div>
         {{/existingcontexts}}
@@ -74,7 +74,7 @@
     </div>
     <div class="row" data-region="bottom-nav">
         {{#existingcontexts}}
-            <div class="float-right">
+            <div class="float-end">
                 <button data-action="markfordeletion" class="btn btn-secondary">{{#str}}deleteselected, moodle{{/str}}</button>
             </div>
         {{/existingcontexts}}

admin/tool/dataprivacy/templates/data_registry_compliance.mustache

@@ -51,7 +51,7 @@
         <dd>{{#str}}userlistexplanation, tool_dataprivacy{{/str}}</dd>
     </dl>
     <hr />
-    <div class="clearfix"><a class="tool_dataprivacy-expand-all float-right" href="#" data-visibility-state='visible'>{{#str}}visible, tool_dataprivacy{{/str}}</a></div>
+    <div class="clearfix"><a class="tool_dataprivacy-expand-all float-end" href="#" data-visibility-state='visible'>{{#str}}visible, tool_dataprivacy{{/str}}</a></div>
     {{#types}}
     <div>
         <div>

admin/tool/dataprivacy/templates/data_requests.mustache

@@ -61,7 +61,7 @@
 
 <div data-region="datarequests">
     <div class="mt-1 mb-1">
-        <div class="float-right">
+        <div class="float-end">
             <a href="{{newdatarequesturl}}" class="btn btn-primary" data-action="new-request">
                 {{#str}}newrequest, tool_dataprivacy{{/str}}
             </a>

admin/tool/dataprivacy/templates/data_requests_bulk_actions.mustache

@@ -45,15 +45,15 @@
     }
 }}
 <div class="mt-1 d-inline-block w-100">
-    <div class="float-left">
+    <div class="float-start">
         <select id="bulk-action" class="select custom-select">
         {{#options}}
             <option value="{{ value }}">{{ name }}</option>
         {{/options}}
         </select>
         <button class="btn btn-primary" id="confirm-bulk-action">{{# str}} confirm {{/ str}}</button>
     </div>
-    <div class="float-right">
+    <div class="float-end">
         {{{ perpage }}}
     </div>
 </div>

admin/tool/dataprivacy/templates/request_details.mustache

@@ -66,15 +66,15 @@
             </h4>
             <a href="mailto:{{foruser.email}}">{{foruser.email}}</a>
             <div class="clearfix mt-1 mb-1">
-            <span class="float-left me-1">
+            <span class="float-start me-1">
                 <strong>{{#str}}daterequesteddetail, tool_dataprivacy{{/str}}</strong>
                 {{#userdate}} {{timecreated}}, {{#str}} strftimedatetime, core_langconfig {{/str}} {{/userdate}}
             </span>
-                <span class="float-left me-1">
+                <span class="float-start me-1">
                 <strong>{{#str}}statusdetail, tool_dataprivacy{{/str}}</strong>
                 <span class="badge {{statuslabelclass}}">{{statuslabel}}</span>
             </span>
-            <span class="float-left me-1">
+            <span class="float-start me-1">
                 <strong>{{#str}}requestbydetail, tool_dataprivacy{{/str}}</strong>
                 <span><a href="{{requestedbyuser.profileurl}}" title="{{#str}}viewprofile{{/str}}">{{requestedbyuser.fullname}}</a></span>
             </span>

admin/tool/lp/templates/competencies_move_tree.mustache

@@ -53,7 +53,7 @@
 </ul>
 </div>
 
-<div data-region="move-buttons" class="float-sm-right">
+<div data-region="move-buttons" class="float-sm-end">
     <input type="button" data-action="move" class="btn btn-primary" value="{{#str}}move{{/str}}"/>
     <input type="button" data-action="cancel" class="btn btn-secondary" value="{{#str}}cancel{{/str}}"/>
 </div>

admin/tool/lp/templates/competency_grader.mustache

@@ -50,7 +50,7 @@
                 <textarea name="comment" id="comment_{{uniqid}}" class="form-control mb-1"></textarea>
             </div>
         </div>
-        <div data-region="footer" class="float-sm-right">
+        <div data-region="footer" class="float-sm-end">
             <button data-action="rate" class="btn btn-primary">{{#str}}rate, tool_lp{{/str}}</button>
             <button data-action="cancel" class="btn btn-secondary">{{#str}}cancel{{/str}}</button>
         </div>

admin/tool/lp/templates/competency_picker.mustache

@@ -78,7 +78,7 @@
         </ul>
     </li>
 </ul>
-<div data-region="link-buttons" class="mt-1 float-sm-right">
+<div data-region="link-buttons" class="mt-1 float-sm-end">
     <input type="button" class="btn btn-primary" data-action="add" value="{{#str}}add{{/str}}"/>
     <input type="button" class="btn btn-secondary" data-action="cancel" value="{{#str}}cancel{{/str}}"/>
 </div>

admin/tool/lp/templates/competency_picker_competencyform.mustache

@@ -60,7 +60,7 @@
         </ul>
     </li>
 </ul>
-<div data-region="link-buttons" class="mt-1 float-sm-right">
+<div data-region="link-buttons" class="mt-1 float-sm-end">
     <input type="button" class="btn btn-primary" data-action="add" value="{{#str}}select{{/str}}"/>
     <input type="button" class="btn btn-secondary" data-action="cancel" value="{{#str}}cancel{{/str}}"/>
 </div>

admin/tool/lp/templates/competency_picker_user_plans.mustache

@@ -84,7 +84,7 @@
     </li>
 </ul>
 
-<div data-region="link-buttons" class="mt-1 float-sm-right">
+<div data-region="link-buttons" class="mt-1 float-sm-end">
     <input type="button" class="btn btn-primary" data-action="add" value="{{#str}}add{{/str}}"/>
     <input type="button" class="btn btn-secondary" data-action="cancel" value="{{#str}}cancel{{/str}}"/>
 </div>

admin/tool/lp/templates/competency_plan_navigation.mustache

@@ -32,7 +32,7 @@
 
     // No example context because the JS is connected to webservices
 }}
-<div class="float-sm-right border p-2 mb-2">
+<div class="float-sm-end border p-2 mb-2">
 {{#hascompetencies}}
 <span>
 <label for="competency-nav-{{uniqid}}" class="accesshide">{{#str}}jumptocompetency, tool_lp{{/str}}</label>

admin/tool/lp/templates/competency_rule_config.mustache

@@ -81,7 +81,7 @@
         {{/config}}
     </div>
 
-    <div data-region="footer" class="float-sm-right mt-1">
+    <div data-region="footer" class="float-sm-end mt-1">
         {{#config}}
         <input type="button" class="btn btn-primary" data-action="save" value="{{#str}}savechanges{{/str}}"/>
         {{/config}}

admin/tool/lp/templates/competency_summary.mustache

@@ -70,7 +70,7 @@
 <p>{{{competency.description}}}</p>
 {{/competency.description}}
 {{#comppath}}
-    <span class="float-left">{{#str}}path, tool_lp{{/str}}&nbsp;</span>{{> tool_lp/competency_path }}
+    <span class="float-start">{{#str}}path, tool_lp{{/str}}&nbsp;</span>{{> tool_lp/competency_path }}
 {{/comppath}}
 {{#showrelatedcompetencies}}
     {{> tool_lp/related_competencies }}

admin/tool/lp/templates/course_competencies_page.mustache

@@ -25,7 +25,7 @@
 }}
 <div data-region="coursecompetenciespage">
     <div data-region="actions" class="clearfix">
-        <div class="float-sm-left">
+        <div class="float-sm-start">
             {{#canmanagecoursecompetencies}}
                 <button class="btn btn-secondary" disabled>{{#str}}addcoursecompetencies, tool_lp{{/str}}</button>
             {{/canmanagecoursecompetencies}}
@@ -61,8 +61,8 @@
     <tr class="drag-samenode" data-id="{{competency.id}}">
     <td>
         {{#canmanagecoursecompetencies}}
-        <span class="drag-handlecontainer float-sm-left"></span>
-        <div class="float-sm-right">
+        <span class="drag-handlecontainer float-sm-start"></span>
+        <div class="float-sm-end">
             <a href="#" data-action="delete-competency-link" data-id="{{competency.id}}">
                 {{#pix}}t/delete, core, {{#str}}delete{{/str}}{{/pix}}
             </a>
@@ -78,7 +78,7 @@
             <p>{{{competency.description}}}</p>
         {{/competency}}
         {{#comppath}}
-            <span class="float-sm-left">{{#str}}path, tool_lp{{/str}}&nbsp;</span>{{> tool_lp/competency_path }}
+            <span class="float-sm-start">{{#str}}path, tool_lp{{/str}}&nbsp;</span>{{> tool_lp/competency_path }}
         {{/comppath}}
         {{#usercompetencycourse}}
             {{#grade}}

admin/tool/lp/templates/course_competency_settings.mustache

@@ -49,7 +49,7 @@
         </label>
 
     </fieldset>
-    <fieldset class="float-sm-right">
+    <fieldset class="float-sm-end">
         <input type="button" class="btn btn-primary" data-action="save" value="{{#str}}savechanges{{/str}}"/>
         <input type="button" class="btn btn-secondary" data-action="cancel" value="{{#str}}cancel{{/str}}"/>
     </fieldset>

admin/tool/lp/templates/evidence_summary.mustache

@@ -46,7 +46,7 @@
 }}
 <div class="border p-2 mb-2 evidence" data-region="evidence" data-id="{{id}}">
     {{#candelete}}
-        <div class="float-sm-right">
+        <div class="float-sm-end">
             <a href="#" data-action="delete-evidence">{{#pix}}t/delete{{/pix}}</a>
         </div>
     {{/candelete}}

admin/tool/lp/templates/form_competency_list.mustache

@@ -48,7 +48,7 @@
 <ul>
     {{#competencies}}
         <li>
-            <div class="float-right">
+            <div class="float-end">
                 <a href="#" data-action="deselect-competency" data-id="{{id}}">{{#pix}}t/delete, core, {{#str}}delete{{/str}}{{/pix}}</a>
             </div>
             <p>

admin/tool/lp/templates/manage_competencies_page.mustache

@@ -68,7 +68,7 @@
             <div class="border p-2 mb-2">
                 <div class="card-title">
                     <h4 data-region="selected-competency">{{#str}}selectedcompetency, tool_lp{{/str}}</h4>
-                        <span data-region="competencyactionsmenu" class="float-sm-right">
+                        <span data-region="competencyactionsmenu" class="float-sm-end">
                             <ul title="{{#str}}edit{{/str}}" class="competencyactionsmenu">
                                 <li>
                                     <a href="#">{{#str}}edit{{/str}}</a><b class="caret"></b>

admin/tool/lp/templates/manage_competency_frameworks_page.mustache

@@ -34,7 +34,7 @@
     * navigation - array of strings containing buttons for navigation
 }}
 <div data-region="managecompetencies">
-<div class="float-left">
+<div class="float-start">
     {{#navigation}}
     {{{.}}}
     {{/navigation}}

admin/tool/lp/templates/manage_templates_page.mustache

@@ -32,7 +32,7 @@
     * navigation - array of strings containing buttons for navigation
 }}
 <div data-region="managetemplates">
-<div class="float-left">
+<div class="float-start">
     {{#navigation}}
     {{{.}}}
     {{/navigation}}

admin/tool/lp/templates/module_navigation.mustache

@@ -28,7 +28,7 @@
 
     // No example context because the JS is connected to webservices
 }}
-<div class="float-right border mb-2 p-2">
+<div class="float-end border mb-2 p-2">
 <form class="user-competency-course-navigation">
 <input type="hidden" name="courseid" value="{{courseid}}"/>
 <input type="hidden" name="mod" value="{{moduleid}}"/>

admin/tool/lp/templates/plan_page.mustache

@@ -26,7 +26,7 @@
     </h2>
     {{#plan.canbeedited}}
     <div data-region="actions" class="clearfix">
-        <div class="float-left">
+        <div class="float-start">
             <!-- Button to add competencies to the plan -->
             <button class="btn btn-secondary" data-action="add">{{#pix}}t/add{{/pix}} {{#str}}addcompetency, tool_lp{{/str}}</button>
         </div>
@@ -129,13 +129,13 @@
                         data-userid="{{plan.userid}}">
                     <td>
                         {{#plan.canbeedited}}
-                        <span class="drag-handlecontainer float-left"></span>
+                        <span class="drag-handlecontainer float-start"></span>
                         {{/plan.canbeedited}}
                         <a data-usercompetency="true" href="#">{{{competency.shortname}}}</a>
                         <em>{{competency.idnumber}}</em>
                         {{#comppath}}
                             <br>
-                            <span class="float-left">{{#str}}path, tool_lp{{/str}}&nbsp;</span>{{> tool_lp/competency_path }}
+                            <span class="float-start">{{#str}}path, tool_lp{{/str}}&nbsp;</span>{{> tool_lp/competency_path }}
                         {{/comppath}}
                     </td>
                     {{#plan.iscompleted}}

admin/tool/lp/templates/plans_page.mustache

@@ -34,7 +34,7 @@
 }}
 
 <div data-region="plans">
-<div class="float-left">
+<div class="float-start">
     {{#navigation}}
     {{{.}}}
     {{/navigation}}
@@ -155,7 +155,7 @@
 {{/plans}}
 
 {{#canreaduserevidence}}
-<div class="float-left">
+<div class="float-start">
     <a href="{{pluginbaseurl}}/user_evidence_list.php?userid={{userid}}">{{#str}}userevidence, tool_lp{{/str}}</a>
 </div>
 {{/canreaduserevidence}}

admin/tool/lp/templates/related_competencies.mustache

@@ -54,7 +54,7 @@
     {{#relatedcompetencies}}
         <li>
             {{#showdeleterelatedaction}}
-                <div class="float-sm-right">
+                <div class="float-sm-end">
                     <a href="#" data-action="deleterelation" id="id-related-{{id}}">{{#pix}}t/delete, core, {{#str}}delete{{/str}}{{/pix}}</a>
                 </div>
             {{/showdeleterelatedaction}}

admin/tool/lp/templates/scale_configuration_page.mustache

@@ -58,7 +58,7 @@
 </table>
 </div>
 
-<div data-region="scale-buttons" class="mt-1 float-sm-right">
+<div data-region="scale-buttons" class="mt-1 float-sm-end">
     <input type="button" class="btn btn-secondary" data-action="close" value="{{#str}}closebuttontitle{{/str}}"/>
     <input type="button" class="btn btn-secondary" data-action="cancel" value="{{#str}}cancel{{/str}}"/>
 </div>

admin/tool/lp/templates/template_competencies_page.mustache

@@ -41,8 +41,8 @@
                 <div class="drag-samenode" data-id="{{competency.id}}">
                     <div class="border p-2 mb-2">
                         {{#canmanagetemplatecompetencies}}
-                        <span class="drag-handlecontainer float-left"></span>
-                        <div class="float-sm-right">
+                        <span class="drag-handlecontainer float-start"></span>
+                        <div class="float-sm-end">
                             <a href="#" data-action="delete-competency-link" data-id="{{competency.id}}">{{#pix}}t/delete, core, {{#str}}delete{{/str}}{{/pix}}</a>
                         </div>
                         {{/canmanagetemplatecompetencies}}