primer/css
1
1
Fork 0
mirror of https://github.com/primer/css.git synced 2024-12-01 12:42:32 +03:00
Code Issues Projects Releases Wiki Activity

Add .BtnGroup-parent

Browse Source
This commit is contained in:
Mu-An ✌️ Chiou 2018-07-02 10:01:41 -04:00
parent c8cab2fb7b
commit 4fe1a4cdea
2 changed files with 5 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
modules/primer-buttons/README.md
View File

@ -223,12 +223,12 @@ Have a hankering for a series of buttons that are attached to one another? Wrap
</div>
```
Add `.BtnGroup-form` to `<form>`s within `.BtnGroup`s for proper spacing and rounded corners.
Add `.BtnGroup-parent` to parent elements, like `<form>`s or `<details>`s, within `.BtnGroup`s for proper spacing and rounded corners.
```html
<div class="BtnGroup">
<button class="btn BtnGroup-item" type="button">Button</button>
<form class="BtnGroup-form">
<form class="BtnGroup-parent">
<button class="btn BtnGroup-item" type="button">Button in a form</button>
</form>
<button class="btn BtnGroup-item" type="button">Button</button>

3
modules/primer-buttons/lib/button-group.scss
View File

@ -38,12 +38,14 @@
border-right-width: 1px;
+ .BtnGroup-item,
+ .BtnGroup-parent .BtnGroup-item,
+ .BtnGroup-form .BtnGroup-item {
border-left-width: 0;
}
}
}
.BtnGroup-parent,
.BtnGroup-form {
float: left;
@ -72,6 +74,7 @@
}
+ .BtnGroup-item,
+ .BtnGroup-parent .BtnGroup-item,
+ .BtnGroup-form .BtnGroup-item {
border-left-width: 0;
}