Merge pull request #346 from dabapps/327-checkbox-radius

Add override option for checkbox radius
dabapps · Mar 4, 2021 · d360135 · d360135
2 parents 5bad5c8 + 13d3d77
commit d360135
Show file tree

Hide file tree

Showing 5 changed files with 5 additions and 3 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@dabapps/roe",
-  "version": "0.12.2",
+  "version": "0.12.3",
   "description": "A collection of React components, styles, mixins, and atomic CSS classes to aid with the development of web applications.",
   "main": "dist/js/index.js",
   "types": "dist/js/index.d.ts",

diff --git a/src/less/overrides.less b/src/less/overrides.less
@@ -186,7 +186,7 @@ input[type='radio'] {
 }
 
 input[type='checkbox'] {
-  border-radius: @border-radius-base * 2;
+  border-radius: @checkbox-border-radius;
 
   &:checked {
     background-color: @checkbox-active-background;

diff --git a/src/less/variables.less b/src/less/variables.less
@@ -186,6 +186,7 @@
 @checkbox-icon-background: @checkbox-background;
 @checkbox-icon-border: 2px solid @checkbox-icon-background;
 @checkbox-shadow: inset 0 1px 1.5px 0 rgba(0, 0, 0, 0.1);
+@checkbox-border-radius: @border-radius-base * 2;
 
 @pagination-button-color: @grey-dark;
 @pagination-button-background: @grey-lighter;

diff --git a/src/ts/components/forms/form-group.examples.md b/src/ts/components/forms/form-group.examples.md
@@ -75,4 +75,5 @@
 @checkbox-icon-background: @checkbox-background;
 @checkbox-icon-border: 2px solid @checkbox-icon-background;
 @checkbox-shadow: inset 0 1px 1.5px 0 rgba(0, 0, 0, 0.1);
+@checkbox-border-radius: @border-radius-base * 2;
 ```