From 2f704dc60b2f66ec9d5130c590f04d93ee5eb74f Mon Sep 17 00:00:00 2001
From: woothu <32914662+woothu@users.noreply.github.com>
Date: Sat, 10 Aug 2019 17:25:59 +0200
Subject: [PATCH] fix: small fixes

---
 src/containers/DefaultHeaderDropdownAccnt.vue |  2 +-
 src/containers/TheHeader.vue                  | 20 +++-
 src/containers/TheSidebar.vue                 |  8 +-
 src/containers/_nav.js                        | 10 +-
 src/views/Dashboard.vue                       |  4 +-
 src/views/base/Breadcrumbs.vue                | 93 ++++++++++++-------
 src/views/buttons/Dropdowns.vue               | 83 +++++++++--------
 src/views/icons/Brands.vue                    |  7 --
 src/views/widgets/Widgets.vue                 | 20 ++--
 src/views/widgets/WidgetsBrand.vue            | 10 +-
 src/views/widgets/WidgetsDropdown.vue         | 15 ++-
 11 files changed, 156 insertions(+), 116 deletions(-)

diff --git a/src/containers/DefaultHeaderDropdownAccnt.vue b/src/containers/DefaultHeaderDropdownAccnt.vue
index 1b376f62..af26ebdf 100644
--- a/src/containers/DefaultHeaderDropdownAccnt.vue
+++ b/src/containers/DefaultHeaderDropdownAccnt.vue
@@ -5,7 +5,7 @@
     no-popper
     add-menu-classes="c-dropdown-menu-right"
   >
-    <template #button-content>
+    <template #toggler-content>
       <img
         src="img/avatars/6.jpg"
         class="c-img-avatar"
diff --git a/src/containers/TheHeader.vue b/src/containers/TheHeader.vue
index 4b8ede03..ecd4139f 100644
--- a/src/containers/TheHeader.vue
+++ b/src/containers/TheHeader.vue
@@ -4,13 +4,25 @@
       class="c-header-toggler c-d-lg-none"
       v-c-emit-root-event:c-sidebar-toggle
     />
-    <CLink class="c-header-brand" to="#">
-      <img class="c-navbar-brand-full" src="img/brand/logo.svg" width="89" height="25" alt="CoreUI Logo">
-      <!-- <img class="c-navbar-brand-minimized" src="img/brand/sygnet.svg" width="30" height="30" alt="CoreUI Logo"> -->
+    <CLink class="c-header-brand" to="/">
+      <img 
+        class="c-navbar-brand-full" 
+        src="img/brand/logo.svg" 
+        width="89" 
+        height="25" 
+        alt="CoreUI Logo"
+      >
+      <!-- <img 
+        class="c-navbar-brand-minimized" 
+        src="img/brand/sygnet.svg" 
+        width="30" 
+        height="30" 
+        alt="CoreUI Logo"
+      > -->
     </CLink>
     <CSidebarToggler 
       class="c-header-toggler c-d-md-down-none" 
-      v-c-emit-root-event:c-sidebar-toggle  
+      v-c-emit-root-event:c-sidebar-toggle
     />
     <ul class="c-header-nav c-d-md-down-none">
       <CNavItem class="c-px-3" to="/dashboard">Dashboard</CNavItem>
diff --git a/src/containers/TheSidebar.vue b/src/containers/TheSidebar.vue
index 4f6fda57..f71e3f5f 100644
--- a/src/containers/TheSidebar.vue
+++ b/src/containers/TheSidebar.vue
@@ -1,10 +1,14 @@
 <template>
-  <CSidebar fixed :minimize="minimize">
+  <CSidebar 
+    fixed 
+    :minimize="minimize"
+    dropdownBehaviors="closeOnInactiveRoute"
+  >
     <CSidebarHeader/>
     <CSidebarForm/>
     <CSidebarNav :nav-items="computedNav"/>
     <CSidebarFooter/>
-    <CSidebarMinimizer @click="minimize = !minimize"/>
+    <CSidebarMinimizer @click.native="minimize = !minimize"/>
   </CSidebar>
 </template>
 
diff --git a/src/containers/_nav.js b/src/containers/_nav.js
index 0615cbdf..984c4905 100644
--- a/src/containers/_nav.js
+++ b/src/containers/_nav.js
@@ -39,7 +39,7 @@ export default {
     },
     {
       name: 'Base',
-      url: '/base',
+      route: '/base',
       icon: 'cui-puzzle',
       children: [
         {
@@ -126,7 +126,7 @@ export default {
     },
     {
       name: 'Buttons',
-      url: '/buttons',
+      route: '/buttons',
       icon: 'cui-cursor',
       children: [
         {
@@ -158,7 +158,7 @@ export default {
     },
     {
       name: 'Icons',
-      url: '/icons',
+      route: '/icons',
       icon: 'cui-star',
       children: [
         {
@@ -184,7 +184,7 @@ export default {
     },
     {
       name: 'Notifications',
-      url: '/notifications',
+      route: '/notifications',
       icon: 'cui-bell',
       children: [
         {
@@ -222,7 +222,7 @@ export default {
     },
     {
       name: 'Pages',
-      url: '/pages',
+      route: '/pages',
       icon: 'cui-star',
       children: [
         {
diff --git a/src/views/Dashboard.vue b/src/views/Dashboard.vue
index dbf15ce0..194a49cd 100644
--- a/src/views/Dashboard.vue
+++ b/src/views/Dashboard.vue
@@ -452,15 +452,13 @@
 import MainChartExample from './charts/MainChartExample'
 import WidgetsDropdown from './widgets/WidgetsDropdown'
 import WidgetsBrand from './widgets/WidgetsBrand'
-import CChartLineSimple from './charts/CChartLineSimple'
 
 export default {
   name: 'Dashboard',
   components: {
     MainChartExample,
     WidgetsDropdown,
-    WidgetsBrand,
-    CChartLineSimple
+    WidgetsBrand
   },
   data () {
     return {
diff --git a/src/views/base/Breadcrumbs.vue b/src/views/base/Breadcrumbs.vue
index 98dfc238..4e2be6d0 100644
--- a/src/views/base/Breadcrumbs.vue
+++ b/src/views/base/Breadcrumbs.vue
@@ -18,7 +18,7 @@
               </div>
             </CCardHeader>
             <CCardBody>
-              <CBreadcrumb :items="items" add-link-classes="sss" last-item-classes="aaa"/>
+              <CBreadcrumb :items="items"/>
               <CBreadcrumb :items="items2"/>
               <CBreadcrumb :items="items3"/>
             </CCardBody>
@@ -34,46 +34,67 @@ export default {
   name: 'breadcrumbs',
   data () {
     return {
-      items: [{
-        textHtml: '<b>Admin</b>',
-        href: '#'
-      }, {
-        textHtml: 'Manage',
-        href: '#'
-      }, {
-        textHtml: 'Library'
-      }],
+      items: [
+        {
+          textHtml: '<b>Admin</b>',
+          href: '#'
+        }, 
+        {
+          textHtml: 'Manage',
+          href: '#'
+        }, 
+        {
+          textHtml: 'Library'
+        }
+      ],
 
 
-      items2: [{
-        textHtml: 'Go to dashboard',
-        to: '/dashboard'
-      }, {
-        textHtml: 'Go to widgets',
-        to: '/Widgets'
-      }, {
-        textHtml: 'Go to Google',
-        href: 'http://google.com'
-      },{
-        textHtml: 'Current page'
-      }],
+      items2: [
+        {
+          textHtml: 'Go to dashboard',
+          to: '/dashboard'
+        }, 
+        {
+          textHtml: 'Go to widgets',
+          to: '/Widgets'
+        }, 
+        {
+          textHtml: 'Go to Google',
+          href: 'http://google.com'
+        },
+        {
+          textHtml: 'Current page'
+        }
+      ],
 
 
-      items3: [{
-        textHtml: 'Link',
-        to: '#2',
-        activeClass: 'c-bg-info c-p-1'
-      }, {
-        textHtml: 'Active',
-        to: '#3',
-        activeClass: 'c-bg-warning c-p-1',
-        addLinkClasses: 'c-bg-info c-p-1'
-      },{
-        textHtml: 'Classes',
-        to: '#4',
-        activeClass: 'c-bg-danger c-p-1',
-      }]
+      items3: [
+        {
+          textHtml: 'Added',
+          to: '#2',
+          addClasses: 'c-font-xl'
+        }, 
+        {
+          textHtml: 'Custom',
+          to: '#3',
+          addClasses: 'c-font-xl'
+        },
+        {
+          textHtml: 'Classes',
+          to: '#4',
+          addClasses: 'c-font-xl c-text-danger'
+        }
+      ]
     }
   }
 }
 </script>
+
+<style>
+  .c-breadcrumb-item + .c-font-xl.c-breadcrumb-item::before {
+    color: rgb(140, 195, 38);
+    content: '>>';
+    padding: 0px 10px;
+
+  }
+</style>
diff --git a/src/views/buttons/Dropdowns.vue b/src/views/buttons/Dropdowns.vue
index 81fb00dd..ffb90a3c 100644
--- a/src/views/buttons/Dropdowns.vue
+++ b/src/views/buttons/Dropdowns.vue
@@ -21,7 +21,7 @@
             <CCardBody>
               <div>
                 <CDropdown 
-                  button-html="Dropdown Button" 
+                  toggler-text="Dropdown Button" 
                   class="c-m-2"
                   variant="secondary"
                 >
@@ -34,7 +34,7 @@
                 </CDropdown>
               </div>
               <!-- <div>
-                <CDropdown button-html="Dropdown using buttons as menu items" class="c-m-2">
+                <CDropdown toggler-text="Dropdown using buttons as menu items" class="c-m-2">
                   <CDropdownItem>I'm a button</CDropdownItem>
                   <CDropdownItem>I'm also a button</CDropdownItem>
                   <CDropdownItem disabled>I'm a button, but disabled!</CDropdownItem>
@@ -43,7 +43,7 @@
               </div> -->
               <div>
                 <CDropdown 
-                  button-html="Dropdown with divider" 
+                  toggler-text="Dropdown with divider" 
                   class="c-m-2"
                   variant="secondary"
                 >
@@ -55,7 +55,7 @@
               </div>
               <div>
                 <CDropdown 
-                  button-html="Dropdown with header" 
+                  toggler-text="Dropdown with header" 
                   class="c-m-2"
                   variant="secondary"
                 >
@@ -77,9 +77,9 @@
             <CCardBody>
               <div>
                 <CDropdown
-                  button-html="Left align"
+                  toggler-text="Left align"
                   variant="primary"
-                  class="c-m-2"
+                  class="c-m-2 c-d-inline-block"
                 >
                   <CDropdownItem>Action</CDropdownItem>
                   <CDropdownItem>Another action</CDropdownItem>
@@ -87,9 +87,9 @@
                 </CDropdown>
                 <CDropdown
                   placement="bottom-end"
-                  button-html="Right align"
+                  toggler-text="Right align"
                   variant="primary"
-                  class="c-m-2"
+                  class="c-m-2 c-d-inline-block"
                 >
                   <CDropdownItem>Action</CDropdownItem>
                   <CDropdownItem>Another action</CDropdownItem>
@@ -98,10 +98,11 @@
               </div>
               <div>
                 <CDropdown
-                  button-html="Drop-Up"
+                  toggler-text="Drop-Up"
                   variant="info"
                   class="c-m-2"
-                  dropup
+                  placement="top-start"
+
                 >
                   <CDropdownItem>Action</CDropdownItem>
                   <CDropdownItem>Another action</CDropdownItem>
@@ -112,7 +113,7 @@
                 <CDropdown
                   variant="secondary"
                   :offset="25"
-                  button-html="Offset Dropdown"
+                  toggler-text="Offset Dropdown"
                   class="c-m-2"
                 >
                   <CDropdownItem>Action</CDropdownItem>
@@ -124,7 +125,7 @@
                 <CDropdown
                   variant="secondary"
                   split
-                  button-html="Split Dropdown"
+                  toggler-text="Split Dropdown"
                   class="c-m-2"
                 >
                   <CDropdownItem>Action</CDropdownItem>
@@ -149,9 +150,11 @@
                 <CDropdown
                   variant="link"
                   size="lg"
-                  buttonHtml="&#x1f50d;<span class='sr-only'>Search</span>"
                   no-caret
                 >
+                  <template #toggler-content>
+                    &#x1f50d;<span class="sr-only">Search</span>
+                  </template>
                   <CDropdownItem>Action</CDropdownItem>
                   <CDropdownItem>Another action</CDropdownItem>
                   <CDropdownItem>Something else here...</CDropdownItem>
@@ -172,8 +175,8 @@
                 <CDropdown
                   variant="secondary"
                   size="lg"
-                  button-html="Large"
-                  class="c-m-2"
+                  toggler-text="Large"
+                  class="c-m-2 c-d-inline-block"
                 >
                   <CDropdownItem>Action</CDropdownItem>
                   <CDropdownItem>Another action</CDropdownItem>
@@ -183,7 +186,7 @@
                   variant="secondary"
                   size="lg"
                   split
-                  button-html="Large Split"
+                  toggler-text="Large Split"
                   class="c-m-2"
                 >
                   <CDropdownItem>Action</CDropdownItem>
@@ -194,8 +197,8 @@
                 <CDropdown
                   variant="secondary"
                   size="sm"
-                  button-html="Small"
-                  class="c-m-2"
+                  toggler-text="Small"
+                  class="c-m-2 c-d-inline-block"
                 >
                   <CDropdownItem>Action</CDropdownItem>
                   <CDropdownItem>Another action</CDropdownItem>
@@ -204,7 +207,7 @@
                 <CDropdown
                   variant="secondary"
                   size="sm"
-                  split button-html="Small Split"
+                  split toggler-text="Small Split"
                   class="c-m-2"
                 >
                   <CDropdownItem>Action</CDropdownItem>
@@ -217,7 +220,7 @@
         </CCol>
       </CRow>
       <CRow>
-        <!-- <CCol col="12" md="6">
+        <CCol col="12" md="6">
           <CCard>
             <CCardHeader>
               <i class="fa fa-align-justify"></i>
@@ -227,7 +230,7 @@
             <CCardBody>
               <div>
                 <CDropdown
-                  button-html="Dropdown ARIA" variant="primary"
+                  toggler-text="Dropdown ARIA" variant="primary"
                   class="c-m-2"
                 >
                   <div role="group">
@@ -248,7 +251,7 @@
               </div>
             </CCardBody>
           </CCard>
-        </CCol> -->
+        </CCol>
         <CCol col="12" md="6">
           <CCard>
             <CCardHeader>
@@ -259,9 +262,9 @@
             <CCardBody>
               <CDropdown
                 size="sm"
-                button-html="Primary"
+                toggler-text="Primary"
                 variant="primary"
-                class="c-m-0"
+                class="c-m-0 c-d-inline-block"
               >
                 <CDropdownItem>First Action</CDropdownItem>
                 <CDropdownItem>Second Action</CDropdownItem>
@@ -269,9 +272,9 @@
               </CDropdown>
               <CDropdown
                 size="sm"
-                button-html="Secondary"
+                toggler-text="Secondary"
                 variant="secondary"
-                class="c-m-0"
+                class="c-m-0 c-d-inline-block"
               >
                 <CDropdownItem>First Action</CDropdownItem>
                 <CDropdownItem>Second Action</CDropdownItem>
@@ -279,9 +282,9 @@
               </CDropdown>
               <CDropdown
                 size="sm"
-                button-html="Success"
+                toggler-text="Success"
                 variant="success"
-                class="c-m-0"
+                class="c-m-0 c-d-inline-block"
               >
                 <CDropdownItem>First Action</CDropdownItem>
                 <CDropdownItem>Second Action</CDropdownItem>
@@ -289,9 +292,9 @@
               </CDropdown>
               <CDropdown
                 size="sm"
-                button-html="Warning"
+                toggler-text="Warning"
                 variant="warning"
-                class="c-m-0"
+                class="c-m-0 c-d-inline-block"
               >
                 <CDropdownItem>First Action</CDropdownItem>
                 <CDropdownItem>Second Action</CDropdownItem>
@@ -299,9 +302,9 @@
               </CDropdown>
               <CDropdown
                 size="sm"
-                button-html="Danger"
+                toggler-text="Danger"
                 variant="danger"
-                class="c-m-0"
+                class="c-m-0 c-d-inline-block"
               >
                 <CDropdownItem>First Action</CDropdownItem>
                 <CDropdownItem>Second Action</CDropdownItem>
@@ -309,9 +312,9 @@
               </CDropdown>
               <CDropdown
                 size="sm"
-                button-html="Info"
+                toggler-text="Info"
                 variant="info"
-                class="c-m-0"
+                class="c-m-0 c-d-inline-block"
               >
                 <CDropdownItem>First Action</CDropdownItem>
                 <CDropdownItem>Second Action</CDropdownItem>
@@ -319,9 +322,9 @@
               </CDropdown>
               <CDropdown
                 size="sm"
-                button-html="Light"
+                toggler-text="Light"
                 variant="light"
-                class="c-m-0"
+                class="c-m-0 c-d-inline-block"
               >
                 <CDropdownItem>First Action</CDropdownItem>
                 <CDropdownItem>Second Action</CDropdownItem>
@@ -329,9 +332,9 @@
               </CDropdown>
               <CDropdown
                 size="sm"
-                button-html="Dark"
+                toggler-text="Dark"
                 variant="dark"
-                class="c-m-0"
+                class="c-m-0 c-d-inline-block"
               >
                 <CDropdownItem>First Action</CDropdownItem>
                 <CDropdownItem>Second Action</CDropdownItem>
@@ -339,9 +342,9 @@
               </CDropdown>
               <CDropdown
                 size="sm"
-                button-html="Link"
+                toggler-text="Link"
                 variant="link"
-                class="c-m-0"
+                class="c-m-0 c-d-inline-block"
               >
                 <CDropdownItem>First Action</CDropdownItem>
                 <CDropdownItem>Second Action</CDropdownItem>
diff --git a/src/views/icons/Brands.vue b/src/views/icons/Brands.vue
index 74db47ce..3e4dc422 100644
--- a/src/views/icons/Brands.vue
+++ b/src/views/icons/Brands.vue
@@ -6,13 +6,6 @@
       </CCardHeader>
       <CCardBody>
         <CRow class="c-text-center">
-          <CCol class="c-mb-5" col="12">
-            <!-- For using the flags inline with text add the classes
-            <code>.flag-icon</code> and <code>.flag-icon-xx</code>
-            (where xx is the ISO 3166-1-alpha-2 code of a country) to an empty
-            span. If you want to have a squared version flag then add the class
-            flag-icon-squared as well. -->
-          </CCol>
           <template v-for="(brand, brandName) in $options.brands">
             <CCol
               class="c-mb-5"
diff --git a/src/views/widgets/Widgets.vue b/src/views/widgets/Widgets.vue
index 6a5f6fb3..5b7e187a 100644
--- a/src/views/widgets/Widgets.vue
+++ b/src/views/widgets/Widgets.vue
@@ -140,7 +140,7 @@
           header="$1.999,50"
           text="Income"
           variant="primary"
-          no-padding
+          no-icon-padding
         >
           <CIcon name="settings" width="24"/>
         </CWidgetIcon>
@@ -150,7 +150,7 @@
           header="$1.999,50"
           text="Income"
           variant="info"
-          no-padding
+          no-icon-padding
         >
           <CIcon name="laptop" width="24"/>
         </CWidgetIcon>
@@ -160,7 +160,7 @@
           header="$1.999,50"
           text="Income"
           variant="warning"
-          no-padding
+          no-icon-padding
         >
           <CIcon name="moon" width="24"/>
         </CWidgetIcon>
@@ -170,7 +170,7 @@
           header="$1.999,50"
           text="Income"
           variant="danger"
-          no-padding
+          no-icon-padding
         >
           <CIcon name="bell" width="24"/>
         </CWidgetIcon>
@@ -182,7 +182,7 @@
           header="$1.999,50"
           text="Income"
           variant="primary"
-          no-padding
+          no-icon-padding
         >
           <CIcon name="settings" class="c-mx-5 " width="24"/>
         </CWidgetIcon>
@@ -192,7 +192,7 @@
           header="$1.999,50"
           text="Income"
           variant="info"
-          no-padding
+          no-icon-padding
         >
           <CIcon name="laptop" class="c-mx-5 " width="24"/>
         </CWidgetIcon>
@@ -202,7 +202,7 @@
           header="$1.999,50"
           text="Income"
           variant="warning"
-          no-padding
+          no-icon-padding
         >
           <CIcon name="moon" class="c-mx-5 " width="24"/>
           <template #footer>
@@ -225,7 +225,7 @@
           header="$1.999,50"
           text="Income"
           variant="primary"
-          no-padding
+          no-icon-padding
           link="#"
         >
           <CIcon name="settings" class="c-mx-5 " width="24"/>
@@ -236,7 +236,7 @@
           header="$1.999,50"
           text="Income"
           variant="info"
-          no-padding
+          no-icon-padding
           link="#"
         >
           <CIcon name="laptop" class="c-mx-5 " width="24"/>
@@ -247,7 +247,7 @@
           header="$1.999,50"
           text="Income"
           variant="warning"
-          no-padding
+          no-icon-padding
           link="#"
         >
           <CIcon name="moon" class="c-mx-5" width="24"/>
diff --git a/src/views/widgets/WidgetsBrand.vue b/src/views/widgets/WidgetsBrand.vue
index 89bb2d38..75a21514 100644
--- a/src/views/widgets/WidgetsBrand.vue
+++ b/src/views/widgets/WidgetsBrand.vue
@@ -11,7 +11,7 @@
         >
           <CIcon
             name="socialFacebook"
-            height="56"
+            height="52"
             class="c-my-4"
           />
           <CChartLineSimple
@@ -34,7 +34,7 @@
         >
           <CIcon
             name="socialTwitter"
-            height="56"
+            height="52"
             class="c-my-4"
           />
           <CChartLineSimple
@@ -57,7 +57,7 @@
         >
           <CIcon
             name="socialLinkedin"
-            height="56"
+            height="52"
             class="c-my-4"
           />
           <CChartLineSimple
@@ -80,7 +80,7 @@
         >
           <CIcon
             name="calendar"
-            height="56"
+            height="52"
             class="c-my-4"
           />
           <CChartLineSimple
@@ -163,7 +163,7 @@
 import { CChartLineSimple } from '../charts/index.js'
 
 export default {
-  name: 'WidgetsSocial',
+  name: 'WidgetsBrand',
   components: {
     CChartLineSimple
   },
diff --git a/src/views/widgets/WidgetsDropdown.vue b/src/views/widgets/WidgetsDropdown.vue
index 911f3ebd..4796c0a9 100644
--- a/src/views/widgets/WidgetsDropdown.vue
+++ b/src/views/widgets/WidgetsDropdown.vue
@@ -7,8 +7,10 @@
             class="c-float-right"
             variant="transparent c-p-0"
             placement="bottom-end"
-            buttonHtml="<i class='cui-settings'></i>"
           >
+            <template #toggler-content>
+              <i class="cui-settings"></i>
+            </template>
             <CDropdownItem>Action</CDropdownItem>
             <CDropdownItem>Another action</CDropdownItem>
             <CDropdownItem>Something else here...</CDropdownItem>
@@ -38,6 +40,9 @@
             no-caret
             buttonHtml="<i class='cui-location-pin'></i>"
           >
+            <template #toggler-content>
+              <i class="cui-location-pin"></i>
+            </template>
             <CDropdownItem>Action</CDropdownItem>
             <CDropdownItem>Another action</CDropdownItem>
             <CDropdownItem>Something else here...</CDropdownItem>
@@ -69,8 +74,10 @@
             class="c-float-right"
             variant="transparent c-p-0"
             placement="bottom-end"
-            buttonHtml="<i class='cui-settings'></i>"
           >
+            <template #toggler-content>
+              <i class="cui-settings"></i>
+            </template>
             <CDropdownItem>Action</CDropdownItem>
             <CDropdownItem>Another action</CDropdownItem>
             <CDropdownItem>Something else here...</CDropdownItem>
@@ -101,8 +108,10 @@
             class="c-float-right"
             variant="transparent c-p-0"
             placement="bottom-end"
-            buttonHtml="<i class='cui-settings'></i>"
           >
+            <template #toggler-content>
+             <i class="cui-settings"></i>
+            </template>
             <CDropdownItem>Action</CDropdownItem>
             <CDropdownItem>Another action</CDropdownItem>
             <CDropdownItem>Something else here...</CDropdownItem>