chore(merge main): patched commit → 7f8fed4 (#2594)

Author: julien-deramond

.eslintrc.json

@@ -98,7 +98,9 @@
     "unicorn/prefer-module": "off",
     "unicorn/prefer-query-selector": "off",
     "unicorn/prefer-spread": "off",
+    "unicorn/prefer-string-raw": "off",
     "unicorn/prefer-string-replace-all": "off",
+    "unicorn/prefer-structured-clone": "off",
     "unicorn/prevent-abbreviations": "off"
   },
   "overrides": [

package-lock.json

@@ -103,16 +103,16 @@
     "@popperjs/core": "^2.11.8"
   },
   "devDependencies": {
-    "@babel/cli": "^7.24.5",
-    "@babel/core": "^7.24.5",
-    "@babel/preset-env": "^7.24.5",
+    "@babel/cli": "^7.24.8",
+    "@babel/core": "^7.24.9",
+    "@babel/preset-env": "^7.24.8",
     "@docsearch/js": "^3.6.0",
     "@popperjs/core": "^2.11.8",
     "@rollup/plugin-babel": "^6.0.4",
-    "@rollup/plugin-commonjs": "^25.0.8",
+    "@rollup/plugin-commonjs": "^26.0.1",
     "@rollup/plugin-node-resolve": "^15.2.3",
-    "@rollup/plugin-replace": "^5.0.5",
-    "@stackblitz/sdk": "^1.9.0",
+    "@rollup/plugin-replace": "^5.0.7",
+    "@stackblitz/sdk": "^1.11.0",
     "@storybook/addon-a11y": "^8.2.2",
     "@storybook/addon-essentials": "^8.2.2",
     "@storybook/addon-themes": "^8.2.2",
@@ -130,14 +130,14 @@
     "eslint-config-xo": "^0.45.0",
     "eslint-plugin-html": "^8.1.1",
     "eslint-plugin-import": "^2.29.1",
-    "eslint-plugin-markdown": "^5.0.0",
+    "eslint-plugin-markdown": "^5.1.0",
     "eslint-plugin-storybook": "^0.8.0",
-    "eslint-plugin-unicorn": "^52.0.0",
+    "eslint-plugin-unicorn": "^54.0.0",
     "find-unused-sass-variables": "^6.0.0",
     "focus-visible": "^5.2.0",
     "globby": "^14.0.1",
     "hammer-simulator": "0.0.1",
-    "hugo-bin": "^0.123.3",
+    "hugo-bin": "^0.125.2",
     "ip": "^2.0.0",
     "jasmine": "^5.1.0",
     "jquery": "^3.7.1",
@@ -150,27 +150,27 @@
     "karma-jasmine": "^5.1.0",
     "karma-jasmine-html-reporter": "^2.1.0",
     "karma-rollup-preprocessor": "7.0.7",
-    "lockfile-lint": "^4.13.2",
-    "nodemon": "^3.1.3",
-    "npm-run-all2": "^6.1.2",
+    "lockfile-lint": "^4.14.0",
+    "nodemon": "^3.1.4",
+    "npm-run-all2": "^6.2.2",
     "ods-storybook-theme": "^1.1.0",
     "pa11y-ci": "^3.1.0",
     "pa11y-ci-reporter-html": "^6.0.2",
-    "postcss": "^8.4.38",
+    "postcss": "^8.4.39",
     "postcss-cli": "^11.0.0",
-    "rollup": "^4.18.0",
+    "rollup": "^4.18.1",
     "rollup-plugin-istanbul": "^5.0.0",
     "rtlcss": "^4.1.1",
-    "sass": "^1.77.4",
+    "sass": "^1.77.8",
     "sass-loader": "^14.2.1",
     "sass-true": "^8.0.0",
     "shelljs": "^0.8.5",
     "sirv-cli": "^2.0.2",
     "storybook": "^8.2.2",
-    "stylelint": "^16.6.1",
-    "stylelint-config-twbs-bootstrap": "^14.1.0",
+    "stylelint": "^16.7.0",
+    "stylelint-config-twbs-bootstrap": "^14.2.0",
     "tarteaucitronjs": "^1.19.0",
-    "terser": "^5.31.0",
+    "terser": "^5.31.2",
     "vnu-jar": "^23.4.11"
   },
   "files": [

package.json

@@ -24,21 +24,21 @@
   --#{$prefix}back-to-top-title-active-decoration: #{$link-decoration};
   // scss-docs-end back-to-top-css-vars
 
-  // scss-docs-start back-to-top-xl-css-vars
-  @include media-breakpoint-up(xl) {
-    --#{$prefix}back-to-top-right: #{$back-to-top-offset-right * 2};
-    --#{$prefix}back-to-top-bottom: #{$back-to-top-offset-bottom * 2};
-    --#{$prefix}back-to-top-link-offset-top: #{$back-to-top-link-offset-top-xl};
-  }
-  // scss-docs-end back-to-top-xl-css-vars
-
   position: absolute;
   top: var(--#{$prefix}back-to-top-top);
   right: var(--#{$prefix}back-to-top-right);
   bottom: var(--#{$prefix}back-to-top-bottom);
   z-index: var(--#{$prefix}back-to-top-zindex);
   pointer-events: none;
   background-color: transparent;
+
+  // scss-docs-start back-to-top-xl-css-vars
+  @include media-breakpoint-up(xl) {
+    --#{$prefix}back-to-top-right: #{$back-to-top-offset-right * 2};
+    --#{$prefix}back-to-top-bottom: #{$back-to-top-offset-bottom * 2};
+    --#{$prefix}back-to-top-link-offset-top: #{$back-to-top-link-offset-top-xl};
+  }
+  // scss-docs-end back-to-top-xl-css-vars
 }
 
 .back-to-top-link {

scss/_back-to-top.scss

@@ -152,8 +152,8 @@
 .carousel-control-next-icon {
   display: inline-block;
   background-color: var(--#{$prefix}control-bg); // OUDS mod
-  @include button-icon($carousel-control-icon-bg, $carousel-control-icon-width, $size: $carousel-control-icon-size, $position: subtract(50%, $spacer * .1) 50%); // OUDS mod
   @include border-radius(50%, 50%);
+  @include button-icon($carousel-control-icon-bg, $carousel-control-icon-width, $size: $carousel-control-icon-size, $position: subtract(50%, $spacer * .1) 50%); // OUDS mod
 }
 
 // OUDS mod

scss/_carousel.scss

@@ -63,8 +63,8 @@
 
   // When fading in the modal, animate it to slide down
   .modal.fade & {
-    @include transition($modal-transition);
     transform: $modal-fade-transform;
+    @include transition($modal-transition);
   }
   .modal.show & {
     transform: $modal-show-transform;

scss/_modal.scss

@@ -55,9 +55,9 @@
   // OUDS mod
   font-weight: var(--#{$prefix}navbar-font-weight);
   box-shadow: inset 0 calc(-1 * var(--#{$prefix}navbar-border-width)) 0 var(--#{$prefix}navbar-border-color); // stylelint-disable-line function-disallowed-list
+  @include gradient-bg(var(--#{$prefix}navbar-bg)); // OUDS mod: instead of `@include gradient-bg()`
   @include transition($navbar-transition);
   // End mod
-  @include gradient-bg(var(--#{$prefix}navbar-bg)); // OUDS mod: instead of `@include gradient-bg()`
 
   // OUDS mod: Difference between xs and md breakpoints
   // scss-docs-start orange-navbar-css-vars
@@ -155,11 +155,12 @@
 
   // No focus
   &:hover {
+    text-decoration: if($link-hover-decoration == underline, none, null);
+
     .title,
     .two-lined {
       color: var(--#{$prefix}navbar-brand-hover-color);
     }
-    text-decoration: if($link-hover-decoration == underline, none, null);
   }
 
   //// Orange's master logo

scss/_navbar.scss

@@ -26,16 +26,6 @@
 // null by default, thus nothing is generated.
 
 :root {
-  @if $font-size-root != null {
-    @include font-size(var(--#{$prefix}root-font-size));
-  }
-
-  @if $enable-smooth-scroll {
-    @media (prefers-reduced-motion: no-preference) {
-      scroll-behavior: smooth;
-    }
-  }
-
   // OUDS mod: Improve focus visibility when fixed/sticky header is used
   // See https://caniuse.com/?search=scroll-padding
   // scss-docs-start scroll-offset
@@ -48,6 +38,16 @@
   }
   // scss-docs-end scroll-offset
   // End mod
+
+  @if $font-size-root != null {
+    @include font-size(var(--#{$prefix}root-font-size));
+  }
+
+  @if $enable-smooth-scroll {
+    @media (prefers-reduced-motion: no-preference) {
+      scroll-behavior: smooth;
+    }
+  }
 }
 
 

scss/_reboot.scss

@@ -187,12 +187,6 @@
       filter: $form-switch-checked-filter; // OUDS mod
       border-color: $form-switch-checked-border-color;
 
-      &:focus {
-        &[data-focus-visible-added] {
-          @include focus-visible($color: $form-switch-checked-focus-outer, $box-color: $form-switch-checked-focus-inner);
-        }
-      }
-
       @if $enable-gradients {
         --#{$prefix}form-switch-bg: #{escape-svg($form-switch-checked-bg-image)}, var(--#{$prefix}gradient);
         background-position: $form-switch-checked-bg-position, 100%, 100% 0;
@@ -203,6 +197,12 @@
         background-size: $form-switch-checked-bg-size, $form-switch-bg-square-size 100%;
       }
 
+      &:focus {
+        &[data-focus-visible-added] {
+          @include focus-visible($color: $form-switch-checked-focus-outer, $box-color: $form-switch-checked-focus-inner);
+        }
+      }
+
       &:not(:disabled) {
         --#{$prefix}switch-gradient: #{linear-gradient(to right, $form-switch-checked-square-bg $form-switch-bg-square-size, transparent)};
       }

scss/forms/_form-check.scss

@@ -38,10 +38,10 @@
     }
 
     &:first-of-type {
-      @include button-icon($quantity-selector-icon-remove, $size: $quantity-selector-icon-width $quantity-selector-icon-remove-height, $pseudo: "after");
       order: -1;
       padding-right: $quantity-selector-btn-padding-x;
       border-right-width: 0;
+      @include button-icon($quantity-selector-icon-remove, $size: $quantity-selector-icon-width $quantity-selector-icon-remove-height, $pseudo: "after");
 
       &:focus {
         &[data-focus-visible-added] { // stylelint-disable-line selector-no-qualifying-type
@@ -51,8 +51,8 @@
       }
 
       &.btn-sm { // stylelint-disable-line selector-no-qualifying-type
-        @include button-icon($quantity-selector-icon-remove-sm, $width: 1rem, $height: 1rem, $size: $quantity-selector-icon-sm-width $quantity-selector-icon-sm-remove-height, $pseudo: "after");
         padding-right: $quantity-selector-btn-padding-x-sm;
+        @include button-icon($quantity-selector-icon-remove-sm, $width: 1rem, $height: 1rem, $size: $quantity-selector-icon-sm-width $quantity-selector-icon-sm-remove-height, $pseudo: "after");
 
         &:focus {
           &[data-focus-visible-added] { // stylelint-disable-line selector-no-qualifying-type
@@ -63,9 +63,9 @@
     }
 
     &:last-of-type {
-      @include button-icon($quantity-selector-icon-add, $size: $quantity-selector-icon-width $quantity-selector-icon-add-height, $pseudo: "after");
       padding-left: $quantity-selector-btn-padding-x;
       border-left-width: 0;
+      @include button-icon($quantity-selector-icon-add, $size: $quantity-selector-icon-width $quantity-selector-icon-add-height, $pseudo: "after");
 
       &:focus {
         &[data-focus-visible-added] { // stylelint-disable-line selector-no-qualifying-type
@@ -75,8 +75,8 @@
       }
 
       &.btn-sm { // stylelint-disable-line selector-no-qualifying-type
-        @include button-icon($quantity-selector-icon-add-sm, $width: 1rem, $height: 1rem, $size: $quantity-selector-icon-sm-width $quantity-selector-icon-sm-add-height, $pseudo: "after");
         padding-left: $quantity-selector-btn-padding-x-sm;
+        @include button-icon($quantity-selector-icon-add-sm, $width: 1rem, $height: 1rem, $size: $quantity-selector-icon-sm-width $quantity-selector-icon-sm-add-height, $pseudo: "after");
 
         &:focus {
           &[data-focus-visible-added] { // stylelint-disable-line selector-no-qualifying-type