Upgrade to Bootstrap 5.3.9

README.md

@@ -7,7 +7,7 @@
 The [Bootstrap extension][mw-bootstrap] provides the
 [Bootstrap web front-end framework][bootstrap] to skins and extensions.
 
-This version of the extension provides Bootstrap 5.3.8 and Popper 2.11.8.
+This version of the extension provides Bootstrap 5.3.9 and Popper 2.11.8.
 
 ## Requirements
 

docs/release-notes.md

@@ -1,5 +1,11 @@
 ## Release Notes
 
+### MediaWiki Bootstrap 6.0.1
+
+Under development.
+
+* Upgraded Bootstrap from 5.3.8 to 5.3.9 (thanks @malberts)
+
 ### MediaWiki Bootstrap 6.0.0
 
 Released on May 19, 2026.

package.json

@@ -7,7 +7,7 @@
 		"install": "mkdir -p resources/bootstrap/js && cp -R node_modules/bootstrap/scss resources/bootstrap && cp -R node_modules/bootstrap/dist/js/bootstrap.bundle.js* resources/bootstrap/js"
 	},
 	"dependencies": {
-		"bootstrap": "^5.3.8"
+		"bootstrap": "^5.3.9"
 	},
 	"devDependencies": {}
 }

resources/bootstrap/scss/_modal.scss

@@ -197,17 +197,25 @@
 
 @include media-breakpoint-up(lg) {
   .modal-lg,
-  .modal-xl {
+  .modal-xl,
+  .modal-xxl {
     --#{$prefix}modal-width: #{$modal-lg};
   }
 }
 
 @include media-breakpoint-up(xl) {
-  .modal-xl {
+  .modal-xl,
+  .modal-xxl {
     --#{$prefix}modal-width: #{$modal-xl};
   }
 }
 
+@include media-breakpoint-up(xxl) {
+  .modal-xxl {
+    --#{$prefix}modal-width: #{$modal-xxl};
+  }
+}
+
 // scss-docs-start modal-fullscreen-loop
 @each $breakpoint in map-keys($grid-breakpoints) {
   $infix: breakpoint-infix($breakpoint, $grid-breakpoints);

resources/bootstrap/scss/_placeholders.scss

@@ -29,6 +29,12 @@
 .placeholder-glow {
   .placeholder {
     animation: placeholder-glow 2s ease-in-out infinite;
+
+    @if $enable-reduced-motion {
+      @media (prefers-reduced-motion: reduce) {
+        animation: none;
+      }
+    }
   }
 }
 
@@ -42,6 +48,12 @@
   mask-image: linear-gradient(130deg, $black 55%, rgba(0, 0, 0, (1 - $placeholder-opacity-min)) 75%, $black 95%);
   mask-size: 200% 100%;
   animation: placeholder-wave 2s linear infinite;
+
+  @if $enable-reduced-motion {
+    @media (prefers-reduced-motion: reduce) {
+      animation: none;
+    }
+  }
 }
 
 @keyframes placeholder-wave {

resources/bootstrap/scss/_reboot.scss

@@ -513,7 +513,7 @@ legend {
 
 ::-webkit-datetime-edit-fields-wrapper,
 ::-webkit-datetime-edit-text,
-::-webkit-datetime-edit-minute,
+::-webkit-datetime-edit-minute-field,
 ::-webkit-datetime-edit-hour-field,
 ::-webkit-datetime-edit-day-field,
 ::-webkit-datetime-edit-month-field,

resources/bootstrap/scss/_variables.scss

@@ -1533,6 +1533,7 @@ $modal-sm:                          300px !default;
 $modal-md:                          500px !default;
 $modal-lg:                          800px !default;
 $modal-xl:                          1140px !default;
+$modal-xxl:                         1320px !default;
 
 $modal-fade-transform:              translate(0, -50px) !default;
 $modal-show-transform:              none !default;

resources/bootstrap/scss/mixins/_banner.scss

@@ -1,7 +1,7 @@
 @mixin bsBanner($file) {
   /*!
-   * Bootstrap #{$file} v5.3.8 (https://getbootstrap.com/)
-   * Copyright 2011-2025 The Bootstrap Authors
+   * Bootstrap #{$file} v5.3.9 (https://getbootstrap.com/)
+   * Copyright 2011-2026 The Bootstrap Authors
    * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
    */
 }

resources/bootstrap/scss/mixins/_table-variants.scss

@@ -11,11 +11,11 @@
     --#{$prefix}table-bg: #{$background};
     --#{$prefix}table-border-color: #{$table-border-color};
     --#{$prefix}table-striped-bg: #{$striped-bg};
-    --#{$prefix}table-striped-color: #{color-contrast($striped-bg)};
+    --#{$prefix}table-striped-color: #{color-contrast($striped-bg)}; // stylelint-disable-line scss/dollar-variable-no-missing-interpolation
     --#{$prefix}table-active-bg: #{$active-bg};
-    --#{$prefix}table-active-color: #{color-contrast($active-bg)};
+    --#{$prefix}table-active-color: #{color-contrast($active-bg)}; // stylelint-disable-line scss/dollar-variable-no-missing-interpolation
     --#{$prefix}table-hover-bg: #{$hover-bg};
-    --#{$prefix}table-hover-color: #{color-contrast($hover-bg)};
+    --#{$prefix}table-hover-color: #{color-contrast($hover-bg)}; // stylelint-disable-line scss/dollar-variable-no-missing-interpolation
 
     color: var(--#{$prefix}table-color);
     border-color: var(--#{$prefix}table-border-color);