feat: add CSwitch examples to forms

coreui · Aug 12, 2020 · b31e452 · b31e452
1 parent eef84db
commit b31e452
Show file tree

Hide file tree

Showing 2 changed files with 47 additions and 2 deletions.
diff --git a/src/views/base/forms/BasicForms.js b/src/views/base/forms/BasicForms.js
@@ -28,7 +28,8 @@ import {
   CInputGroupText,
   CLabel,
   CSelect,
-  CRow
+  CRow,
+  CSwitch
 } from '@coreui/react'
 import CIcon from '@coreui/icons-react'
 import { DocsLink } from 'src/reusable'
@@ -285,6 +286,50 @@ const BasicForms = () => {
                     </CSelect>
                   </CCol>
                 </CFormGroup>
+                <CFormGroup row>
+                  <CCol tag="label" sm="3" className="col-form-label">
+                    Switch checkboxes
+                  </CCol>
+                  <CCol sm="9">
+                    <CSwitch
+                      className="mr-1"
+                      color="primary"
+                      defaultChecked
+                    />
+                    <CSwitch
+                      className="mr-1"
+                      color="success"
+                      defaultChecked
+                      variant="outline"
+                    />
+                    <CSwitch
+                      className="mr-1"
+                      color="warning"
+                      defaultChecked
+                      variant="opposite"
+                    />
+                    <CSwitch
+                      className="mr-1"
+                      color="danger"
+                      defaultChecked
+                      shape="pill"
+                    />
+                    <CSwitch
+                      className="mr-1"
+                      color="info"
+                      defaultChecked
+                      shape="pill"
+                      variant="outline"
+                    />
+                    <CSwitch
+                      className="mr-1"
+                      color="dark"
+                      defaultChecked
+                      shape="pill"
+                      variant="opposite"
+                    />
+                  </CCol>
+                </CFormGroup>
                 <CFormGroup row>
                   <CCol md="3">
                     <CLabel>Radios</CLabel>

diff --git a/src/views/notifications/alerts/Alerts.js b/src/views/notifications/alerts/Alerts.js
@@ -163,7 +163,7 @@ const Alerts = () => {
                 />
               </CAlert>
 
-              <CButton onClick={() => setVisible(10)}>
+              <CButton color="primary" onClick={() => setVisible(10)}>
                 Reset timer
               </CButton>
             </CCardBody>