From 8cdb6c40bdf55229459f479111e6a44d49052cf1 Mon Sep 17 00:00:00 2001
From: XhmikosR <xhmikosr@gmail.com>
Date: Tue, 14 Dec 2021 09:51:31 +0200
Subject: Update stylelint and stylelint-config-twbs-bootstrap (#35438)

---
 scss/forms/_form-select.scss | 1 -
 1 file changed, 1 deletion(-)

(limited to 'scss/forms')

diff --git a/scss/forms/_form-select.scss b/scss/forms/_form-select.scss
index 153ff6cd5..78c34b8fd 100644
--- a/scss/forms/_form-select.scss
+++ b/scss/forms/_form-select.scss
@@ -7,7 +7,6 @@
   display: block;
   width: 100%;
   padding: $form-select-padding-y $form-select-indicator-padding $form-select-padding-y $form-select-padding-x;
-  // stylelint-disable-next-line property-no-vendor-prefix
   -moz-padding-start: subtract($form-select-padding-x, 3px); // See https://github.com/twbs/bootstrap/issues/32636
   font-family: $form-select-font-family;
   @include font-size($form-select-font-size);
-- 
cgit v1.2.3


From ff2472becc4b0108d2d50bc6fc4cb78a6b3017d4 Mon Sep 17 00:00:00 2001
From: The Fake Cake <TheFakeCake@users.noreply.github.com>
Date: Mon, 7 Feb 2022 08:55:44 +0100
Subject: Set `cursor: default` on disabled `.form-check-label` (#35082)

Fixes #35056
---
 scss/forms/_form-check.scss | 1 +
 1 file changed, 1 insertion(+)

(limited to 'scss/forms')

diff --git a/scss/forms/_form-check.scss b/scss/forms/_form-check.scss
index 6321b4100..a52a2e7c8 100644
--- a/scss/forms/_form-check.scss
+++ b/scss/forms/_form-check.scss
@@ -90,6 +90,7 @@
   &[disabled],
   &:disabled {
     ~ .form-check-label {
+      cursor: default;
       opacity: $form-check-label-disabled-opacity;
     }
   }
-- 
cgit v1.2.3


From 4308b67e59bfb47d386c3cc585e4a0fb759f6de6 Mon Sep 17 00:00:00 2001
From: Mark Otto <markd.otto@gmail.com>
Date: Tue, 8 Feb 2022 12:33:39 -0800
Subject: Add `.form-check-reverse` modifier class (#33606)

* Add .form-check-reverse modifier class

* Update checks-radios.md

Co-authored-by: XhmikosR <xhmikosr@gmail.com>
---
 scss/forms/_form-check.scss | 22 ++++++++++++++++++++++
 1 file changed, 22 insertions(+)

(limited to 'scss/forms')

diff --git a/scss/forms/_form-check.scss b/scss/forms/_form-check.scss
index a52a2e7c8..8e7cbed43 100644
--- a/scss/forms/_form-check.scss
+++ b/scss/forms/_form-check.scss
@@ -14,6 +14,18 @@
   }
 }
 
+.form-check-reverse {
+  padding-right: $form-check-padding-start;
+  padding-left: 0;
+  text-align: right;
+
+  .form-check-input {
+    float: right;
+    margin-right: $form-check-padding-start * -1;
+    margin-left: 0;
+  }
+}
+
 .form-check-input {
   width: $form-check-input-width;
   height: $form-check-input-width;
@@ -130,6 +142,16 @@
       }
     }
   }
+
+  &.form-check-reverse {
+    padding-right: $form-switch-padding-start;
+    padding-left: 0;
+
+    .form-check-input {
+      margin-right: $form-switch-padding-start * -1;
+      margin-left: 0;
+    }
+  }
 }
 
 .form-check-inline {
-- 
cgit v1.2.3


From 0853778eba886a8ba7be09153df30e677402e69c Mon Sep 17 00:00:00 2001
From: Sebastian Podjasek <sebastian.podjasek@intelliway.pl>
Date: Tue, 8 Feb 2022 21:38:29 +0100
Subject: Support floating labels on `.form-control-plaintext` (#32840)

* Support floating labels on `.form-control-plaintext`

* Update floating-labels.md

* Apply suggestions from code review

Co-authored-by: XhmikosR <xhmikosr@gmail.com>
Co-authored-by: Mark Otto <otto@github.com>
---
 scss/forms/_floating-labels.scss | 13 ++++++++++---
 1 file changed, 10 insertions(+), 3 deletions(-)

(limited to 'scss/forms')

diff --git a/scss/forms/_floating-labels.scss b/scss/forms/_floating-labels.scss
index 2f4295480..4f9fd194b 100644
--- a/scss/forms/_floating-labels.scss
+++ b/scss/forms/_floating-labels.scss
@@ -2,6 +2,7 @@
   position: relative;
 
   > .form-control,
+  > .form-control-plaintext,
   > .form-select {
     height: $form-floating-height;
     line-height: $form-floating-line-height;
@@ -19,8 +20,8 @@
     @include transition($form-floating-transition);
   }
 
-  // stylelint-disable no-duplicate-selectors
-  > .form-control {
+  > .form-control,
+  > .form-control-plaintext {
     padding: $form-floating-padding-y $form-floating-padding-x;
 
     &::placeholder {
@@ -46,6 +47,7 @@
 
   > .form-control:focus,
   > .form-control:not(:placeholder-shown),
+  > .form-control-plaintext,
   > .form-select {
     ~ label {
       opacity: $form-floating-label-opacity;
@@ -59,5 +61,10 @@
       transform: $form-floating-label-transform;
     }
   }
-  // stylelint-enable no-duplicate-selectors
+
+  > .form-control-plaintext {
+    ~ label {
+      border-width: $input-border-width 0; // Required to properly position label text - as explained above
+    }
+  }
 }
-- 
cgit v1.2.3


From acf6ea74a74328bcaa9f1c354f27e602cfbb8968 Mon Sep 17 00:00:00 2001
From: Mark Otto <markd.otto@gmail.com>
Date: Sun, 13 Mar 2022 10:13:09 -0700
Subject: Add additional root variables, rename `$variable-prefix` to `$prefix`
 (#35981)

* Add additional root variables, rename $variable-prefix to $prefix

- Adds new root CSS variables for border-radius, border-width, border-color, and border-style
- Adds new root CSS variables for heading-color, link-colors, code color, and highlight color
- Replaces most instances of Sass variables (for border-radius, border-color, border-style, and border-width) for CSS variables inside _variables.scss
- Updates $mark-padding to be an even pixel number
- Renames $variable-prefix to $prefix throughout

* Bundlewatch
---
 scss/forms/_form-check.scss | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

(limited to 'scss/forms')

diff --git a/scss/forms/_form-check.scss b/scss/forms/_form-check.scss
index 8e7cbed43..90bc56117 100644
--- a/scss/forms/_form-check.scss
+++ b/scss/forms/_form-check.scss
@@ -65,7 +65,7 @@
 
     &[type="checkbox"] {
       @if $enable-gradients {
-        background-image: escape-svg($form-check-input-checked-bg-image), var(--#{$variable-prefix}gradient);
+        background-image: escape-svg($form-check-input-checked-bg-image), var(--#{$prefix}gradient);
       } @else {
         background-image: escape-svg($form-check-input-checked-bg-image);
       }
@@ -73,7 +73,7 @@
 
     &[type="radio"] {
       @if $enable-gradients {
-        background-image: escape-svg($form-check-radio-checked-bg-image), var(--#{$variable-prefix}gradient);
+        background-image: escape-svg($form-check-radio-checked-bg-image), var(--#{$prefix}gradient);
       } @else {
         background-image: escape-svg($form-check-radio-checked-bg-image);
       }
@@ -85,7 +85,7 @@
     border-color: $form-check-input-indeterminate-border-color;
 
     @if $enable-gradients {
-      background-image: escape-svg($form-check-input-indeterminate-bg-image), var(--#{$variable-prefix}gradient);
+      background-image: escape-svg($form-check-input-indeterminate-bg-image), var(--#{$prefix}gradient);
     } @else {
       background-image: escape-svg($form-check-input-indeterminate-bg-image);
     }
@@ -136,7 +136,7 @@
       background-position: $form-switch-checked-bg-position;
 
       @if $enable-gradients {
-        background-image: escape-svg($form-switch-checked-bg-image), var(--#{$variable-prefix}gradient);
+        background-image: escape-svg($form-switch-checked-bg-image), var(--#{$prefix}gradient);
       } @else {
         background-image: escape-svg($form-switch-checked-bg-image);
       }
-- 
cgit v1.2.3


From 544cf8df48de281aafb5ae0615b9bc9fd75ed4f8 Mon Sep 17 00:00:00 2001
From: Mark Otto <markdotto@gmail.com>
Date: Tue, 12 Apr 2022 13:42:38 -0700
Subject: Add input-disabled-color Sass variable

---
 scss/forms/_form-control.scss | 1 +
 1 file changed, 1 insertion(+)

(limited to 'scss/forms')

diff --git a/scss/forms/_form-control.scss b/scss/forms/_form-control.scss
index 51b3baa83..c781ae7b9 100644
--- a/scss/forms/_form-control.scss
+++ b/scss/forms/_form-control.scss
@@ -66,6 +66,7 @@
   // don't honor that edge case; we style them as disabled anyway.
   &:disabled,
   &[readonly] {
+    color: $input-disabled-color;
     background-color: $input-disabled-bg;
     border-color: $input-disabled-border-color;
     // iOS fix for unreadable disabled content; see https://github.com/twbs/bootstrap/issues/11655.
-- 
cgit v1.2.3


From f82b2ba20d50d49a1554f4fa2891e3e65760fa98 Mon Sep 17 00:00:00 2001
From: amirhossein-karimi
 <46168016+amirhossein-karimi@users.noreply.github.com>
Date: Sat, 7 May 2022 07:06:04 +0430
Subject: Fix color-adjust with autoprefixer 10.4.6 (#36258)

Co-authored-by: Mark Otto <markd.otto@gmail.com>
---
 scss/forms/_form-check.scss | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'scss/forms')

diff --git a/scss/forms/_form-check.scss b/scss/forms/_form-check.scss
index 90bc56117..42a2a9607 100644
--- a/scss/forms/_form-check.scss
+++ b/scss/forms/_form-check.scss
@@ -37,7 +37,7 @@
   background-size: contain;
   border: $form-check-input-border;
   appearance: none;
-  color-adjust: exact; // Keep themed appearance for print
+  print-color-adjust: exact; // Keep themed appearance for print
   @include transition($form-check-transition);
 
   &[type="checkbox"] {
-- 
cgit v1.2.3


From eaf760e4bce69f64277b20602d9dc864d39d89aa Mon Sep 17 00:00:00 2001
From: Mark Otto <markd.otto@gmail.com>
Date: Fri, 20 May 2022 11:02:32 -0700
Subject: Update form-control-color sizing and styles (#36156)

---
 scss/forms/_form-control.scss | 8 +++++---
 1 file changed, 5 insertions(+), 3 deletions(-)

(limited to 'scss/forms')

diff --git a/scss/forms/_form-control.scss b/scss/forms/_form-control.scss
index c781ae7b9..e7eeca769 100644
--- a/scss/forms/_form-control.scss
+++ b/scss/forms/_form-control.scss
@@ -170,7 +170,7 @@ textarea {
 
 .form-control-color {
   width: $form-color-width;
-  height: auto; // Override fixed browser height
+  height: $input-height;
   padding: $input-padding-y;
 
   &:not(:disabled):not([readonly]) {
@@ -178,12 +178,14 @@ textarea {
   }
 
   &::-moz-color-swatch {
-    height: if(unit($input-line-height) == "", $input-line-height * 1em, $input-line-height);
+    border: 0 !important; // stylelint-disable-line declaration-no-important
     @include border-radius($input-border-radius);
   }
 
   &::-webkit-color-swatch {
-    height: if(unit($input-line-height) == "", $input-line-height * 1em, $input-line-height);
     @include border-radius($input-border-radius);
   }
+
+  &.form-control-sm { height: $input-height-sm; }
+  &.form-control-lg { height: $input-height-lg; }
 }
-- 
cgit v1.2.3


From 7ed1a5f821dedffe453e5e30da1b435d911be099 Mon Sep 17 00:00:00 2001
From: HDPham <hdpham@protonmail.com>
Date: Tue, 10 May 2022 23:49:08 -0500
Subject: Truncate text to prevent multiline floating label

---
 scss/forms/_floating-labels.scss | 4 ++++
 1 file changed, 4 insertions(+)

(limited to 'scss/forms')

diff --git a/scss/forms/_floating-labels.scss b/scss/forms/_floating-labels.scss
index 4f9fd194b..acefe4ebc 100644
--- a/scss/forms/_floating-labels.scss
+++ b/scss/forms/_floating-labels.scss
@@ -12,8 +12,12 @@
     position: absolute;
     top: 0;
     left: 0;
+    width: 100%;
     height: 100%; // allow textareas
     padding: $form-floating-padding-y $form-floating-padding-x;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
     pointer-events: none;
     border: $input-border-width solid transparent; // Required for aligning label's text with the input as it affects inner box model
     transform-origin: 0 0;
-- 
cgit v1.2.3


From ac0b87b2071ed5bedeaad47f2a909640c85323bc Mon Sep 17 00:00:00 2001
From: Mark Otto <markd.otto@gmail.com>
Date: Tue, 14 Jun 2022 07:25:49 -0700
Subject: Don't style `readonly` inputs as `disabled` (#36499)

* Don't style readonly inputs as disabled

Also remove the Chrome-specific focus styling from readonly plaintext

* Update some docs comments
---
 scss/forms/_form-control.scss | 9 ++++++---
 1 file changed, 6 insertions(+), 3 deletions(-)

(limited to 'scss/forms')

diff --git a/scss/forms/_form-control.scss b/scss/forms/_form-control.scss
index e7eeca769..e707c57ea 100644
--- a/scss/forms/_form-control.scss
+++ b/scss/forms/_form-control.scss
@@ -59,13 +59,12 @@
     opacity: 1;
   }
 
-  // Disabled and read-only inputs
+  // Disabled inputs
   //
   // HTML5 says that controls under a fieldset > legend:first-child won't be
   // disabled if the fieldset is disabled. Due to implementation difficulty, we
   // don't honor that edge case; we style them as disabled anyway.
-  &:disabled,
-  &[readonly] {
+  &:disabled {
     color: $input-disabled-color;
     background-color: $input-disabled-bg;
     border-color: $input-disabled-border-color;
@@ -110,6 +109,10 @@
   border: solid transparent;
   border-width: $input-border-width 0;
 
+  &:focus {
+    outline: 0;
+  }
+
   &.form-control-sm,
   &.form-control-lg {
     padding-right: 0;
-- 
cgit v1.2.3


From 71cbb88f098f186518a20c22294a0cbda944ec6b Mon Sep 17 00:00:00 2001
From: Mark Otto <markd.otto@gmail.com>
Date: Sun, 17 Jul 2022 20:50:41 -0700
Subject: Support input groups in floating forms (#36759)

* Support input groups in floating forms

* Update bundlewatch

Co-authored-by: 719media <ben@719media.com>
---
 scss/forms/_input-group.scss | 22 +++++++++++++++-------
 1 file changed, 15 insertions(+), 7 deletions(-)

(limited to 'scss/forms')

diff --git a/scss/forms/_input-group.scss b/scss/forms/_input-group.scss
index 140052936..83d52c51e 100644
--- a/scss/forms/_input-group.scss
+++ b/scss/forms/_input-group.scss
@@ -10,7 +10,8 @@
   width: 100%;
 
   > .form-control,
-  > .form-select {
+  > .form-select,
+  > .form-floating {
     position: relative; // For focus state's z-index
     flex: 1 1 auto;
     width: 1%;
@@ -19,7 +20,8 @@
 
   // Bring the "active" form control to the top of surrounding elements
   > .form-control:focus,
-  > .form-select:focus {
+  > .form-select:focus,
+  > .form-floating:focus-within {
     z-index: 3;
   }
 
@@ -96,15 +98,19 @@
 // stylelint-disable-next-line no-duplicate-selectors
 .input-group {
   &:not(.has-validation) {
-    > :not(:last-child):not(.dropdown-toggle):not(.dropdown-menu),
-    > .dropdown-toggle:nth-last-child(n + 3) {
+    > :not(:last-child):not(.dropdown-toggle):not(.dropdown-menu):not(.form-floating),
+    > .dropdown-toggle:nth-last-child(n + 3),
+    > .form-floating:not(:last-child) > .form-control,
+    > .form-floating:not(:last-child) > .form-select {
       @include border-end-radius(0);
     }
   }
 
   &.has-validation {
-    > :nth-last-child(n + 3):not(.dropdown-toggle):not(.dropdown-menu),
-    > .dropdown-toggle:nth-last-child(n + 4) {
+    > :nth-last-child(n + 3):not(.dropdown-toggle):not(.dropdown-menu):not(.form-floating),
+    > .dropdown-toggle:nth-last-child(n + 4),
+    > .form-floating:nth-last-child(n + 3) > .form-control,
+    > .form-floating:nth-last-child(n + 3) > .form-select {
       @include border-end-radius(0);
     }
   }
@@ -114,7 +120,9 @@
     $validation-messages: $validation-messages + ":not(." + unquote($state) + "-tooltip)" + ":not(." + unquote($state) + "-feedback)";
   }
 
-  > :not(:first-child):not(.dropdown-menu)#{$validation-messages} {
+  > :not(:first-child):not(.dropdown-menu):not(.form-floating)#{$validation-messages},
+  > .form-floating:not(:first-child) > .form-control,
+  > .form-floating:not(:first-child) > .form-select {
     margin-left: -$input-border-width;
     @include border-start-radius(0);
   }
-- 
cgit v1.2.3


From c22dd50e1b3539685c609e0e0b37ba52bb2312cf Mon Sep 17 00:00:00 2001
From: louismaximepiton <louismaxime.piton@orange.com>
Date: Mon, 1 Aug 2022 12:01:32 +0200
Subject: Fix floating labels

---
 scss/forms/_floating-labels.scss | 1 +
 1 file changed, 1 insertion(+)

(limited to 'scss/forms')

diff --git a/scss/forms/_floating-labels.scss b/scss/forms/_floating-labels.scss
index acefe4ebc..6e5c9a75f 100644
--- a/scss/forms/_floating-labels.scss
+++ b/scss/forms/_floating-labels.scss
@@ -16,6 +16,7 @@
     height: 100%; // allow textareas
     padding: $form-floating-padding-y $form-floating-padding-x;
     overflow: hidden;
+    text-align: start;
     text-overflow: ellipsis;
     white-space: nowrap;
     pointer-events: none;
-- 
cgit v1.2.3


From 6c221aa043e0bd14db31fb047c57c714e92605de Mon Sep 17 00:00:00 2001
From: louismaximepiton <louismaxime.piton@orange.com>
Date: Mon, 1 Aug 2022 15:16:05 +0200
Subject: Fix

---
 scss/forms/_input-group.scss | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

(limited to 'scss/forms')

diff --git a/scss/forms/_input-group.scss b/scss/forms/_input-group.scss
index 83d52c51e..813679f0c 100644
--- a/scss/forms/_input-group.scss
+++ b/scss/forms/_input-group.scss
@@ -120,10 +120,13 @@
     $validation-messages: $validation-messages + ":not(." + unquote($state) + "-tooltip)" + ":not(." + unquote($state) + "-feedback)";
   }
 
-  > :not(:first-child):not(.dropdown-menu):not(.form-floating)#{$validation-messages},
+  > :not(:first-child):not(.dropdown-menu)#{$validation-messages} {
+    margin-left: -$input-border-width;
+    @include border-start-radius(0);
+  }
+
   > .form-floating:not(:first-child) > .form-control,
   > .form-floating:not(:first-child) > .form-select {
-    margin-left: -$input-border-width;
     @include border-start-radius(0);
   }
 }
-- 
cgit v1.2.3


From 2f3aec819ae7bd04c00cc55fee977d12e11a46c6 Mon Sep 17 00:00:00 2001
From: Florian Lacreuse <lacreuse.florian@gmail.com>
Date: Wed, 31 Aug 2022 16:17:58 +0200
Subject: Fix input group z-index focus + validation

---
 scss/forms/_input-group.scss | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

(limited to 'scss/forms')

diff --git a/scss/forms/_input-group.scss b/scss/forms/_input-group.scss
index 813679f0c..247f74a7a 100644
--- a/scss/forms/_input-group.scss
+++ b/scss/forms/_input-group.scss
@@ -22,7 +22,7 @@
   > .form-control:focus,
   > .form-select:focus,
   > .form-floating:focus-within {
-    z-index: 3;
+    z-index: 5;
   }
 
   // Ensure buttons are always above inputs for more visually pleasing borders.
@@ -33,7 +33,7 @@
     z-index: 2;
 
     &:focus {
-      z-index: 3;
+      z-index: 5;
     }
   }
 }
-- 
cgit v1.2.3


From bf6240dad9a466e9d3bc682abf416e9e5b4c66df Mon Sep 17 00:00:00 2001
From: Louis-Maxime Piton <louismaxime.piton@orange.com>
Date: Thu, 6 Oct 2022 08:12:00 +0200
Subject: Add an artificial background to floating labels (#37125)

---
 scss/forms/_floating-labels.scss | 11 +++++++++++
 1 file changed, 11 insertions(+)

(limited to 'scss/forms')

diff --git a/scss/forms/_floating-labels.scss b/scss/forms/_floating-labels.scss
index 6e5c9a75f..93c1c2205 100644
--- a/scss/forms/_floating-labels.scss
+++ b/scss/forms/_floating-labels.scss
@@ -1,6 +1,17 @@
 .form-floating {
   position: relative;
 
+  &::before {
+    position: absolute;
+    top: $input-border-width;
+    left: $input-border-width;
+    width: subtract(100%, add($input-height-inner-quarter, $input-height-inner-half));
+    height: $form-floating-label-height;
+    content: "";
+    background-color: $input-bg;
+    @include border-radius($input-border-radius);
+  }
+
   > .form-control,
   > .form-control-plaintext,
   > .form-select {
-- 
cgit v1.2.3


From db60ae0625ee989c8fe08076663759c287207c9a Mon Sep 17 00:00:00 2001
From: jonnysp <jonnysp@users.noreply.github.com>
Date: Sun, 23 Oct 2022 08:29:50 +0200
Subject: fix

---
 scss/forms/_input-group.scss | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'scss/forms')

diff --git a/scss/forms/_input-group.scss b/scss/forms/_input-group.scss
index 247f74a7a..d6370ed7f 100644
--- a/scss/forms/_input-group.scss
+++ b/scss/forms/_input-group.scss
@@ -121,7 +121,7 @@
   }
 
   > :not(:first-child):not(.dropdown-menu)#{$validation-messages} {
-    margin-left: -$input-border-width;
+    margin-left: calc($input-border-width * -1); // stylelint-disable-line function-disallowed-list
     @include border-start-radius(0);
   }
 
-- 
cgit v1.2.3


From 06bed9b45af290b05fed9ec003a89af1d3baf6a4 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Julien=20D=C3=A9ramond?= <julien.deramond@orange.com>
Date: Sun, 30 Oct 2022 02:30:59 +0200
Subject: Fix disabled floating labels and add some examples of it in the docs
 (#37299)

* Fix disabled floating labels and add some examples of it in the docs

* Add disabled custom height textarea
---
 scss/forms/_floating-labels.scss | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'scss/forms')

diff --git a/scss/forms/_floating-labels.scss b/scss/forms/_floating-labels.scss
index 93c1c2205..e5e35d326 100644
--- a/scss/forms/_floating-labels.scss
+++ b/scss/forms/_floating-labels.scss
@@ -1,7 +1,7 @@
 .form-floating {
   position: relative;
 
-  &::before {
+  &::before:not(.form-control:disabled) {
     position: absolute;
     top: $input-border-width;
     left: $input-border-width;
-- 
cgit v1.2.3


From 4b54d22483c7fb4b7d86f50ffcbbf31da833e243 Mon Sep 17 00:00:00 2001
From: Stephen Reay <stephen@koalephant.com>
Date: Mon, 31 Oct 2022 05:02:10 +0700
Subject: Prevent extraneous whitespace around date time inputs in Webkit
 (#37350)

* Prevent extraneous whitespace around date time inputs in Webkit

Closes twbs/bootstrap#34433

* Updated bundlewatch config
---
 scss/forms/_form-control.scss | 7 +++++++
 1 file changed, 7 insertions(+)

(limited to 'scss/forms')

diff --git a/scss/forms/_form-control.scss b/scss/forms/_form-control.scss
index e707c57ea..c81e3b4ea 100644
--- a/scss/forms/_form-control.scss
+++ b/scss/forms/_form-control.scss
@@ -52,6 +52,13 @@
     height: if(unit($input-line-height) == "", $input-line-height * 1em, $input-line-height);
   }
 
+  // Prevent excessive date input height in Webkit
+  // https://github.com/twbs/bootstrap/issues/34433
+  &::-webkit-datetime-edit {
+    display: block;
+    padding: 0;
+  }
+
   // Placeholder
   &::placeholder {
     color: $input-placeholder-color;
-- 
cgit v1.2.3


From 85765210cd2ca0f27303460b7837aca69228d2e3 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Julien=20D=C3=A9ramond?= <juderamond@gmail.com>
Date: Mon, 31 Oct 2022 19:29:04 +0100
Subject: Fix disabled floating labels color

---
 scss/forms/_floating-labels.scss | 4 ++++
 1 file changed, 4 insertions(+)

(limited to 'scss/forms')

diff --git a/scss/forms/_floating-labels.scss b/scss/forms/_floating-labels.scss
index e5e35d326..aaed53845 100644
--- a/scss/forms/_floating-labels.scss
+++ b/scss/forms/_floating-labels.scss
@@ -83,4 +83,8 @@
       border-width: $input-border-width 0; // Required to properly position label text - as explained above
     }
   }
+
+  > .form-control:disabled ~ label {
+    color: $form-floating-label-disabled-color;
+  }
 }
-- 
cgit v1.2.3


From fc3f4b67d65c575daa661ecf31cf59b4ff3cced5 Mon Sep 17 00:00:00 2001
From: Mark Otto <markd.otto@gmail.com>
Date: Mon, 28 Nov 2022 22:30:26 -0800
Subject: Add dark mode support (#35857)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* Add dark mode to docs

* Minor fix: missing space indentation

* Minor fix: revert utilities/z-index added-in modification

* Remove prev: and next: from doc because extracted to another PR

* Use .bg-body-tertiary in all Utilities > Overflow examples

* fix example

* Fix up spacing examples

* Update box-shadow Sass variables and utilities to auto-adjust to color modes

* Remove unused docs class

* Refactor form styles to use CSS variable for background images on .form-check and .form-switch

* Fix docs selector

* Rename shortcut for clarity

* Heading consistency

* Reintroduce missing 4th grid item in Utilities > Spacing example

* Fix bundlewatch

* .bd-callout* rendering is OK so removing comments in the code

* Update scss/_utilities.scss

Co-authored-by: Julien Déramond <julien.deramond@orange.com>

* Fix gutters example styling

* Fix text colors on background utils docs

* redesign and fix up position marker example, which doesn't show nicely in darkmode but at least isn't broken

* fix some color utils examples

* Deprecate mixin notice

* Deprecate notice for list-group-item-variant() mixin

* Revamp new link CSS vars

* Use map-keys in some each Sass files

* Remove list-group-item-variant mixin ref in sass loop desc

* Display CSS vars scoped to our built-in dark mode

* Revert previous commit

* Fix list group variant link

* Fix typo

* Remove imports of alert/list-group mixins in scss/_mixins.scss

* Small formatting + comments removal in scss/_content.scss

* Fix alert links colors

* fix dropdown border-radius mixin

* fix link color and underline again, this time using CSS var override for color var and fallback value for the underline

* fix colors on docs navbar for dark mode

* remove two changes

* missing ref

* another link underline fix, just use sass vars for link decoration for now

* missing color bg docs, plus move dropdown override to scss

* more changes from review

* fix some examples, drop unused docs navbar styles, update docs navbar color mode to use mixin

* Few fixes around type

- Restored CSS variable for color on headings, this time with a fallback value
- In conjunction, restored and wrapped the default CSS var with a null value check
- Split headings and paragraphs docs in Reboot, elaborated on them

* Restyle custom details > summary element in docs

* Rewrite some migration docs

* fix form checks

* Fix up some navbar styling, tweak docs callout

* Fix select images, mostly for validation styling

* Clean up some migration notes, document some new form control CSS vars, mention new variables-dark in sass docs

* Update site/content/docs/5.2/components/scrollspy.md

Co-authored-by: Julien Déramond <julien.deramond@orange.com>

* Apply suggestions from code review

Co-authored-by: Julien Déramond <julien.deramond@orange.com>

* mention form control css vars in migration guide

* Tweak grid and flex docs background examples

* clarify some docs

* fix some more things

Co-authored-by: Julien Déramond <juderamond@gmail.com>
Co-authored-by: Julien Déramond <julien.deramond@orange.com>
---
 scss/forms/_form-check.scss  | 35 ++++++++++++++++++++++++-----------
 scss/forms/_form-select.scss | 12 +++++++++++-
 2 files changed, 35 insertions(+), 12 deletions(-)

(limited to 'scss/forms')

diff --git a/scss/forms/_form-check.scss b/scss/forms/_form-check.scss
index 42a2a9607..45c69a604 100644
--- a/scss/forms/_form-check.scss
+++ b/scss/forms/_form-check.scss
@@ -27,11 +27,14 @@
 }
 
 .form-check-input {
+  --#{$prefix}form-check-bg: #{escape-svg($form-check-input-bg)};
+
   width: $form-check-input-width;
   height: $form-check-input-width;
   margin-top: ($line-height-base - $form-check-input-width) * .5; // line-height minus check height
   vertical-align: top;
-  background-color: $form-check-input-bg;
+  background-color: var(--#{$prefix}form-check-bg);
+  background-image: var(--#{$prefix}form-check-bg-image);
   background-repeat: no-repeat;
   background-position: center;
   background-size: contain;
@@ -65,17 +68,17 @@
 
     &[type="checkbox"] {
       @if $enable-gradients {
-        background-image: escape-svg($form-check-input-checked-bg-image), var(--#{$prefix}gradient);
+        --#{$prefix}form-check-bg-image: #{escape-svg($form-check-input-checked-bg-image)}, var(--#{$prefix}gradient);
       } @else {
-        background-image: escape-svg($form-check-input-checked-bg-image);
+        --#{$prefix}form-check-bg-image: #{escape-svg($form-check-input-checked-bg-image)};
       }
     }
 
     &[type="radio"] {
       @if $enable-gradients {
-        background-image: escape-svg($form-check-radio-checked-bg-image), var(--#{$prefix}gradient);
+        --#{$prefix}form-check-bg-image: #{escape-svg($form-check-radio-checked-bg-image)}, var(--#{$prefix}gradient);
       } @else {
-        background-image: escape-svg($form-check-radio-checked-bg-image);
+        --#{$prefix}form-check-bg-image: #{escape-svg($form-check-radio-checked-bg-image)};
       }
     }
   }
@@ -85,9 +88,9 @@
     border-color: $form-check-input-indeterminate-border-color;
 
     @if $enable-gradients {
-      background-image: escape-svg($form-check-input-indeterminate-bg-image), var(--#{$prefix}gradient);
+      --#{$prefix}form-check-bg-image: #{escape-svg($form-check-input-indeterminate-bg-image)}, var(--#{$prefix}gradient);
     } @else {
-      background-image: escape-svg($form-check-input-indeterminate-bg-image);
+      --#{$prefix}form-check-bg-image: #{escape-svg($form-check-input-indeterminate-bg-image)};
     }
   }
 
@@ -121,24 +124,26 @@
   padding-left: $form-switch-padding-start;
 
   .form-check-input {
+    --#{$prefix}form-switch-bg: #{escape-svg($form-switch-bg-image)};
+
     width: $form-switch-width;
     margin-left: $form-switch-padding-start * -1;
-    background-image: escape-svg($form-switch-bg-image);
+    background-image: var(--#{$prefix}form-switch-bg);
     background-position: left center;
     @include border-radius($form-switch-border-radius);
     @include transition($form-switch-transition);
 
     &:focus {
-      background-image: escape-svg($form-switch-focus-bg-image);
+      --#{$prefix}form-switch-bg: #{escape-svg($form-switch-focus-bg-image)};
     }
 
     &:checked {
       background-position: $form-switch-checked-bg-position;
 
       @if $enable-gradients {
-        background-image: escape-svg($form-switch-checked-bg-image), var(--#{$prefix}gradient);
+        --#{$prefix}form-switch-bg: #{escape-svg($form-switch-checked-bg-image)}, var(--#{$prefix}gradient);
       } @else {
-        background-image: escape-svg($form-switch-checked-bg-image);
+        --#{$prefix}form-switch-bg: #{escape-svg($form-switch-checked-bg-image)};
       }
     }
   }
@@ -173,3 +178,11 @@
     }
   }
 }
+
+@if $enable-dark-mode {
+  @include color-mode(dark) {
+    .form-switch .form-check-input:not(:checked):not(:focus) {
+      --#{$prefix}form-switch-bg: #{escape-svg($form-switch-bg-image-dark)};
+    }
+  }
+}
diff --git a/scss/forms/_form-select.scss b/scss/forms/_form-select.scss
index 78c34b8fd..45b0b2686 100644
--- a/scss/forms/_form-select.scss
+++ b/scss/forms/_form-select.scss
@@ -4,6 +4,8 @@
 // https://primer.github.io/.
 
 .form-select {
+  --#{$prefix}form-select-bg-img: #{escape-svg($form-select-indicator)};
+
   display: block;
   width: 100%;
   padding: $form-select-padding-y $form-select-indicator-padding $form-select-padding-y $form-select-padding-x;
@@ -14,7 +16,7 @@
   line-height: $form-select-line-height;
   color: $form-select-color;
   background-color: $form-select-bg;
-  background-image: escape-svg($form-select-indicator);
+  background-image: var(--#{$prefix}form-select-bg-img), var(--#{$prefix}form-select-bg-icon, none);
   background-repeat: no-repeat;
   background-position: $form-select-bg-position;
   background-size: $form-select-bg-size;
@@ -69,3 +71,11 @@
   @include font-size($form-select-font-size-lg);
   @include border-radius($form-select-border-radius-lg);
 }
+
+@if $enable-dark-mode {
+  @include color-mode(dark) {
+    .form-select {
+      --#{$prefix}form-select-bg-img: #{escape-svg($form-select-indicator-dark)};
+    }
+  }
+}
-- 
cgit v1.2.3


From fd3da4eb3e459bdbc868d1b9e2bd72a6b9d927d1 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Julien=20D=C3=A9ramond?= <juderamond@gmail.com>
Date: Sat, 10 Dec 2022 11:03:31 +0100
Subject: Fix `--bs-form-check-bg` definition

---
 scss/forms/_form-check.scss | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'scss/forms')

diff --git a/scss/forms/_form-check.scss b/scss/forms/_form-check.scss
index 45c69a604..83aacba2e 100644
--- a/scss/forms/_form-check.scss
+++ b/scss/forms/_form-check.scss
@@ -27,7 +27,7 @@
 }
 
 .form-check-input {
-  --#{$prefix}form-check-bg: #{escape-svg($form-check-input-bg)};
+  --#{$prefix}form-check-bg: #{$form-check-input-bg};
 
   width: $form-check-input-width;
   height: $form-check-input-width;
-- 
cgit v1.2.3


From 1369b81492a5368ac40dbfac3d6553e32065f706 Mon Sep 17 00:00:00 2001
From: Tanguy Krotoff <tkrotoff@gmail.com>
Date: Wed, 18 Jan 2023 06:09:39 +0100
Subject: Fix Android Chrome input date dimensions (#36143)

* Bind Hugo to 0.0.0.0, helps debug on mobile when on the same network

* Use http-server for visual tests

* Add input visual tests

* Fix input date dimensions on Android Chrome

* Increase bootstrap.css max size

* Revert "Bind Hugo to 0.0.0.0" & "Use http-server for visual tests"

* Switch to pixels: this is an empirical minimum safe value

* Update .bundlewatch.config.json

Co-authored-by: Mark Otto <otto@github.com>
---
 scss/forms/_form-control.scss | 18 +++++++++++++++---
 1 file changed, 15 insertions(+), 3 deletions(-)

(limited to 'scss/forms')

diff --git a/scss/forms/_form-control.scss b/scss/forms/_form-control.scss
index c81e3b4ea..ab72654d3 100644
--- a/scss/forms/_form-control.scss
+++ b/scss/forms/_form-control.scss
@@ -44,12 +44,24 @@
     }
   }
 
-  // Add some height to date inputs on iOS
-  // https://github.com/twbs/bootstrap/issues/23307
-  // TODO: we can remove this workaround once https://bugs.webkit.org/show_bug.cgi?id=198959 is resolved
   &::-webkit-date-and-time-value {
+    // On Android Chrome, form-control's "width: 100%" makes the input width too small
+    // Tested under Android 11 / Chrome 89, Android 12 / Chrome 100, Android 13 / Chrome 109
+    //
+    // On iOS Safari, form-control's "appearance: none" + "width: 100%" makes the input width too small
+    // Tested under iOS 16.2 / Safari 16.2
+    min-width: 85px; // Seems to be a good minimum safe width
+
+    // Add some height to date inputs on iOS
+    // https://github.com/twbs/bootstrap/issues/23307
+    // TODO: we can remove this workaround once https://bugs.webkit.org/show_bug.cgi?id=198959 is resolved
     // Multiply line-height by 1em if it has no unit
     height: if(unit($input-line-height) == "", $input-line-height * 1em, $input-line-height);
+
+    // Android Chrome type="date" is taller than the other inputs
+    // because of "margin: 1px 24px 1px 4px" inside the shadow DOM
+    // Tested under Android 11 / Chrome 89, Android 12 / Chrome 100, Android 13 / Chrome 109
+    margin: 0;
   }
 
   // Prevent excessive date input height in Webkit
-- 
cgit v1.2.3


From 03983e5b998d0fc34b8ff98394f541063420097a Mon Sep 17 00:00:00 2001
From: Mark Otto <markdotto@gmail.com>
Date: Wed, 25 Jan 2023 17:45:20 -0800
Subject: Rewrite selector to help Parcel compiler

---
 scss/forms/_floating-labels.scss | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'scss/forms')

diff --git a/scss/forms/_floating-labels.scss b/scss/forms/_floating-labels.scss
index aaed53845..acae3fd68 100644
--- a/scss/forms/_floating-labels.scss
+++ b/scss/forms/_floating-labels.scss
@@ -1,7 +1,7 @@
 .form-floating {
   position: relative;
 
-  &::before:not(.form-control:disabled) {
+  &:not(.form-control:disabled)::before {
     position: absolute;
     top: $input-border-width;
     left: $input-border-width;
-- 
cgit v1.2.3


From f8fa05d27e9766f479fc98a5be40fb3a19e62d7a Mon Sep 17 00:00:00 2001
From: Mark Otto <markdotto@gmail.com>
Date: Tue, 14 Feb 2023 20:54:51 -0800
Subject: Remove -moz-padding-start from .form-select

---
 scss/forms/_form-select.scss | 1 -
 1 file changed, 1 deletion(-)

(limited to 'scss/forms')

diff --git a/scss/forms/_form-select.scss b/scss/forms/_form-select.scss
index 45b0b2686..0b26323ff 100644
--- a/scss/forms/_form-select.scss
+++ b/scss/forms/_form-select.scss
@@ -9,7 +9,6 @@
   display: block;
   width: 100%;
   padding: $form-select-padding-y $form-select-indicator-padding $form-select-padding-y $form-select-padding-x;
-  -moz-padding-start: subtract($form-select-padding-x, 3px); // See https://github.com/twbs/bootstrap/issues/32636
   font-family: $form-select-font-family;
   @include font-size($form-select-font-size);
   font-weight: $form-select-font-weight;
-- 
cgit v1.2.3


From 2b31a6b0d5e8bc4b5cc6516ffe51f5937fffe3eb Mon Sep 17 00:00:00 2001
From: MewenLeHo <mewen.leho.ext@orange.com>
Date: Mon, 23 Jan 2023 14:38:12 +0100
Subject: Fix color picker borders on chromium based browsers

---
 scss/forms/_form-control.scss | 1 +
 1 file changed, 1 insertion(+)

(limited to 'scss/forms')

diff --git a/scss/forms/_form-control.scss b/scss/forms/_form-control.scss
index ab72654d3..ca2a7df4c 100644
--- a/scss/forms/_form-control.scss
+++ b/scss/forms/_form-control.scss
@@ -205,6 +205,7 @@ textarea {
   }
 
   &::-webkit-color-swatch {
+    border: 0 !important; // stylelint-disable-line declaration-no-important
     @include border-radius($input-border-radius);
   }
 
-- 
cgit v1.2.3


From 92f9dda263e4a80a8b9a60574af20f610b6c6fa8 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Julien=20D=C3=A9ramond?= <juderamond@gmail.com>
Date: Mon, 27 Mar 2023 17:34:14 +0200
Subject: Add a check for interpolation variables to node-sass workflow
 (#38283)

Co-authored-by: XhmikosR <xhmikosr@gmail.com>
---
 scss/forms/_input-group.scss | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'scss/forms')

diff --git a/scss/forms/_input-group.scss b/scss/forms/_input-group.scss
index d6370ed7f..58e4d409c 100644
--- a/scss/forms/_input-group.scss
+++ b/scss/forms/_input-group.scss
@@ -121,7 +121,7 @@
   }
 
   > :not(:first-child):not(.dropdown-menu)#{$validation-messages} {
-    margin-left: calc($input-border-width * -1); // stylelint-disable-line function-disallowed-list
+    margin-left: calc(#{$input-border-width} * -1); // stylelint-disable-line function-disallowed-list
     @include border-start-radius(0);
   }
 
-- 
cgit v1.2.3


From 3aabfc70c38db03e77229a49f4f8c7ed58169cf7 Mon Sep 17 00:00:00 2001
From: Mark Otto <markd.otto@gmail.com>
Date: Wed, 29 Mar 2023 12:46:09 -0500
Subject: Another pass at fixing floating labels disabled colors (#38313)

* Another pass at fixing floating labels disabled colors

* Fix height for textareas

* Fix disabled background

* Move from full width to an inline-block-ish approach

---------

Co-authored-by: XhmikosR <xhmikosr@gmail.com>
---
 scss/forms/_floating-labels.scss | 33 ++++++++++++++++++---------------
 1 file changed, 18 insertions(+), 15 deletions(-)

(limited to 'scss/forms')

diff --git a/scss/forms/_floating-labels.scss b/scss/forms/_floating-labels.scss
index acae3fd68..7d04723e3 100644
--- a/scss/forms/_floating-labels.scss
+++ b/scss/forms/_floating-labels.scss
@@ -1,17 +1,6 @@
 .form-floating {
   position: relative;
 
-  &:not(.form-control:disabled)::before {
-    position: absolute;
-    top: $input-border-width;
-    left: $input-border-width;
-    width: subtract(100%, add($input-height-inner-quarter, $input-height-inner-half));
-    height: $form-floating-label-height;
-    content: "";
-    background-color: $input-bg;
-    @include border-radius($input-border-radius);
-  }
-
   > .form-control,
   > .form-control-plaintext,
   > .form-select {
@@ -23,7 +12,7 @@
     position: absolute;
     top: 0;
     left: 0;
-    width: 100%;
+    z-index: 2;
     height: 100%; // allow textareas
     padding: $form-floating-padding-y $form-floating-padding-x;
     overflow: hidden;
@@ -66,14 +55,24 @@
   > .form-control-plaintext,
   > .form-select {
     ~ label {
-      opacity: $form-floating-label-opacity;
+      color: rgba(var(--#{$prefix}body-color-rgb), #{$form-floating-label-opacity});
       transform: $form-floating-label-transform;
+
+      &::after {
+        position: absolute;
+        inset: $form-floating-padding-y ($form-floating-padding-x * .5);
+        z-index: -1;
+        height: $form-floating-label-height;
+        content: "";
+        background-color: $input-bg;
+        @include border-radius($input-border-radius);
+      }
     }
   }
   // Duplicated because `:-webkit-autofill` invalidates other selectors when grouped
   > .form-control:-webkit-autofill {
     ~ label {
-      opacity: $form-floating-label-opacity;
+      color: rgba(var(--#{$prefix}body-color-rgb), #{$form-floating-label-opacity});
       transform: $form-floating-label-transform;
     }
   }
@@ -84,7 +83,11 @@
     }
   }
 
-  > .form-control:disabled ~ label {
+  > :disabled ~ label {
     color: $form-floating-label-disabled-color;
+
+    &::after {
+      background-color: $input-disabled-bg;
+    }
   }
 }
-- 
cgit v1.2.3


From 10afeb51b79dce9251ec2faa49a7655b7d7f953e Mon Sep 17 00:00:00 2001
From: jonnysp <jonnysp@users.noreply.github.com>
Date: Fri, 21 Apr 2023 04:49:26 +0200
Subject: Update _floating-labels.scss (#38366)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Co-authored-by: Julien Déramond <juderamond@gmail.com>
---
 scss/forms/_floating-labels.scss | 1 +
 1 file changed, 1 insertion(+)

(limited to 'scss/forms')

diff --git a/scss/forms/_floating-labels.scss b/scss/forms/_floating-labels.scss
index 7d04723e3..3ca4264d7 100644
--- a/scss/forms/_floating-labels.scss
+++ b/scss/forms/_floating-labels.scss
@@ -5,6 +5,7 @@
   > .form-control-plaintext,
   > .form-select {
     height: $form-floating-height;
+    min-height: $form-floating-height;
     line-height: $form-floating-line-height;
   }
 
-- 
cgit v1.2.3


From 1ab75c8d14b101d7f2ab8d31f0addf549c70def7 Mon Sep 17 00:00:00 2001
From: XhmikosR <xhmikosr@gmail.com>
Date: Fri, 30 Jun 2023 09:52:46 +0300
Subject: Fix Sass properties order for newer stylelint-config-recess-order
 (#38851)

---
 scss/forms/_form-check.scss   | 2 +-
 scss/forms/_form-control.scss | 2 +-
 scss/forms/_form-range.scss   | 6 +++---
 scss/forms/_form-select.scss  | 2 +-
 4 files changed, 6 insertions(+), 6 deletions(-)

(limited to 'scss/forms')

diff --git a/scss/forms/_form-check.scss b/scss/forms/_form-check.scss
index 83aacba2e..f8d9b08f8 100644
--- a/scss/forms/_form-check.scss
+++ b/scss/forms/_form-check.scss
@@ -33,13 +33,13 @@
   height: $form-check-input-width;
   margin-top: ($line-height-base - $form-check-input-width) * .5; // line-height minus check height
   vertical-align: top;
+  appearance: none;
   background-color: var(--#{$prefix}form-check-bg);
   background-image: var(--#{$prefix}form-check-bg-image);
   background-repeat: no-repeat;
   background-position: center;
   background-size: contain;
   border: $form-check-input-border;
-  appearance: none;
   print-color-adjust: exact; // Keep themed appearance for print
   @include transition($form-check-transition);
 
diff --git a/scss/forms/_form-control.scss b/scss/forms/_form-control.scss
index ca2a7df4c..67ae5f4f9 100644
--- a/scss/forms/_form-control.scss
+++ b/scss/forms/_form-control.scss
@@ -11,10 +11,10 @@
   font-weight: $input-font-weight;
   line-height: $input-line-height;
   color: $input-color;
+  appearance: none; // Fix appearance for date inputs in Safari
   background-color: $input-bg;
   background-clip: padding-box;
   border: $input-border-width solid $input-border-color;
-  appearance: none; // Fix appearance for date inputs in Safari
 
   // Note: This has no effect on <select>s in some browsers, due to the limited stylability of `<select>`s in CSS.
   @include border-radius($input-border-radius, 0);
diff --git a/scss/forms/_form-range.scss b/scss/forms/_form-range.scss
index 6de42132e..4732213e9 100644
--- a/scss/forms/_form-range.scss
+++ b/scss/forms/_form-range.scss
@@ -8,8 +8,8 @@
   width: 100%;
   height: add($form-range-thumb-height, $form-range-thumb-focus-box-shadow-width * 2);
   padding: 0; // Need to reset padding
-  background-color: transparent;
   appearance: none;
+  background-color: transparent;
 
   &:focus {
     outline: 0;
@@ -28,12 +28,12 @@
     width: $form-range-thumb-width;
     height: $form-range-thumb-height;
     margin-top: ($form-range-track-height - $form-range-thumb-height) * .5; // Webkit specific
+    appearance: none;
     @include gradient-bg($form-range-thumb-bg);
     border: $form-range-thumb-border;
     @include border-radius($form-range-thumb-border-radius);
     @include box-shadow($form-range-thumb-box-shadow);
     @include transition($form-range-thumb-transition);
-    appearance: none;
 
     &:active {
       @include gradient-bg($form-range-thumb-active-bg);
@@ -54,12 +54,12 @@
   &::-moz-range-thumb {
     width: $form-range-thumb-width;
     height: $form-range-thumb-height;
+    appearance: none;
     @include gradient-bg($form-range-thumb-bg);
     border: $form-range-thumb-border;
     @include border-radius($form-range-thumb-border-radius);
     @include box-shadow($form-range-thumb-box-shadow);
     @include transition($form-range-thumb-transition);
-    appearance: none;
 
     &:active {
       @include gradient-bg($form-range-thumb-active-bg);
diff --git a/scss/forms/_form-select.scss b/scss/forms/_form-select.scss
index 0b26323ff..69ace529d 100644
--- a/scss/forms/_form-select.scss
+++ b/scss/forms/_form-select.scss
@@ -14,6 +14,7 @@
   font-weight: $form-select-font-weight;
   line-height: $form-select-line-height;
   color: $form-select-color;
+  appearance: none;
   background-color: $form-select-bg;
   background-image: var(--#{$prefix}form-select-bg-img), var(--#{$prefix}form-select-bg-icon, none);
   background-repeat: no-repeat;
@@ -23,7 +24,6 @@
   @include border-radius($form-select-border-radius, 0);
   @include box-shadow($form-select-box-shadow);
   @include transition($form-select-transition);
-  appearance: none;
 
   &:focus {
     border-color: $form-select-focus-border-color;
-- 
cgit v1.2.3


From cc5a8a903612e9c0de92238ac17dcb083efce138 Mon Sep 17 00:00:00 2001
From: louismaximepiton <louismaxime.piton@orange.com>
Date: Mon, 17 Jul 2023 12:08:24 +0200
Subject: fix

---
 scss/forms/_floating-labels.scss | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

(limited to 'scss/forms')

diff --git a/scss/forms/_floating-labels.scss b/scss/forms/_floating-labels.scss
index 3ca4264d7..2cf04704d 100644
--- a/scss/forms/_floating-labels.scss
+++ b/scss/forms/_floating-labels.scss
@@ -84,7 +84,8 @@
     }
   }
 
-  > :disabled ~ label {
+  > :disabled ~ label,
+  > .form-control:disabled ~ label { // Required for `.form-control`s because of specificity
     color: $form-floating-label-disabled-color;
 
     &::after {
-- 
cgit v1.2.3


From bb10c996d42610489534ccf532428419d447d3da Mon Sep 17 00:00:00 2001
From: Mahmut YILDIRIM <mahmutyildirim@outlook.com.tr>
Date: Wed, 13 Sep 2023 09:45:40 +0300
Subject: Add defensive CSS to handle form check input in fleboxes (#38955)

Co-authored-by: louismaxime.piton <louismaxime.piton@orange.com>
---
 scss/forms/_form-check.scss | 1 +
 1 file changed, 1 insertion(+)

(limited to 'scss/forms')

diff --git a/scss/forms/_form-check.scss b/scss/forms/_form-check.scss
index f8d9b08f8..d3a8fe60d 100644
--- a/scss/forms/_form-check.scss
+++ b/scss/forms/_form-check.scss
@@ -29,6 +29,7 @@
 .form-check-input {
   --#{$prefix}form-check-bg: #{$form-check-input-bg};
 
+  flex-shrink: 0;
   width: $form-check-input-width;
   height: $form-check-input-width;
   margin-top: ($line-height-base - $form-check-input-width) * .5; // line-height minus check height
-- 
cgit v1.2.3


From 9e5e22ad6a993fb1d87b496016604b49aa57e77d Mon Sep 17 00:00:00 2001
From: jonnysp <jonnysp@users.noreply.github.com>
Date: Thu, 14 Sep 2023 20:49:14 +0200
Subject: Fix border-radius of some switch variants when rounded is disabled
 (#38884)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Co-authored-by: Julien Déramond <juderamond@gmail.com>
---
 scss/forms/_form-check.scss | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'scss/forms')

diff --git a/scss/forms/_form-check.scss b/scss/forms/_form-check.scss
index d3a8fe60d..8a1b639df 100644
--- a/scss/forms/_form-check.scss
+++ b/scss/forms/_form-check.scss
@@ -131,7 +131,7 @@
     margin-left: $form-switch-padding-start * -1;
     background-image: var(--#{$prefix}form-switch-bg);
     background-position: left center;
-    @include border-radius($form-switch-border-radius);
+    @include border-radius($form-switch-border-radius, 0);
     @include transition($form-switch-transition);
 
     &:focus {
-- 
cgit v1.2.3


From e340674d06f1c5b054eb5395bac85a3cf36d3463 Mon Sep 17 00:00:00 2001
From: Tommaso Allegretti <61681908+TommasoAllegretti@users.noreply.github.com>
Date: Tue, 19 Mar 2024 06:47:42 +0100
Subject: Change floating label placeholder's color (#39494)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Co-authored-by: Louis-Maxime Piton <louismaxime.piton@orange.com>
Co-authored-by: Julien Déramond <juderamond@gmail.com>
---
 scss/forms/_floating-labels.scss | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

(limited to 'scss/forms')

diff --git a/scss/forms/_floating-labels.scss b/scss/forms/_floating-labels.scss
index 2cf04704d..1a6efc0a4 100644
--- a/scss/forms/_floating-labels.scss
+++ b/scss/forms/_floating-labels.scss
@@ -17,6 +17,7 @@
     height: 100%; // allow textareas
     padding: $form-floating-padding-y $form-floating-padding-x;
     overflow: hidden;
+    color: rgba(var(--#{$prefix}body-color-rgb), #{$form-floating-label-opacity});
     text-align: start;
     text-overflow: ellipsis;
     white-space: nowrap;
@@ -56,7 +57,6 @@
   > .form-control-plaintext,
   > .form-select {
     ~ label {
-      color: rgba(var(--#{$prefix}body-color-rgb), #{$form-floating-label-opacity});
       transform: $form-floating-label-transform;
 
       &::after {
@@ -73,7 +73,6 @@
   // Duplicated because `:-webkit-autofill` invalidates other selectors when grouped
   > .form-control:-webkit-autofill {
     ~ label {
-      color: rgba(var(--#{$prefix}body-color-rgb), #{$form-floating-label-opacity});
       transform: $form-floating-label-transform;
     }
   }
-- 
cgit v1.2.3


From b522441901040496664ba64beab37dbacd317881 Mon Sep 17 00:00:00 2001
From: Louis-Maxime Piton <louismaxime.piton@orange.com>
Date: Thu, 13 Jun 2024 03:39:23 +0200
Subject: Floating labels: Fix `max-width` and `background-color` (#39720)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* Fix `max-width`

* Fix label background color

* Add new visual test: floating label

* Fix `npm run docs`

---------

Co-authored-by: Julien Déramond <juderamond@gmail.com>
---
 scss/forms/_floating-labels.scss | 30 ++++++++++++++++--------------
 1 file changed, 16 insertions(+), 14 deletions(-)

(limited to 'scss/forms')

diff --git a/scss/forms/_floating-labels.scss b/scss/forms/_floating-labels.scss
index 1a6efc0a4..b36650588 100644
--- a/scss/forms/_floating-labels.scss
+++ b/scss/forms/_floating-labels.scss
@@ -14,6 +14,7 @@
     top: 0;
     left: 0;
     z-index: 2;
+    max-width: 100%;
     height: 100%; // allow textareas
     padding: $form-floating-padding-y $form-floating-padding-x;
     overflow: hidden;
@@ -58,16 +59,6 @@
   > .form-select {
     ~ label {
       transform: $form-floating-label-transform;
-
-      &::after {
-        position: absolute;
-        inset: $form-floating-padding-y ($form-floating-padding-x * .5);
-        z-index: -1;
-        height: $form-floating-label-height;
-        content: "";
-        background-color: $input-bg;
-        @include border-radius($input-border-radius);
-      }
     }
   }
   // Duplicated because `:-webkit-autofill` invalidates other selectors when grouped
@@ -76,6 +67,21 @@
       transform: $form-floating-label-transform;
     }
   }
+  > textarea:focus,
+  > textarea:not(:placeholder-shown) {
+    ~ label::after {
+      position: absolute;
+      inset: $form-floating-padding-y ($form-floating-padding-x * .5);
+      z-index: -1;
+      height: $form-floating-label-height;
+      content: "";
+      background-color: $input-bg;
+      @include border-radius($input-border-radius);
+    }
+  }
+  > textarea:disabled ~ label::after {
+    background-color: $input-disabled-bg;
+  }
 
   > .form-control-plaintext {
     ~ label {
@@ -86,9 +92,5 @@
   > :disabled ~ label,
   > .form-control:disabled ~ label { // Required for `.form-control`s because of specificity
     color: $form-floating-label-disabled-color;
-
-    &::after {
-      background-color: $input-disabled-bg;
-    }
   }
 }
-- 
cgit v1.2.3