refactor: update examples

src/views/base/Accordion.vue

@@ -125,7 +125,7 @@
         </CCardHeader>
         <CCardBody>
           <p class="text-medium-emphasis small">
-            Add <code>alwaysOpen</code> property to make accordion items stay
+            Add <code>always-open</code> property to make accordion items stay
             open when another item is opened.
           </p>
           <DocsExample href="components/accordion#always-open">

src/views/base/Cards.vue

@@ -593,7 +593,7 @@
               >border utilities</a
             >
             to change just the <code>border-color</code> of a card. Note that
-            you can set <code>textColor</code> property on the
+            you can set <code>text-color</code> property on the
             <code>&lt;CCard&gt;</code> or a subset of the card&#39;s contents as
             shown below.
           </p>
@@ -635,7 +635,7 @@
               >border utilities</a
             >
             to change just the <code>border-color</code> of a card. Note that
-            you can set <code>textColor</code> property on the
+            you can set <code>text-color</code> property on the
             <code>&lt;CCard&gt;</code> or a subset of the card&#39;s contents as
             shown below.
           </p>

src/views/forms/FormControl.vue

@@ -134,7 +134,7 @@
             <code>plain-text</code> boolean property to remove the default form
             field styling and preserve the correct margin and padding.
           </p>
-          <DocsExample href="components/accordion">
+          <DocsExample href="forms/form-control.html#readonly-plain-text">
             <CRow class="mb-3">
               <CFormLabel for="staticEmail" class="col-sm-2 col-form-label">
                 Email
@@ -158,7 +158,7 @@
               </div>
             </CRow>
           </DocsExample>
-          <DocsExample href="components/accordion">
+          <DocsExample href="forms/form-control.html#readonly-plain-text">
             <CForm class="row g-3">
               <div class="col-auto">
                 <CFormLabel for="staticEmail2" class="visually-hidden">

src/views/forms/Select.vue

@@ -68,7 +68,7 @@
             </CFormSelect>
           </DocsExample>
           <p class="text-medium-emphasis small">
-            As is the <code>htmlSize</code> property:
+            As is the <code>html-size</code> property:
           </p>
           <DocsExample href="forms/select.html#sizing">
             <CFormSelect

src/views/notifications/Modals.vue

@@ -103,10 +103,10 @@
         </CCardHeader>
         <CCardBody>
           <p class="text-medium-emphasis small">
-            If you don’t provide an <code>onDimsiss</code> handler to the Modal
+            If you set <code>backdrop</code> property to <code>static</code>,
-            component, your modal will behave as though the backdrop is static,
+            your modal will behave as though the backdrop is static, meaning it
-            meaning it will not close when clicking outside it. Click the button
+            will not close when clicking outside it. Click the button below to
-            below to try it.
+            try it.
           </p>
           <DocsExample href="components/modal.html#static-backdrop">
             <CButton
@@ -165,10 +165,9 @@
         </CCardHeader>
         <CCardBody>
           <p class="text-medium-emphasis small">
-            If you don’t provide an <code>onDimsiss</code> handler to the Modal
+            When modals become too long for the user's viewport or device, they
-            component, your modal will behave as though the backdrop is static,
+            scroll independent of the page itself. Try the demo below to see
-            meaning it will not close when clicking outside it. Click the button
+            what we mean.
-            below to try it.
           </p>
           <DocsExample href="components/modal.html#scrolling-long-content">
             <CButton