docs: update content

Author: mrholek

packages/docs/.vuepress/client.ts

@@ -8,6 +8,7 @@ import '@coreui/chartjs/scss/coreui-chartjs.scss'
 import {
   cibCoreuiC,
   cibDiscourse,
+  cibFacebook,
   cibGithub,
   cibTwitter,
   cibOpenCollective,
@@ -37,6 +38,7 @@ import {
 export const icons = {
   cibCoreuiC,
   cibDiscourse,
+  cibFacebook,
   cibGithub,
   cibTwitter,
   cibOpenCollective,

packages/docs/components/icon.md

@@ -162,7 +162,7 @@ CoreUI Icons package is delivered with more than 1500 icons in multiple formats
         <div class="p-3 py-4 mb-2 bg-light text-center rounded">
           <CIcon :icon="icon[i]" size="xxl"/>
         </div>
-        <div class="text-medium-emphasis text-center pt-1 small">{{i}}</div>
+        <div class="text-body-secondary text-center pt-1 small">{{i}}</div>
       </CCol>
     </CRow>
   </CTabPane>
@@ -172,7 +172,7 @@ CoreUI Icons package is delivered with more than 1500 icons in multiple formats
         <div class="p-3 py-4 mb-2 bg-light text-center rounded">
           <CIcon :icon="icon[i]" size="xxl"/>
         </div>
-        <div class="text-medium-emphasis text-center pt-1 small">{{i}}</div>
+        <div class="text-body-secondary text-center pt-1 small">{{i}}</div>
       </CCol>
     </CRow>
   </CTabPane>
@@ -182,7 +182,7 @@ CoreUI Icons package is delivered with more than 1500 icons in multiple formats
         <div class="p-3 py-4 mb-2 bg-light text-center rounded">
           <CIcon :icon="icon[i]" size="xxl"/>
         </div>
-        <div class="text-medium-emphasis text-center pt-1 small">{{i}}</div>
+        <div class="text-body-secondary text-center pt-1 small">{{i}}</div>
       </CCol>
     </CRow>
   </CTabPane>

packages/docs/components/navbar.md

@@ -981,10 +981,10 @@ With a toggler on the left and brand name on the right:
 Sometimes you want to use the collapse plugin to trigger a container element for content that structurally sits outside of the `<CNavbar>`.
 
 ::: demo
-<CCollapse id="navbarToggleExternalContent" :visible="visibleExternalContent">
+<CCollapse id="navbarToggleExternalContent" :visible="visibleExternalContent" data-coreui-theme="dark">
   <div class="bg-dark p-4">
-    <h5 class="text-white h4">Collapsed content</h5>
-    <span class="text-medium-emphasis-inverse">Toggleable via the navbar brand.</span>
+    <h5 class="text-body-emphasis h4">Collapsed content</h5>
+    <span class="text-body-secondary">Toggleable via the navbar brand.</span>
   </div>
 </CCollapse>
 <CNavbar colorScheme="dark" class="bg-dark">
@@ -999,10 +999,10 @@ Sometimes you want to use the collapse plugin to trigger a container element for
 :::
 ```vue
 <template>
-  <CCollapse id="navbarToggleExternalContent" :visible="visibleExternalContent">
+  <CCollapse id="navbarToggleExternalContent" :visible="visibleExternalContent" data-coreui-theme="dark">
     <div class="bg-dark p-4">
-      <h5 class="text-white h4">Collapsed content</h5>
-      <span class="text-medium-emphasis-inverse">Toggleable via the navbar brand.</span>
+      <h5 class="text-body-emphasis h4">Collapsed content</h5>
+      <span class="text-body-secondary">Toggleable via the navbar brand.</span>
     </div>
   </CCollapse>
   <CNavbar colorScheme="dark" class="bg-dark">

packages/docs/components/tooltip.md

@@ -12,7 +12,7 @@ other_frameworks: tooltip
 Hover over the links below to see tooltips:
 
 ::: demo
-<p class="text-medium-emphasis">
+<p class="text-body-secondary">
   Tight pants next level keffiyeh
   <CLink v-c-tooltip="'Tooltip text'"> you&nbsp;probably </CLink>
     haven't heard of them.
@@ -31,7 +31,7 @@ Hover over the links below to see tooltips:
 </p>
 :::
 ```vue demo
-<p class="text-medium-emphasis">
+<p class="text-body-secondary">
   Tight pants next level keffiyeh
   <CLink v-c-tooltip="'Tooltip text'"> you probably </CLink>
     haven't heard of them.