feat: change layout styles to version 3

Author: woothu

package.json

@@ -14,7 +14,7 @@
     "test:e2e": "vue-cli-service test:e2e"
   },
   "dependencies": {
-    "@coreui/coreui": "^2.1.9",
+    "@coreui/coreui": "next",
     "@coreui/coreui-plugin-chartjs-custom-tooltips": "^1.3.0",
     "@coreui/coreui-vue-chartjs": "file:../coreui-vue-chartjs",
     "@coreui/icons": "0.3.0",

src/containers/DefaultContainer.vue

@@ -1,9 +1,9 @@
 <template>
-  <div class="app">
+  <div class="c-app c-default-layout">
     <TheHeader/>
-    <div class="app-body">
+    <div class="c-body">
       <TheSidebar/>
-      <main class="main">
+      <main class="c-main">
         <CBreadcrumbRouter/>
         <CContainer fluid>
           <router-view></router-view>

src/containers/DefaultHeaderDropdownAccnt.vue

@@ -1,19 +1,18 @@
 <template>
   <CDropdown
-    right
     nav
     noCaret
     noPopper
-    addMenuClasses="dropdown-menu-right"
+    addMenuClasses="c-dropdown-menu-right"
   >
     <template #button-content>
       <img
         src="img/avatars/6.jpg"
-        class="img-avatar"
+        class="c-img-avatar"
         alt="[email protected]"
       />
     </template>
-    <CDropdownHeader tag="div" class="text-center">
+    <CDropdownHeader tag="div" class="c-text-center">
       <strong>Account</strong>
     </CDropdownHeader>
     <CDropdownItem>
@@ -34,7 +33,7 @@
     </CDropdownItem>
     <CDropdownHeader
       tag="div"
-      class="text-center"
+      class="c-text-center"
     >
       <strong>Settings</strong>
     </CDropdownHeader>