gitadmin/admin
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor: update examples

Browse Source
This commit is contained in:
Łukasz Holeczek 2021-08-12 16:09:52 +02:00
parent ac31229a29
commit 9b847ae268
2 changed files with 31 additions and 44 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
src/views/components/buttons/button-groups/ButtonGroups.js
View File

@ -114,22 +114,19 @@ const ButtonGroups = () => {
<DocsExample href="components/button-group#checkbox-and-radio-button-groups">
<CButtonGroup role="group" aria-label="Basic checkbox toggle button group">
<CFormCheck
button
buttonVariant="outline"
button={{ variant: 'outline' }}
id="btncheck1"
autoComplete="off"
label="Checkbox 1"
/>
<CFormCheck
button
buttonVariant="outline"
button={{ variant: 'outline' }}
id="btncheck2"
autoComplete="off"
label="Checkbox 2"
/>
<CFormCheck
button
buttonVariant="outline"
button={{ variant: 'outline' }}
id="btncheck3"
autoComplete="off"
label="Checkbox 3"
@ -140,8 +137,7 @@ const ButtonGroups = () => {
<CButtonGroup role="group" aria-label="Basic checkbox toggle button group">
<CFormCheck
type="radio"
button
buttonVariant="outline"
button={{ variant: 'outline' }}
name="btnradio"
id="btnradio1"
autoComplete="off"
@ -149,8 +145,7 @@ const ButtonGroups = () => {
/>
<CFormCheck
type="radio"
button
buttonVariant="outline"
button={{ variant: 'outline' }}
name="btnradio"
id="btnradio2"
autoComplete="off"
@ -158,8 +153,7 @@ const ButtonGroups = () => {
/>
<CFormCheck
type="radio"
button
buttonVariant="outline"
button={{ variant: 'outline' }}
name="btnradio"
id="btnradio3"
autoComplete="off"
@ -413,9 +407,7 @@ const ButtonGroups = () => {
<CButtonGroup vertical role="group" aria-label="Vertical button group">
<CFormCheck
type="radio"
button
buttonColor="danger"
buttonVariant="outline"
button={{ color: 'danger', variant: 'outline' }}
name="vbtnradio"
id="vbtnradio1"
autoComplete="off"
@ -424,9 +416,7 @@ const ButtonGroups = () => {
/>
<CFormCheck
type="radio"
button
buttonColor="danger"
buttonVariant="outline"
button={{ color: 'danger', variant: 'outline' }}
name="vbtnradio"
id="vbtnradio2"
autoComplete="off"
@ -434,9 +424,7 @@ const ButtonGroups = () => {
/>
<CFormCheck
type="radio"
button
buttonColor="danger"
buttonVariant="outline"
button={{ color: 'danger', variant: 'outline' }}
name="vbtnradio"
id="vbtnradio3"
autoComplete="off"

45
src/views/components/forms/checks-radios/ChecksRadios.js
View File

@ -281,11 +281,16 @@ const ChecksRadios = () => {
further be grouped in a button group if needed.
</p>
<DocsExample href="forms/checks-radios#toggle-buttons">
<CFormCheck button id="btn-check" autoComplete="off" label="Single toggle" />
<CFormCheck
button={{ color: 'primary ' }}
id="btn-check"
autoComplete="off"
label="Single toggle"
/>
</DocsExample>
<DocsExample href="forms/checks-radios#toggle-buttons">
<CFormCheck
button
button={{ color: 'primary ' }}
id="btn-check-2"
autoComplete="off"
label="Checked"
@ -293,13 +298,18 @@ const ChecksRadios = () => {
/>
</DocsExample>
<DocsExample href="forms/checks-radios#toggle-buttons">
<CFormCheck button id="btn-check-3" autoComplete="off" label="Disabled" disabled />
<CFormCheck
button={{ color: 'primary ' }}
id="btn-check-3"
autoComplete="off"
label="Disabled"
disabled
/>
</DocsExample>
<h3>Radio toggle buttons</h3>
<DocsExample href="forms/checks-radios#toggle-buttons">
<CFormCheck
button
buttonColor="secondary"
button={{ color: 'secondary' }}
type="radio"
name="options"
id="option1"
@ -308,8 +318,7 @@ const ChecksRadios = () => {
defaultChecked
/>
<CFormCheck
button
buttonColor="secondary"
button={{ color: 'secondary' }}
type="radio"
name="options"
id="option2"
@ -317,8 +326,7 @@ const ChecksRadios = () => {
label="Radio"
/>
<CFormCheck
button
buttonColor="secondary"
button={{ color: 'secondary' }}
type="radio"
name="options"
id="option3"
@ -327,8 +335,7 @@ const ChecksRadios = () => {
disabled
/>
<CFormCheck
button
buttonColor="secondary"
button={{ color: 'secondary' }}
type="radio"
name="options"
id="option4"
@ -343,9 +350,7 @@ const ChecksRadios = () => {
<DocsExample href="forms/checks-radios#toggle-buttons">
<div>
<CFormCheck
button
buttonColor="primary"
buttonVariant="outline"
button={{ color: 'primary', variant: 'outline' }}
id="btn-check-outlined"
autoComplete="off"
label="Single toggle"
@ -353,9 +358,7 @@ const ChecksRadios = () => {
</div>
<div>
<CFormCheck
button
buttonColor="secondary"
buttonVariant="outline"
button={{ color: 'secondary', variant: 'outline' }}
id="btn-check-2-outlined"
autoComplete="off"
label="Checked"
@ -364,9 +367,7 @@ const ChecksRadios = () => {
</div>
<div>
<CFormCheck
button
buttonColor="success"
buttonVariant="outline"
button={{ color: 'success', variant: 'outline' }}
type="radio"
name="options-outlined"
id="success-outlined"
@ -375,9 +376,7 @@ const ChecksRadios = () => {
defaultChecked
/>
<CFormCheck
button
buttonColor="danger"
buttonVariant="outline"
button={{ color: 'danger', variant: 'outline' }}
type="radio"
name="options-outlined"
id="danger-outlined"