Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Using the same --inList styles for checkboxes and radios without labels #542

Merged
merged 4 commits into from
Mar 20, 2018
Merged

Using the same --inList styles for checkboxes and radios without labels #542

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
05afe24
Using the same `--inList` styles for checkboxes and radios without la…
Mar 20, 2018
8ac3a15
Revert doc changes
Mar 20, 2018
2fe1e43
changelog
Mar 20, 2018
672fd6d
Merge branch 'master' into 541-checkbox-no-label
cchaos Mar 20, 2018
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions CHANGELOG.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@

- Made `EuiIconTip` screen reader accessible ([#534](https://github.com/elastic/eui/pull/534))
- Fixed a sorting issue in `EuiInMemoryTable` ([#453](https://github.com/elastic/eui/pull/453))
- Fix checkbox click for `EuiCheckbox` and `EuiRadio` without a label ([#541](https://github.com/elastic/eui/pull/541))

# [`0.0.30`](https://github.com/elastic/eui/tree/v0.0.30)

Expand Down
8 changes: 4 additions & 4 deletions src/components/form/checkbox/__snapshots__/checkbox.test.js.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@

exports[`EuiCheckbox is rendered 1`] = `
<div
class="euiCheckbox testClass1 testClass2"
class="euiCheckbox euiCheckbox--noLabel testClass1 testClass2"
>
<input
aria-label="aria-label"
Expand All @@ -19,7 +19,7 @@ exports[`EuiCheckbox is rendered 1`] = `

exports[`EuiCheckbox props check is rendered 1`] = `
<div
class="euiCheckbox"
class="euiCheckbox euiCheckbox--noLabel"
>
<input
checked=""
Expand All @@ -35,7 +35,7 @@ exports[`EuiCheckbox props check is rendered 1`] = `

exports[`EuiCheckbox props disabled disabled is rendered 1`] = `
<div
class="euiCheckbox"
class="euiCheckbox euiCheckbox--noLabel"
>
<input
class="euiCheckbox__input"
Expand Down Expand Up @@ -74,7 +74,7 @@ exports[`EuiCheckbox props label is rendered 1`] = `

exports[`EuiCheckbox props type inList is rendered 1`] = `
<div
class="euiCheckbox euiCheckbox--inList"
class="euiCheckbox euiCheckbox--inList euiCheckbox--noLabel"
>
<input
class="euiCheckbox__input"
Expand Down
3 changes: 2 additions & 1 deletion src/components/form/checkbox/_checkbox.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -72,7 +72,8 @@
* they actually click this input.
*/

&.euiCheckbox--inList {
&.euiCheckbox--inList,
&.euiCheckbox--noLabel {
min-height: $euiCheckBoxSize;
min-width: $euiCheckBoxSize;

Expand Down
3 changes: 3 additions & 0 deletions src/components/form/checkbox/checkbox.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -21,6 +21,9 @@ export const EuiCheckbox = ({
const classes = classNames(
'euiCheckbox',
typeToClassNameMap[type],
{
'euiCheckbox--noLabel': !label
},
className
);

Expand Down
6 changes: 3 additions & 3 deletions src/components/form/radio/__snapshots__/radio.test.js.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
exports[`EuiRadio is rendered 1`] = `
<div
aria-label="aria-label"
class="euiRadio testClass1 testClass2"
class="euiRadio euiRadio--noLabel testClass1 testClass2"
data-test-subj="test subject string"
>
<input
Expand All @@ -19,7 +19,7 @@ exports[`EuiRadio is rendered 1`] = `

exports[`EuiRadio props checked is rendered 1`] = `
<div
class="euiRadio"
class="euiRadio euiRadio--noLabel"
>
<input
checked=""
Expand All @@ -35,7 +35,7 @@ exports[`EuiRadio props checked is rendered 1`] = `

exports[`EuiRadio props disabled is rendered 1`] = `
<div
class="euiRadio"
class="euiRadio euiRadio--noLabel"
>
<input
class="euiRadio__input"
Expand Down
3 changes: 2 additions & 1 deletion src/components/form/radio/_radio.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -60,7 +60,8 @@
* they actually click this input.
*/

&.euiRadio--inList {
&.euiRadio--inList,
&.euiRadio--noLabel {
min-height: $euiRadioSize;
min-width: $euiRadioSize;

Expand Down
3 changes: 3 additions & 0 deletions src/components/form/radio/radio.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,9 @@ export const EuiRadio = ({
}) => {
const classes = classNames(
'euiRadio',
{
'euiRadio--noLabel': !label
},
className
);

Expand Down