diff --git a/src/views/base/Collapses.vue b/src/views/base/Collapses.vue
index 695a9dd4..287790f8 100644
--- a/src/views/base/Collapses.vue
+++ b/src/views/base/Collapses.vue
@@ -20,7 +20,7 @@
               <CCollapse toggler="collapse1" class="c-mt-2">
                 <CCard body-wrapper>
                   <p class="c-card-text">Collapse contents Here</p>
-                  <CButton id="collapse2" size="sm">
+                  <CButton id="collapse2" size="sm" variant="secondary">
                     Toggle Inner Collapse
                   </CButton>
                   <CCollapse toggler="collapse2" class="c-mt-2">
diff --git a/src/views/base/Navbars.vue b/src/views/base/Navbars.vue
index 790fd1f0..ae67ae3d 100644
--- a/src/views/base/Navbars.vue
+++ b/src/views/base/Navbars.vue
@@ -44,7 +44,6 @@
           <CNavbar
             toggleable="md"
             variant="info"
-            sticky
           >
             <CNavbarToggle @click="show=!show"/>
             <CNavbarBrand href="#">NavBar</CNavbarBrand>
@@ -100,8 +99,8 @@
           <!-- Image and text -->
           <CNavbar variant="faded" light>
             <CNavbarBrand href="#">
-              <img src="https://placekitten.com/g/30/30" class="c-d-inline-block c-align-top" alt="BV">
-              BootstrapVue
+              <img src="https://placekitten.com/g/30/30" class="c-d-inline-block c-align-top" alt="CoreuiVue">
+              CoreuiVue
             </CNavbarBrand>
           </CNavbar>
         </CCardBody>
@@ -114,7 +113,7 @@
         <CCardBody>
           <CNavbar toggleable="sm" light variant="light">
             <CNavbarToggle @click="navbarText=!navbarText"></CNavbarToggle>
-            <CNavbarBrand>BootstrapVue</CNavbarBrand>
+            <CNavbarBrand>CoreuiVue</CNavbarBrand>
             <CCollapse :show="navbarText" navbar>
               <CNavbarNav>
                 <span class="c-navbar-text">Navbar text</span>
@@ -129,9 +128,9 @@
           <small>dropdown</small>
         </CCardHeader>
         <CCardBody>
-          <CNavbar>
-            <!-- <CNavbarToggle @click="navbarDropdown = !navbarDropdown"></CNavbarToggle>
-            <CCollapse :show="navbarDropdown" navbar> -->
+          <CNavbar toggleable="sm" variant="primary">
+            <CNavbarToggle @click="navbarDropdown = !navbarDropdown"></CNavbarToggle>
+            <CCollapse :show="navbarDropdown" navbar>
               <CNavbarNav>
                 <CNavItem href="#">Home</CNavItem>
                 <CNavItem href="#">Link</CNavItem>
@@ -155,7 +154,7 @@
                   <CDropdownItem>Settings</CDropdownItem>
                 </CDropdown>
               </CNavbarNav>
-            <!-- </CCollapse> -->
+            </CCollapse>
           </CNavbar>
         </CCardBody>
       </CCard>
diff --git a/src/views/base/Table.vue b/src/views/base/Table.vue
index 955fb6ac..d71ff12b 100644
--- a/src/views/base/Table.vue
+++ b/src/views/base/Table.vue
@@ -10,7 +10,7 @@
       :fields="fields"
       :per-page="small ? 10 : 5"
       :dark="dark"
-      no-sorting
+      pagination      
     >
       <template #status="{item}">
         <td>
diff --git a/src/views/base/Tooltips.vue b/src/views/base/Tooltips.vue
index bf310834..f537c25c 100644
--- a/src/views/base/Tooltips.vue
+++ b/src/views/base/Tooltips.vue
@@ -16,23 +16,32 @@
           <CRow>
             <CCol col="4">
               <div class="c-text-center c-my-3">
-                <CButton v-c-tooltip.hover.click="'I am a tooltip!'">
+                <CButton 
+                  variant="secondary"
+                  v-c-tooltip.hover.click="'I am a tooltip!'"
+                >
                   Hover Me
                 </CButton>
               </div>
             </CCol>
             <CCol col="4">
               <div class="c-text-center c-my-3">
-                <CButton v-c-tooltip="{content: 'I start open!', active:true }">
+                <CButton 
+                  v-c-tooltip="{content: 'I start open!', active:true }"
+                  variant="secondary"
+                >
                   Hover me
                 </CButton>
               </div>
             </CCol>
             <CCol col="4">
               <div class="c-text-center c-my-3">
-                <CButton v-c-tooltip.click="
-                  'I am showing on click and hiding on click outside tooltip!'
-                ">
+                <CButton
+                  variant="secondary"
+                  v-c-tooltip.click="
+                    'I am showing on click and hiding on click outside tooltip!'
+                  "
+                >
                   Click me
                 </CButton>
               </div>
diff --git a/src/views/buttons/ButtonGroups.vue b/src/views/buttons/ButtonGroups.vue
index 628b8471..090bd9e2 100644
--- a/src/views/buttons/ButtonGroups.vue
+++ b/src/views/buttons/ButtonGroups.vue
@@ -16,11 +16,11 @@
             <CCardBody>
               <div>
                 <CButtonGroup>
-                  <CButton>One</CButton>
-                  <CButton>Two</CButton>
-                  <CButton>Three</CButton>
-                  <CButton>Four</CButton>
-                  <CButton class="c-d-sm-down-none">Five</CButton>
+                  <CButton variant="secondary">One</CButton>
+                  <CButton variant="secondary">Two</CButton>
+                  <CButton variant="secondary">Three</CButton>
+                  <CButton variant="secondary">Four</CButton>
+                  <CButton variant="secondary" class="c-d-sm-down-none">Five</CButton>
                 </CButtonGroup>
                 <br><br>
                 <CButtonGroup>
@@ -44,21 +44,21 @@
             <CCardBody>
               <div>
                 <CButtonGroup>
-                  <CButton>Left</CButton>
-                  <CButton>Middle</CButton>
-                  <CButton>Right</CButton>
+                  <CButton variant="secondary">Left</CButton>
+                  <CButton variant="secondary">Middle</CButton>
+                  <CButton variant="secondary">Right</CButton>
                 </CButtonGroup>
                 <br><br>
                 <CButtonGroup size="sm">
-                  <CButton>Left</CButton>
-                  <CButton>Middle</CButton>
-                  <CButton>Right</CButton>
+                  <CButton variant="secondary">Left</CButton>
+                  <CButton variant="secondary">Middle</CButton>
+                  <CButton variant="secondary">Right</CButton>
                 </CButtonGroup>
                 <br><br>
                 <CButtonGroup size="lg">
-                  <CButton>Left</CButton>
-                  <CButton>Middle</CButton>
-                  <CButton>Right</CButton>
+                  <CButton variant="secondary">Left</CButton>
+                  <CButton variant="secondary">Middle</CButton>
+                  <CButton variant="secondary">Right</CButton>
                 </CButtonGroup>
               </div>
             </CCardBody>
@@ -72,15 +72,15 @@
             <CCardBody>
               <div>
                 <CButtonGroup>
-                  <CButton class="c-d-sm-down-none">Button 1</CButton>
-                  <CButton class="c-d-sm-down-none">Button 2</CButton>
+                  <CButton variant="secondary" class="c-d-sm-down-none">Button 1</CButton>
+                  <CButton variant="secondary" class="c-d-sm-down-none">Button 2</CButton>
                   <CDropdown right text="Menu" variant="success">
                     <CDropdownItem>Item 1</CDropdownItem>
                     <CDropdownItem>Item 2</CDropdownItem>
                     <CDropdownDivider></CDropdownDivider>
                     <CDropdownItem>Item 3</CDropdownItem>
                   </CDropdown>
-                  <CButton class="c-d-sm-down-none">Button 3</CButton>
+                  <CButton variant="secondary" class="c-d-sm-down-none">Button 3</CButton>
                   <CDropdown right split text="Split Menu" variant="info">
                     <CDropdownItem>Item 1</CDropdownItem>
                     <CDropdownItem>Item 2</CDropdownItem>
@@ -101,9 +101,9 @@
             <CCardBody>
               <div>
                 <CButtonGroup vertical>
-                  <CButton>Top</CButton>
-                  <CButton>Middle</CButton>
-                  <CButton>Bottom</CButton>
+                  <CButton variant="secondary">Top</CButton>
+                  <CButton variant="secondary">Middle</CButton>
+                  <CButton variant="secondary">Bottom</CButton>
                 </CButtonGroup>
               </div>
             </CCardBody>
@@ -125,17 +125,17 @@
               <div>
                 <CButtonToolbar aria-label="Toolbar with button groups">
                   <CButtonGroup class="c-mx-1">
-                    <CButton class="c-d-sm-down-none">&laquo;</CButton>
-                    <CButton>&lsaquo;</CButton>
+                    <CButton variant="secondary" class="c-d-sm-down-none">&laquo;</CButton>
+                    <CButton variant="secondary">&lsaquo;</CButton>
                   </CButtonGroup>
                   <CButtonGroup class="c-mx-1">
-                    <CButton class="c-d-sm-down-none">Edit</CButton>
-                    <CButton>Undo</CButton>
-                    <CButton>Redo</CButton>
+                    <CButton variant="secondary" class="c-d-sm-down-none">Edit</CButton>
+                    <CButton variant="secondary">Undo</CButton>
+                    <CButton variant="secondary">Redo</CButton>
                   </CButtonGroup>
                   <CButtonGroup class="c-mx-1">
-                    <CButton>&rsaquo;</CButton>
-                    <CButton class="c-d-sm-down-none">&raquo;</CButton>
+                    <CButton variant="secondary">&rsaquo;</CButton>
+                    <CButton variant="secondary" class="c-d-sm-down-none">&raquo;</CButton>
                   </CButtonGroup>
                 </CButtonToolbar>
               </div>
@@ -146,8 +146,8 @@
                   class="c-d-sm-down-none"
                 >
                   <CButtonGroup size="sm" class="c-mx-1">
-                    <CButton>New</CButton>
-                    <CButton>Edit</CButton>
+                    <CButton variant="secondary">New</CButton>
+                    <CButton variant="secondary">Edit</CButton>
                   </CButtonGroup>
                   <CFormInput
                     class="c-mb-0 c-w-25 c-mx-1"
@@ -165,8 +165,8 @@
                     custom
                   />
                   <CButtonGroup size="sm" class="c-mx-1">
-                    <CButton>Save</CButton>
-                    <CButton>Cancel</CButton>
+                    <CButton variant="secondary">Save</CButton>
+                    <CButton variant="secondary">Cancel</CButton>
                   </CButtonGroup>
                 </CButtonToolbar>
               </div>
@@ -174,11 +174,12 @@
               <div>
                 <CButtonToolbar aria-label="Toolbar with button groups and dropdown menu">
                   <CButtonGroup class="c-mx-1 c-d-sm-down-none">
-                    <CButton>New</CButton>
-                    <CButton>Edit</CButton>
-                    <CButton>Undo</CButton>
+                    <CButton variant="secondary">New</CButton>
+                    <CButton variant="secondary">Edit</CButton>
+                    <CButton variant="secondary">Undo</CButton>
                   </CButtonGroup>
                   <CDropdown
+                    variant="secondary"
                     class="c-mx-1"
                     placement="bottom-end"
                     button-content="Menu"
@@ -188,8 +189,8 @@
                     <CDropdownItem>Item 3</CDropdownItem>
                   </CDropdown>
                   <CButtonGroup class="c-mx-1">
-                    <CButton>Save</CButton>
-                    <CButton>Cancel</CButton>
+                    <CButton variant="secondary">Save</CButton>
+                    <CButton variant="secondary">Cancel</CButton>
                   </CButtonGroup>
                 </CButtonToolbar>
               </div>
diff --git a/src/views/buttons/Dropdowns.vue b/src/views/buttons/Dropdowns.vue
index 0e18273d..752a7331 100644
--- a/src/views/buttons/Dropdowns.vue
+++ b/src/views/buttons/Dropdowns.vue
@@ -15,7 +15,11 @@
             </CCardHeader>
             <CCardBody>
               <div>
-                <CDropdown button-html="Dropdown Button" class="c-m-2">
+                <CDropdown 
+                  button-html="Dropdown Button" 
+                  class="c-m-2"
+                  variant="secondary"
+                >
                   <CDropdownItem>First Action</CDropdownItem>
                   <CDropdownItem>Second Action</CDropdownItem>
                   <CDropdownItem>Third Action</CDropdownItem>
@@ -33,7 +37,11 @@
                 </CDropdown>
               </div> -->
               <div>
-                <CDropdown button-html="Dropdown with divider" class="c-m-2">
+                <CDropdown 
+                  button-html="Dropdown with divider" 
+                  class="c-m-2"
+                  variant="secondary"
+                >
                   <CDropdownItem>First item</CDropdownItem>
                   <CDropdownItem>Second item</CDropdownItem>
                   <CDropdownDivider></CDropdownDivider>
@@ -41,7 +49,11 @@
                 </CDropdown>
               </div>
               <div>
-                <CDropdown button-html="Dropdown with header" class="c-m-2">
+                <CDropdown 
+                  button-html="Dropdown with header" 
+                  class="c-m-2"
+                  variant="secondary"
+                >
                   <CDropdownHeader>Dropdown header</CDropdownHeader>
                   <CDropdownItem>First item</CDropdownItem>
                   <CDropdownItem>Second Item</CDropdownItem>
@@ -93,6 +105,7 @@
               </div>
               <div>
                 <CDropdown
+                  variant="secondary"
                   :offset="25"
                   button-html="Offset Dropdown"
                   class="c-m-2"
@@ -104,6 +117,7 @@
               </div>
               <div>
                 <CDropdown
+                  variant="secondary"
                   split
                   button-html="Split Dropdown"
                   class="c-m-2"
@@ -151,6 +165,7 @@
             <CCardBody>
               <div>
                 <CDropdown
+                  variant="secondary"
                   size="lg"
                   button-html="Large"
                   class="c-m-2"
@@ -160,6 +175,7 @@
                   <CDropdownItem>Something else here</CDropdownItem>
                 </CDropdown>
                 <CDropdown
+                  variant="secondary"
                   size="lg"
                   split
                   button-html="Large Split"
@@ -171,6 +187,7 @@
                 </CDropdown>
                 <br>
                 <CDropdown
+                  variant="secondary"
                   size="sm"
                   button-html="Small"
                   class="c-m-2"
@@ -180,6 +197,7 @@
                   <CDropdownItem>Something else here...</CDropdownItem>
                 </CDropdown>
                 <CDropdown
+                  variant="secondary"
                   size="sm"
                   split button-html="Small Split"
                   class="c-m-2"
diff --git a/src/views/notifications/Alerts.vue b/src/views/notifications/Alerts.vue
index 369f34fc..3900304f 100644
--- a/src/views/notifications/Alerts.vue
+++ b/src/views/notifications/Alerts.vue
@@ -95,6 +95,7 @@
             </CCardHeader>
             <CCardBody>
               <CAlert
+                variant="secondary"
                 dismissible
                 :show.sync="dismissibleAlerts[0]"
               >
@@ -102,6 +103,7 @@
               </CAlert>
 
               <CAlert
+                variant="secondary"
                 dismissible
                 fade
                 :show.sync="dismissibleAlerts[1]"
@@ -110,6 +112,7 @@
               </CAlert>
 
               <CAlert
+                variant="secondary"
                 :show.sync="dismissibleAlerts[2]"
                 v-slot="{dismiss}"
                 class="c-alert-dismissible"
@@ -117,7 +120,7 @@
                 Dismissible Alert with custom button!
                 <CButton
                   class="c-position-absolute"
-                  variant="primary"
+                  variant="secondary"
                   style="right:10px;top: 50%;transform: translateY(-50%);"
                   textHtml="<i>Close</i>"
                   @click="dismiss"
diff --git a/src/views/notifications/Badges.vue b/src/views/notifications/Badges.vue
index f14f1ff9..6709c6b5 100644
--- a/src/views/notifications/Badges.vue
+++ b/src/views/notifications/Badges.vue
@@ -14,11 +14,11 @@
               </div> -->
             </CCardHeader>
             <CCardBody>
-              <h2>Example heading <CBadge>New</CBadge></h2>
-              <h3>Example heading <CBadge>New</CBadge></h3>
-              <h4>Example heading <CBadge>New</CBadge></h4>
-              <h5>Example heading <CBadge>New</CBadge></h5>
-              <h6>Example heading <CBadge>New</CBadge></h6>
+              <h2>Example heading <CBadge variant="primary">New</CBadge></h2>
+              <h3>Example heading <CBadge variant="primary">New</CBadge></h3>
+              <h4>Example heading <CBadge variant="primary">New</CBadge></h4>
+              <h5>Example heading <CBadge variant="primary">New</CBadge></h5>
+              <h6>Example heading <CBadge variant="primary">New</CBadge></h6>
             </CCardBody>
             <CCardFooter>
               <CButton variant="primary">
diff --git a/src/views/widgets/Widgets.vue b/src/views/widgets/Widgets.vue
index 668b74dd..3b1c4f8b 100644
--- a/src/views/widgets/Widgets.vue
+++ b/src/views/widgets/Widgets.vue
@@ -443,6 +443,7 @@
     <CRow>
       <CCol sm="6" lg="3">
         <CWidgetHeaderDetails
+          variant="primary"
           right-header="SALE"
           right-footer="Today 6:43 AM"
           left-header="$1.890,65"
diff --git a/src/views/widgets/WidgetsDropdown.vue b/src/views/widgets/WidgetsDropdown.vue
index 4dd04277..911f3ebd 100644
--- a/src/views/widgets/WidgetsDropdown.vue
+++ b/src/views/widgets/WidgetsDropdown.vue
@@ -1,7 +1,7 @@
 <template>
   <CRow>
     <CCol sm="6" lg="3">
-      <CWidgetDropdown header="9.823" text="Members online">
+      <CWidgetDropdown variant="primary" header="9.823" text="Members online">
         <template #default>
           <CDropdown
             class="c-float-right"