srcdev-nuxt-components 9.0.14 → 9.0.16

package/app/layouts/default.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="page-layout">
-    <LayoutRow tag="div" variant="full" :style-class-passthrough="['header', 'mbe-40']">
+    <LayoutRow tag="div" variant="full" :style-class-passthrough="['header']">
       <template #default>
         <header class="responsive-header">
           <nav class="home-navigation" aria-label="Home Navigation">
@@ -38,7 +38,7 @@
         </header>
       </template>
     </LayoutRow>
-    <LayoutRow id="main-content" tag="main" variant="full" :is-landmark="true">
+    <LayoutRow id="main-content" class="main-content" tag="main" variant="full" :is-landmark="true">
       <template #default>
         <slot name="layout-content">Page content goes here</slot>
       </template>
@@ -74,7 +74,7 @@ const responsiveNavLinks = {
         { name: "Container Glow", path: "/ui/container-glow" },
         { name: "Accordian", path: "/ui/accordian" },
         { name: "Display Details", path: "/ui/display-details" },
-        { name: "Display Card", path: "/ui/display-card" },
+        { name: "Card Core", path: "/ui/card-core" },
         { name: "Glowing Border", path: "/ui/glowing-border" },
         { name: "Display Toast", path: "/ui/display-toast" },
         { name: "Masked Alert", path: "/ui/mask-element" },
@@ -96,6 +96,7 @@ const responsiveNavLinks = {
       childLinksTitle: "UI Layouts",
       childLinks: [
         { name: "Block Decorators", path: "/ui/block-decorators" },
+        { name: "Navigation Horizontal", path: "/ui/navigation/navigation-horizontal" },
         { name: "Magnetic Navigation", path: "/ui/magnetic-navigation" },
         { name: "Layout Row", path: "/ui/layout-row" },
         { name: "Layout Grid A", path: "/ui/layout-grid-a" },
@@ -205,6 +206,10 @@ onMounted(() => {
   display: grid;
   grid-template-columns: 1fr;
   grid-template-rows: auto 1fr auto;
+
+  .main-content {
+    container-type: inline-size;
+  }
 }
 
 /* Modifiers for ResposiveHeader  */

package/app/pages/forms/examples/buttons/index.vue

@@ -9,8 +9,8 @@
           <DisplayThemeSwitch />
         </LayoutRow>
 
-        <ContentGrid>
-          <template #slot1>
+        <LayoutGridByCols>
+          <template #item-0>
             <div>
               <h1>Example buttons</h1>
               <p>Primary submit</p>
@@ -115,10 +115,10 @@
               </ul>
             </div>
           </template>
-        </ContentGrid>
+        </LayoutGridByCols>
 
-        <ContentGrid>
-          <template #slot1>
+        <LayoutGridByCols>
+          <template #item-0>
             <div>
               <h1>Example buttons</h1>
               <p>Currently displaying {{ buttonText }}</p>
@@ -196,7 +196,7 @@
               </ul>
             </div>
           </template>
-        </ContentGrid>
+        </LayoutGridByCols>
       </template>
     </NuxtLayout>
   </div>

package/app/pages/forms/examples/material/checkbox-radio-panels.vue

@@ -5,8 +5,8 @@
         <div>
           <h1 class="header-1">Checkbox/Radio panels</h1>
         </div>
-        <ContentGrid>
-          <template #slot1>
+        <LayoutGridByCols>
+          <template #item-0>
             <FormWrapper width="medium">
               <template #default>
                 <ClientOnly>
@@ -84,7 +84,7 @@
               </template>
             </FormWrapper>
           </template>
-        </ContentGrid>
+        </LayoutGridByCols>
       </template>
     </NuxtLayout>
   </div>