primer/css
1
1
Fork 0
mirror of https://github.com/primer/css.git synced 2024-09-20 13:17:29 +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> </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 ```html
<div class="BtnGroup"> <div class="BtnGroup">
<button class="btn BtnGroup-item" type="button">Button</button> <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> <button class="btn BtnGroup-item" type="button">Button in a form</button>
</form> </form>
<button class="btn BtnGroup-item" type="button">Button</button> <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; border-right-width: 1px;
+ .BtnGroup-item, + .BtnGroup-item,
+ .BtnGroup-parent .BtnGroup-item,
+ .BtnGroup-form .BtnGroup-item { + .BtnGroup-form .BtnGroup-item {
border-left-width: 0; border-left-width: 0;
} }
} }
} }
.BtnGroup-parent,
.BtnGroup-form { .BtnGroup-form {
float: left; float: left;
@ -72,6 +74,7 @@
} }
+ .BtnGroup-item, + .BtnGroup-item,
+ .BtnGroup-parent .BtnGroup-item,
+ .BtnGroup-form .BtnGroup-item { + .BtnGroup-form .BtnGroup-item {
border-left-width: 0; border-left-width: 0;
} }