github-mirrors/kibana
1
0
Fork 0
mirror of https://github.com/elastic/kibana.git synced 2025-04-23 17:28:26 -04:00
Code Issues Projects Releases Packages Wiki Activity

Add support for ButtonGroups to contain a single Button.

Browse source
This commit is contained in:
CJ Cenizal 2016-12-19 15:00:38 -08:00
parent 7bf0bcf76f
commit 43eaa0546b
3 changed files with 19 additions and 1 deletions
Download patch file Download diff file Expand all files Collapse all files

7
src/ui_framework/components/button/_button_group.scss
View file

@ -15,6 +15,13 @@
border-bottom-left-radius: 0;
}
> .kuiButton:only-child {
border-top-right-radius: $buttonBorderRadius;
border-bottom-right-radius: $buttonBorderRadius;
border-top-left-radius: $buttonBorderRadius;
border-bottom-left-radius: $buttonBorderRadius;
}
.kuiButton + .kuiButton {
margin-left: 2px;
}

5
src/ui_framework/doc_site/src/views/button/button_example.jsx
View file

@ -35,7 +35,10 @@ export default createExample([{
}, {
title: 'ButtonGroup',
description: (
<p>Use the ButtonGroup to emphasize the relationships between a set of Buttons, and differentiate them from Buttons outside of the set.</p>
<div>
<p>Use the ButtonGroup to emphasize the relationships between a set of Buttons, and differentiate them from Buttons outside of the set.</p>
<p>They support containing a single Button, so that Buttons can be dynamically added and removed.</p>
</div>
),
html: require('./button_group.html'),
hasDarkTheme: false,

8
src/ui_framework/doc_site/src/views/button/button_group.html
View file

@ -9,3 +9,11 @@
Option C
</button>
</div>
<hr class="guideBreak">
<div class="kuiButtonGroup">
<button class="kuiButton kuiButton--basic">
Button group with one button
</button>
</div>