diff --git a/.all-contributorsrc b/.all-contributorsrc
index 6f68dd2a621c..120a3bf13b05 100644
--- a/.all-contributorsrc
+++ b/.all-contributorsrc
@@ -637,6 +637,15 @@
"contributions": [
"code"
]
+ },
+ {
+ "login": "DavidSCChen",
+ "name": "DavidSCChen",
+ "avatar_url": "https://avatars1.githubusercontent.com/u/54974983?v=4",
+ "profile": "https://github.com/DavidSCChen",
+ "contributions": [
+ "code"
+ ]
}
],
"commitConvention": "none"
diff --git a/README.md b/README.md
index 5204930ef77e..49d72eaf5a85 100644
--- a/README.md
+++ b/README.md
@@ -164,6 +164,9 @@ check out our [Contributing Guide](/.github/CONTRIBUTING.md) and our
Matt Chapman 💻 |
Boston Cartwright 💻 |
+
+ DavidSCChen 💻 |
+
diff --git a/packages/components/docs/sass.md b/packages/components/docs/sass.md
index 5e27e891ed87..4d881dc9926d 100644
--- a/packages/components/docs/sass.md
+++ b/packages/components/docs/sass.md
@@ -17031,12 +17031,12 @@ Checkbox styles
left: rem(6px);
width: rem(9px);
height: rem(5px);
- margin-top: rem(-3px);
+ margin-top: rem(-3px) /* rtl: 0rem */;
background: none;
border-bottom: 2px solid $inverse-01;
border-left: 2px solid $inverse-01;
- transform: scale(0) rotate(-45deg);
- transform-origin: bottom right;
+ transform: scale(0) rotate(-45deg) /* rtl: scale(0) rotate(45deg) */;
+ transform-origin: bottom right /* rtl: center */;
content: '';
}
@@ -17057,7 +17057,7 @@ Checkbox styles
// Display the check
.#{$prefix}--checkbox:checked + .#{$prefix}--checkbox-label::after,
.#{$prefix}--checkbox-label[data-contained-checkbox-state='true']::after {
- transform: scale(1) rotate(-45deg);
+ transform: scale(1) rotate(-45deg) /* rtl: scale(-1,1) rotate(45deg) */;
}
// Indeterminate symbol
diff --git a/packages/components/src/components/checkbox/_checkbox.scss b/packages/components/src/components/checkbox/_checkbox.scss
index 2430c6e1b4c6..8f4420ada376 100644
--- a/packages/components/src/components/checkbox/_checkbox.scss
+++ b/packages/components/src/components/checkbox/_checkbox.scss
@@ -101,12 +101,12 @@
left: rem(6px);
width: rem(9px);
height: rem(5px);
- margin-top: rem(-3px);
+ margin-top: rem(-3px) /* rtl: 0rem */;
background: none;
border-bottom: 2px solid $inverse-01;
border-left: 2px solid $inverse-01;
- transform: scale(0) rotate(-45deg);
- transform-origin: bottom right;
+ transform: scale(0) rotate(-45deg) /* rtl: scale(0) rotate(45deg) */;
+ transform-origin: bottom right /* rtl: center */;
content: '';
}
@@ -127,7 +127,7 @@
// Display the check
.#{$prefix}--checkbox:checked + .#{$prefix}--checkbox-label::after,
.#{$prefix}--checkbox-label[data-contained-checkbox-state='true']::after {
- transform: scale(1) rotate(-45deg);
+ transform: scale(1) rotate(-45deg) /* rtl: scale(-1,1) rotate(45deg) */;
}
// Indeterminate symbol