diff --git a/index.html b/index.html
index c56d8c2..49b65f4 100644
--- a/index.html
+++ b/index.html
@@ -13,10 +13,10 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
 
     <!-- favicon -->
-    <link rel="apple-touch-icon" sizes="180x180" href="/img/favicon/apple-touch-icon.png">
-    <link rel="icon" type="image/png" sizes="32x32" href="img/favicon/favicon-32x32.png">
-    <link rel="icon" type="image/png" sizes="16x16" href="/img/favicon/favicon-16x16.png">
-    <link rel="manifest" href="/img/favicon/site.webmanifest">
+    <link rel="apple-touch-icon" sizes="180x180" href="/img/favicon/apple-touch-icon.png" />
+    <link rel="icon" type="image/png" sizes="32x32" href="img/favicon/favicon-32x32.png" />
+    <link rel="icon" type="image/png" sizes="16x16" href="/img/favicon/favicon-16x16.png" />
+    <link rel="manifest" href="/img/favicon/site.webmanifest" />
 
     <meta content="" name="description" />
     <meta content="" name="keywords" />
@@ -77,7 +77,7 @@
     <!-- Main JS -->
     <!-- <script src="/js/main.js"></script> -->
     <!-- Page JS -->
-    <script src="/js/dashboards-analytics.js"></script>
+    <!-- <script src="/js/dashboards-analytics.js"></script> -->
 
     <script type="module" src="/src/main.js"></script>
   </body>
diff --git a/src/components/SampleInput.vue b/src/components/SampleInput.vue
new file mode 100644
index 0000000..8f1d255
--- /dev/null
+++ b/src/components/SampleInput.vue
@@ -0,0 +1,50 @@
+<template>
+  <div class="row mb-12 g-6">
+    <div class="col-md">
+      <div class="card">
+        <div class="d-flex">
+          <div>
+            <img class="card-img card-img-left" src="/img/elements/12.jpg" alt="Card image" />
+          </div>
+          <div>
+            <div class="card-body">
+              <h5 class="card-title">Card title</h5>
+              <p class="card-text">
+                This is a wider card with supporting text below as a natural lead-in to additional
+                content. This content is a little bit longer.
+              </p>
+              <p class="card-text">
+                <small class="text-muted">Last updated 3 mins ago</small>
+              </p>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div class="col-md">
+      <div class="card">
+        <div class="d-flex">
+          <div>
+            <div class="card-body">
+              <h5 class="card-title">Card title</h5>
+              <p class="card-text">
+                This is a wider card with supporting text below as a natural lead-in to additional
+                content. This content is a little bit longer.
+              </p>
+              <p class="card-text">
+                <small class="text-muted">Last updated 3 mins ago</small>
+              </p>
+            </div>
+          </div>
+          <div>
+            <img class="card-img card-img-right" src="/img/elements/17.jpg" alt="Card image" />
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup></script>
+
+<style lang="scss" scoped></style>
diff --git a/src/layouts/TheMenu.vue b/src/layouts/TheMenu.vue
index 9cd8a3b..48f1696 100644
--- a/src/layouts/TheMenu.vue
+++ b/src/layouts/TheMenu.vue
@@ -1,4 +1,5 @@
 <template>
+  <!-- Menu -->
   <aside id="layout-menu" class="layout-menu menu-vertical menu bg-menu-theme">
     <div class="app-brand demo">
       <a href="/" class="app-brand-link">
@@ -40,1154 +41,21 @@
         <ul class="menu-sub">
           <li class="menu-item active">
             <a href="/" class="menu-link">
-              <div class="text-truncate" data-i18n="Analytics">Analytics</div>
+              <div class="text-truncate" data-i18n="Analytics">Main</div>
             </a>
           </li>
           <li class="menu-item">
-            <a href="dashboards-crm.html" class="menu-link">
-              <div class="text-truncate" data-i18n="CRM">CRM</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="app-ecommerce-dashboard.html" class="menu-link">
-              <div class="text-truncate" data-i18n="eCommerce">eCommerce</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="app-logistics-dashboard.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Logistics">Logistics</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="app-academy-dashboard.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Academy">Academy</div>
+            <a href="javascript:void(0);" class="menu-link">
+              <div class="text-truncate" data-i18n="CRM">Board</div>
             </a>
           </li>
         </ul>
       </li>
-
-      <!-- Layouts -->
-      <li class="menu-item">
-        <a href="javascript:void(0);" class="menu-link menu-toggle">
-          <i class="menu-icon tf-icons bx bx-layout"></i>
-          <div class="text-truncate" data-i18n="Layouts">Layouts</div>
-        </a>
-
-        <ul class="menu-sub">
-          <li class="menu-item">
-            <a href="layouts-collapsed-menu.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Collapsed menu">Collapsed menu</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="layouts-content-navbar.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Content navbar">Content navbar</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="layouts-content-navbar-with-sidebar.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Content nav + Sidebar">
-                Content nav + Sidebar
-              </div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a
-              href="https://demos.themeselection.com/sneat-bootstrap-html-admin-template/html/horizontal-menu-template"
-              class="menu-link"
-              target="_blank"
-            >
-              <div class="text-truncate" data-i18n="Horizontal">Horizontal</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="layouts-without-menu.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Without menu">Without menu</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="layouts-without-navbar.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Without navbar">Without navbar</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="layouts-fluid.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Fluid">Fluid</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="layouts-container.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Container">Container</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="layouts-blank.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Blank">Blank</div>
-            </a>
-          </li>
-        </ul>
-      </li>
-
-      <!-- Front Pages -->
-      <li class="menu-item">
-        <a href="javascript:void(0);" class="menu-link menu-toggle">
-          <i class="menu-icon tf-icons bx bx-store"></i>
-          <div class="text-truncate" data-i18n="Front Pages">Front Pages</div>
-        </a>
-        <ul class="menu-sub">
-          <li class="menu-item">
-            <a
-              href="https://demos.themeselection.com/sneat-bootstrap-html-admin-template/html/front-pages/landing-page.html"
-              class="menu-link"
-              target="_blank"
-            >
-              <div class="text-truncate" data-i18n="Landing">Landing</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a
-              href="https://demos.themeselection.com/sneat-bootstrap-html-admin-template/html/front-pages/pricing-page.html"
-              class="menu-link"
-              target="_blank"
-            >
-              <div class="text-truncate" data-i18n="Pricing">Pricing</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a
-              href="https://demos.themeselection.com/sneat-bootstrap-html-admin-template/html/front-pages/payment-page.html"
-              class="menu-link"
-              target="_blank"
-            >
-              <div class="text-truncate" data-i18n="Payment">Payment</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a
-              href="https://demos.themeselection.com/sneat-bootstrap-html-admin-template/html/front-pages/checkout-page.html"
-              class="menu-link"
-              target="_blank"
-            >
-              <div class="text-truncate" data-i18n="Checkout">Checkout</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a
-              href="https://demos.themeselection.com/sneat-bootstrap-html-admin-template/html/front-pages/help-center-landing.html"
-              class="menu-link"
-              target="_blank"
-            >
-              <div class="text-truncate" data-i18n="Help Center">Help Center</div>
-            </a>
-          </li>
-        </ul>
-      </li>
-
-      <!-- Apps & Pages -->
-      <li class="menu-header small text-uppercase">
-        <span class="menu-header-text" data-i18n="Apps & Pages">Apps &amp; Pages</span>
-      </li>
-      <li class="menu-item">
-        <a href="app-email.html" class="menu-link">
-          <i class="menu-icon tf-icons bx bx-envelope"></i>
-          <div class="text-truncate" data-i18n="Email">Email</div>
-        </a>
-      </li>
-      <li class="menu-item">
-        <a href="app-chat.html" class="menu-link">
-          <i class="menu-icon tf-icons bx bx-chat"></i>
-          <div class="text-truncate" data-i18n="Chat">Chat</div>
-        </a>
-      </li>
-      <li class="menu-item">
-        <a href="app-calendar.html" class="menu-link">
-          <i class="menu-icon tf-icons bx bx-calendar"></i>
-          <div class="text-truncate" data-i18n="Calendar">Calendar</div>
-        </a>
-      </li>
-      <li class="menu-item">
-        <a href="app-kanban.html" class="menu-link">
-          <i class="menu-icon tf-icons bx bx-grid"></i>
-          <div class="text-truncate" data-i18n="Kanban">Kanban</div>
-        </a>
-      </li>
-      <!-- e-commerce-app menu start -->
-      <li class="menu-item">
-        <a href="javascript:void(0);" class="menu-link menu-toggle">
-          <i class="menu-icon tf-icons bx bx-cart-alt"></i>
-          <div class="text-truncate" data-i18n="eCommerce">eCommerce</div>
-        </a>
-        <ul class="menu-sub">
-          <li class="menu-item">
-            <a href="app-ecommerce-dashboard.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Dashboard">Dashboard</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="javascript:void(0);" class="menu-link menu-toggle">
-              <div class="text-truncate" data-i18n="Products">Products</div>
-            </a>
-            <ul class="menu-sub">
-              <li class="menu-item">
-                <a href="app-ecommerce-product-list.html" class="menu-link">
-                  <div class="text-truncate" data-i18n="Product List">Product List</div>
-                </a>
-              </li>
-              <li class="menu-item">
-                <a href="app-ecommerce-product-add.html" class="menu-link">
-                  <div class="text-truncate" data-i18n="Add Product">Add Product</div>
-                </a>
-              </li>
-              <li class="menu-item">
-                <a href="app-ecommerce-category-list.html" class="menu-link">
-                  <div class="text-truncate" data-i18n="Category List">Category List</div>
-                </a>
-              </li>
-            </ul>
-          </li>
-          <li class="menu-item">
-            <a href="javascript:void(0);" class="menu-link menu-toggle">
-              <div class="text-truncate" data-i18n="Order">Order</div>
-            </a>
-            <ul class="menu-sub">
-              <li class="menu-item">
-                <a href="app-ecommerce-order-list.html" class="menu-link">
-                  <div class="text-truncate" data-i18n="Order List">Order List</div>
-                </a>
-              </li>
-              <li class="menu-item">
-                <a href="app-ecommerce-order-details.html" class="menu-link">
-                  <div class="text-truncate" data-i18n="Order Details">Order Details</div>
-                </a>
-              </li>
-            </ul>
-          </li>
-          <li class="menu-item">
-            <a href="javascript:void(0);" class="menu-link menu-toggle">
-              <div class="text-truncate" data-i18n="Customer">Customer</div>
-            </a>
-            <ul class="menu-sub">
-              <li class="menu-item">
-                <a href="app-ecommerce-customer-all.html" class="menu-link">
-                  <div class="text-truncate" data-i18n="All Customers">All Customers</div>
-                </a>
-              </li>
-              <li class="menu-item">
-                <a href="javascript:void(0);" class="menu-link menu-toggle">
-                  <div class="text-truncate" data-i18n="Customer Details">Customer Details</div>
-                </a>
-                <ul class="menu-sub">
-                  <li class="menu-item">
-                    <a href="app-ecommerce-customer-details-overview.html" class="menu-link">
-                      <div class="text-truncate" data-i18n="Overview">Overview</div>
-                    </a>
-                  </li>
-                  <li class="menu-item">
-                    <a href="app-ecommerce-customer-details-security.html" class="menu-link">
-                      <div class="text-truncate" data-i18n="Security">Security</div>
-                    </a>
-                  </li>
-                  <li class="menu-item">
-                    <a href="app-ecommerce-customer-details-billing.html" class="menu-link">
-                      <div class="text-truncate" data-i18n="Address & Billing">
-                        Address & Billing
-                      </div>
-                    </a>
-                  </li>
-                  <li class="menu-item">
-                    <a href="app-ecommerce-customer-details-notifications.html" class="menu-link">
-                      <div class="text-truncate" data-i18n="Notifications">Notifications</div>
-                    </a>
-                  </li>
-                </ul>
-              </li>
-            </ul>
-          </li>
-          <li class="menu-item">
-            <a href="app-ecommerce-manage-reviews.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Manage Reviews">Manage Reviews</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="app-ecommerce-referral.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Referrals">Referrals</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="javascript:void(0);" class="menu-link menu-toggle">
-              <div class="text-truncate" data-i18n="Settings">Settings</div>
-            </a>
-            <ul class="menu-sub">
-              <li class="menu-item">
-                <a href="app-ecommerce-settings-detail.html" class="menu-link">
-                  <div class="text-truncate" data-i18n="Store Details">Store Details</div>
-                </a>
-              </li>
-              <li class="menu-item">
-                <a href="app-ecommerce-settings-payments.html" class="menu-link">
-                  <div class="text-truncate" data-i18n="Payments">Payments</div>
-                </a>
-              </li>
-              <li class="menu-item">
-                <a href="app-ecommerce-settings-checkout.html" class="menu-link">
-                  <div class="text-truncate" data-i18n="Checkout">Checkout</div>
-                </a>
-              </li>
-              <li class="menu-item">
-                <a href="app-ecommerce-settings-shipping.html" class="menu-link">
-                  <div class="text-truncate" data-i18n="Shipping & Delivery">
-                    Shipping & Delivery
-                  </div>
-                </a>
-              </li>
-              <li class="menu-item">
-                <a href="app-ecommerce-settings-locations.html" class="menu-link">
-                  <div class="text-truncate" data-i18n="Locations">Locations</div>
-                </a>
-              </li>
-              <li class="menu-item">
-                <a href="app-ecommerce-settings-notifications.html" class="menu-link">
-                  <div class="text-truncate" data-i18n="Notifications">Notifications</div>
-                </a>
-              </li>
-            </ul>
-          </li>
-        </ul>
-      </li>
-      <!-- e-commerce-app menu end -->
-      <!-- Academy menu start -->
-      <li class="menu-item">
-        <a href="javascript:void(0);" class="menu-link menu-toggle">
-          <i class="menu-icon tf-icons bx bx-book-open"></i>
-          <div class="text-truncate" data-i18n="Academy">Academy</div>
-        </a>
-        <ul class="menu-sub">
-          <li class="menu-item">
-            <a href="app-academy-dashboard.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Dashboard">Dashboard</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="app-academy-course.html" class="menu-link">
-              <div class="text-truncate" data-i18n="My Course">My Course</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="app-academy-course-details.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Course Details">Course Details</div>
-            </a>
-          </li>
-        </ul>
-      </li>
-      <!-- Academy menu end -->
-      <li class="menu-item">
-        <a href="javascript:void(0);" class="menu-link menu-toggle">
-          <i class="menu-icon tf-icons bx bx-car"></i>
-          <div class="text-truncate" data-i18n="Logistics">Logistics</div>
-        </a>
-        <ul class="menu-sub">
-          <li class="menu-item">
-            <a href="app-logistics-dashboard.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Dashboard">Dashboard</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="app-logistics-fleet.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Fleet">Fleet</div>
-            </a>
-          </li>
-        </ul>
-      </li>
-      <li class="menu-item">
-        <a href="javascript:void(0);" class="menu-link menu-toggle">
-          <i class="menu-icon tf-icons bx bx-food-menu"></i>
-          <div class="text-truncate" data-i18n="Invoice">Invoice</div>
-        </a>
-        <ul class="menu-sub">
-          <li class="menu-item">
-            <a href="app-invoice-list.html" class="menu-link">
-              <div class="text-truncate" data-i18n="List">List</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="app-invoice-preview.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Preview">Preview</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="app-invoice-edit.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Edit">Edit</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="app-invoice-add.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Add">Add</div>
-            </a>
-          </li>
-        </ul>
-      </li>
-      <li class="menu-item">
-        <a href="javascript:void(0);" class="menu-link menu-toggle">
-          <i class="menu-icon tf-icons bx bx-user"></i>
-          <div class="text-truncate" data-i18n="Users">Users</div>
-        </a>
-        <ul class="menu-sub">
-          <li class="menu-item">
-            <a href="app-user-list.html" class="menu-link">
-              <div class="text-truncate" data-i18n="List">List</div>
-            </a>
-          </li>
-
-          <li class="menu-item">
-            <a href="javascript:void(0);" class="menu-link menu-toggle">
-              <div class="text-truncate" data-i18n="View">View</div>
-            </a>
-            <ul class="menu-sub">
-              <li class="menu-item">
-                <a href="app-user-view-account.html" class="menu-link">
-                  <div class="text-truncate" data-i18n="Account">Account</div>
-                </a>
-              </li>
-              <li class="menu-item">
-                <a href="app-user-view-security.html" class="menu-link">
-                  <div class="text-truncate" data-i18n="Security">Security</div>
-                </a>
-              </li>
-              <li class="menu-item">
-                <a href="app-user-view-billing.html" class="menu-link">
-                  <div class="text-truncate" data-i18n="Billing & Plans">Billing & Plans</div>
-                </a>
-              </li>
-              <li class="menu-item">
-                <a href="app-user-view-notifications.html" class="menu-link">
-                  <div class="text-truncate" data-i18n="Notifications">Notifications</div>
-                </a>
-              </li>
-              <li class="menu-item">
-                <a href="app-user-view-connections.html" class="menu-link">
-                  <div class="text-truncate" data-i18n="Connections">Connections</div>
-                </a>
-              </li>
-            </ul>
-          </li>
-        </ul>
-      </li>
-      <li class="menu-item">
-        <a href="javascript:void(0);" class="menu-link menu-toggle">
-          <i class="menu-icon tf-icons bx bx-check-shield"></i>
-          <div class="text-truncate" data-i18n="Roles & Permissions">Roles & Permissions</div>
-        </a>
-        <ul class="menu-sub">
-          <li class="menu-item">
-            <a href="app-access-roles.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Roles">Roles</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="app-access-permission.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Permission">Permission</div>
-            </a>
-          </li>
-        </ul>
-      </li>
-      <li class="menu-item">
-        <a href="javascript:void(0);" class="menu-link menu-toggle">
-          <i class="menu-icon tf-icons bx bx-dock-top"></i>
-          <div class="text-truncate" data-i18n="Pages">Pages</div>
-        </a>
-        <ul class="menu-sub">
-          <li class="menu-item">
-            <a href="javascript:void(0);" class="menu-link menu-toggle">
-              <div class="text-truncate" data-i18n="User Profile">User Profile</div>
-            </a>
-            <ul class="menu-sub">
-              <li class="menu-item">
-                <a href="pages-profile-user.html" class="menu-link">
-                  <div class="text-truncate" data-i18n="Profile">Profile</div>
-                </a>
-              </li>
-              <li class="menu-item">
-                <a href="pages-profile-teams.html" class="menu-link">
-                  <div class="text-truncate" data-i18n="Teams">Teams</div>
-                </a>
-              </li>
-              <li class="menu-item">
-                <a href="pages-profile-projects.html" class="menu-link">
-                  <div class="text-truncate" data-i18n="Projects">Projects</div>
-                </a>
-              </li>
-              <li class="menu-item">
-                <a href="pages-profile-connections.html" class="menu-link">
-                  <div class="text-truncate" data-i18n="Connections">Connections</div>
-                </a>
-              </li>
-            </ul>
-          </li>
-          <li class="menu-item">
-            <a href="javascript:void(0);" class="menu-link menu-toggle">
-              <div class="text-truncate" data-i18n="Account Settings">Account Settings</div>
-            </a>
-            <ul class="menu-sub">
-              <li class="menu-item">
-                <a href="pages-account-settings-account.html" class="menu-link">
-                  <div class="text-truncate" data-i18n="Account">Account</div>
-                </a>
-              </li>
-              <li class="menu-item">
-                <a href="pages-account-settings-security.html" class="menu-link">
-                  <div class="text-truncate" data-i18n="Security">Security</div>
-                </a>
-              </li>
-              <li class="menu-item">
-                <a href="pages-account-settings-billing.html" class="menu-link">
-                  <div class="text-truncate" data-i18n="Billing & Plans">Billing & Plans</div>
-                </a>
-              </li>
-              <li class="menu-item">
-                <a href="pages-account-settings-notifications.html" class="menu-link">
-                  <div class="text-truncate" data-i18n="Notifications">Notifications</div>
-                </a>
-              </li>
-              <li class="menu-item">
-                <a href="pages-account-settings-connections.html" class="menu-link">
-                  <div class="text-truncate" data-i18n="Connections">Connections</div>
-                </a>
-              </li>
-            </ul>
-          </li>
-          <li class="menu-item">
-            <a href="pages-faq.html" class="menu-link">
-              <div class="text-truncate" data-i18n="FAQ">FAQ</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="pages-pricing.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Pricing">Pricing</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="javascript:void(0);" class="menu-link menu-toggle">
-              <div class="text-truncate" data-i18n="Misc">Misc</div>
-            </a>
-            <ul class="menu-sub">
-              <li class="menu-item">
-                <a href="pages-misc-error.html" class="menu-link" target="_blank">
-                  <div class="text-truncate" data-i18n="Error">Error</div>
-                </a>
-              </li>
-              <li class="menu-item">
-                <a href="pages-misc-under-maintenance.html" class="menu-link" target="_blank">
-                  <div class="text-truncate" data-i18n="Under Maintenance">Under Maintenance</div>
-                </a>
-              </li>
-              <li class="menu-item">
-                <a href="pages-misc-comingsoon.html" class="menu-link" target="_blank">
-                  <div class="text-truncate" data-i18n="Coming Soon">Coming Soon</div>
-                </a>
-              </li>
-              <li class="menu-item">
-                <a href="pages-misc-not-authorized.html" class="menu-link" target="_blank">
-                  <div class="text-truncate" data-i18n="Not Authorized">Not Authorized</div>
-                </a>
-              </li>
-            </ul>
-          </li>
-        </ul>
-      </li>
-      <li class="menu-item">
-        <a href="javascript:void(0);" class="menu-link menu-toggle">
-          <i class="menu-icon tf-icons bx bx-lock-open-alt"></i>
-          <div class="text-truncate" data-i18n="Authentications">Authentications</div>
-        </a>
-        <ul class="menu-sub">
-          <li class="menu-item">
-            <a href="javascript:void(0);" class="menu-link menu-toggle">
-              <div class="text-truncate" data-i18n="Login">Login</div>
-            </a>
-            <ul class="menu-sub">
-              <li class="menu-item">
-                <a href="auth-login-basic.html" class="menu-link" target="_blank">
-                  <div class="text-truncate" data-i18n="Basic">Basic</div>
-                </a>
-              </li>
-              <li class="menu-item">
-                <a href="auth-login-cover.html" class="menu-link" target="_blank">
-                  <div class="text-truncate" data-i18n="Cover">Cover</div>
-                </a>
-              </li>
-            </ul>
-          </li>
-          <li class="menu-item">
-            <a href="javascript:void(0);" class="menu-link menu-toggle">
-              <div class="text-truncate" data-i18n="Register">Register</div>
-            </a>
-            <ul class="menu-sub">
-              <li class="menu-item">
-                <a href="auth-register-basic.html" class="menu-link" target="_blank">
-                  <div class="text-truncate" data-i18n="Basic">Basic</div>
-                </a>
-              </li>
-              <li class="menu-item">
-                <a href="auth-register-cover.html" class="menu-link" target="_blank">
-                  <div class="text-truncate" data-i18n="Cover">Cover</div>
-                </a>
-              </li>
-              <li class="menu-item">
-                <a href="auth-register-multisteps.html" class="menu-link" target="_blank">
-                  <div class="text-truncate" data-i18n="Multi-steps">Multi-steps</div>
-                </a>
-              </li>
-            </ul>
-          </li>
-          <li class="menu-item">
-            <a href="javascript:void(0);" class="menu-link menu-toggle">
-              <div class="text-truncate" data-i18n="Verify Email">Verify Email</div>
-            </a>
-            <ul class="menu-sub">
-              <li class="menu-item">
-                <a href="auth-verify-email-basic.html" class="menu-link" target="_blank">
-                  <div class="text-truncate" data-i18n="Basic">Basic</div>
-                </a>
-              </li>
-              <li class="menu-item">
-                <a href="auth-verify-email-cover.html" class="menu-link" target="_blank">
-                  <div class="text-truncate" data-i18n="Cover">Cover</div>
-                </a>
-              </li>
-            </ul>
-          </li>
-          <li class="menu-item">
-            <a href="javascript:void(0);" class="menu-link menu-toggle">
-              <div class="text-truncate" data-i18n="Reset Password">Reset Password</div>
-            </a>
-            <ul class="menu-sub">
-              <li class="menu-item">
-                <a href="auth-reset-password-basic.html" class="menu-link" target="_blank">
-                  <div class="text-truncate" data-i18n="Basic">Basic</div>
-                </a>
-              </li>
-              <li class="menu-item">
-                <a href="auth-reset-password-cover.html" class="menu-link" target="_blank">
-                  <div class="text-truncate" data-i18n="Cover">Cover</div>
-                </a>
-              </li>
-            </ul>
-          </li>
-          <li class="menu-item">
-            <a href="javascript:void(0);" class="menu-link menu-toggle">
-              <div class="text-truncate" data-i18n="Forgot Password">Forgot Password</div>
-            </a>
-            <ul class="menu-sub">
-              <li class="menu-item">
-                <a href="auth-forgot-password-basic.html" class="menu-link" target="_blank">
-                  <div class="text-truncate" data-i18n="Basic">Basic</div>
-                </a>
-              </li>
-              <li class="menu-item">
-                <a href="auth-forgot-password-cover.html" class="menu-link" target="_blank">
-                  <div class="text-truncate" data-i18n="Cover">Cover</div>
-                </a>
-              </li>
-            </ul>
-          </li>
-          <li class="menu-item">
-            <a href="javascript:void(0);" class="menu-link menu-toggle">
-              <div class="text-truncate" data-i18n="Two Steps">Two Steps</div>
-            </a>
-            <ul class="menu-sub">
-              <li class="menu-item">
-                <a href="auth-two-steps-basic.html" class="menu-link" target="_blank">
-                  <div class="text-truncate" data-i18n="Basic">Basic</div>
-                </a>
-              </li>
-              <li class="menu-item">
-                <a href="auth-two-steps-cover.html" class="menu-link" target="_blank">
-                  <div class="text-truncate" data-i18n="Cover">Cover</div>
-                </a>
-              </li>
-            </ul>
-          </li>
-        </ul>
-      </li>
-      <li class="menu-item">
-        <a href="javascript:void(0);" class="menu-link menu-toggle">
-          <i class="menu-icon tf-icons bx bx-spreadsheet"></i>
-          <div class="text-truncate" data-i18n="Wizard Examples">Wizard Examples</div>
-        </a>
-        <ul class="menu-sub">
-          <li class="menu-item">
-            <a href="wizard-ex-checkout.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Checkout">Checkout</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="wizard-ex-property-listing.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Property Listing">Property Listing</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="wizard-ex-create-deal.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Create Deal">Create Deal</div>
-            </a>
-          </li>
-        </ul>
-      </li>
-      <li class="menu-item">
-        <a href="modal-examples.html" class="menu-link">
-          <i class="menu-icon tf-icons bx bx-window-open"></i>
-          <div class="text-truncate" data-i18n="Modal Examples">Modal Examples</div>
-        </a>
-      </li>
-
-      <!-- Components -->
-      <li class="menu-header small text-uppercase">
-        <span class="menu-header-text" data-i18n="Components">Components</span>
-      </li>
-      <!-- Cards -->
-      <li class="menu-item">
-        <a href="javascript:void(0);" class="menu-link menu-toggle">
-          <i class="menu-icon tf-icons bx bx-collection"></i>
-          <div class="text-truncate" data-i18n="Cards">Cards</div>
-          <span class="badge rounded-pill bg-primary ms-auto">6</span>
-        </a>
-        <ul class="menu-sub">
-          <li class="menu-item">
-            <a href="cards-basic.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Basic">Basic</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="cards-advance.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Advance">Advance</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="cards-statistics.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Statistics">Statistics</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="cards-analytics.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Analytics">Analytics</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="cards-gamifications.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Gamifications">Gamifications</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="cards-actions.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Actions">Actions</div>
-            </a>
-          </li>
-        </ul>
-      </li>
-      <!-- User interface -->
-      <li class="menu-item">
-        <a href="javascript:void(0)" class="menu-link menu-toggle">
-          <i class="menu-icon tf-icons bx bx-box"></i>
-          <div class="text-truncate" data-i18n="User interface">User interface</div>
-        </a>
-        <ul class="menu-sub">
-          <li class="menu-item">
-            <a href="ui-accordion.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Accordion">Accordion</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="ui-alerts.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Alerts">Alerts</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="ui-badges.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Badges">Badges</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="ui-buttons.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Buttons">Buttons</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="ui-carousel.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Carousel">Carousel</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="ui-collapse.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Collapse">Collapse</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="ui-dropdowns.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Dropdowns">Dropdowns</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="ui-footer.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Footer">Footer</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="ui-list-groups.html" class="menu-link">
-              <div class="text-truncate" data-i18n="List Groups">List groups</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="ui-modals.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Modals">Modals</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="ui-navbar.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Navbar">Navbar</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="ui-offcanvas.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Offcanvas">Offcanvas</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="ui-pagination-breadcrumbs.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Pagination & Breadcrumbs">
-                Pagination &amp; Breadcrumbs
-              </div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="ui-progress.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Progress">Progress</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="ui-spinners.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Spinners">Spinners</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="ui-tabs-pills.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Tabs & Pills">Tabs &amp; Pills</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="ui-toasts.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Toasts">Toasts</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="ui-tooltips-popovers.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Tooltips & Popovers">
-                Tooltips &amp; Popovers
-              </div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="ui-typography.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Typography">Typography</div>
-            </a>
-          </li>
-        </ul>
-      </li>
-
-      <!-- Extended components -->
-      <li class="menu-item">
-        <a href="javascript:void(0)" class="menu-link menu-toggle">
-          <i class="menu-icon tf-icons bx bx-copy"></i>
-          <div class="text-truncate" data-i18n="Extended UI">Extended UI</div>
-        </a>
-        <ul class="menu-sub">
-          <li class="menu-item">
-            <a href="extended-ui-avatar.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Avatar">Avatar</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="extended-ui-blockui.html" class="menu-link">
-              <div class="text-truncate" data-i18n="BlockUI">BlockUI</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="extended-ui-drag-and-drop.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Drag & Drop">Drag &amp; Drop</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="extended-ui-media-player.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Media Player">Media Player</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="extended-ui-perfect-scrollbar.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Perfect Scrollbar">Perfect Scrollbar</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="extended-ui-star-ratings.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Star Ratings">Star Ratings</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="extended-ui-sweetalert2.html" class="menu-link">
-              <div class="text-truncate" data-i18n="SweetAlert2">SweetAlert2</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="extended-ui-text-divider.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Text Divider">Text Divider</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="javascript:void(0);" class="menu-link menu-toggle">
-              <div class="text-truncate" data-i18n="Timeline">Timeline</div>
-            </a>
-            <ul class="menu-sub">
-              <li class="menu-item">
-                <a href="extended-ui-timeline-basic.html" class="menu-link">
-                  <div class="text-truncate" data-i18n="Basic">Basic</div>
-                </a>
-              </li>
-              <li class="menu-item">
-                <a href="extended-ui-timeline-fullscreen.html" class="menu-link">
-                  <div class="text-truncate" data-i18n="Fullscreen">Fullscreen</div>
-                </a>
-              </li>
-            </ul>
-          </li>
-          <li class="menu-item">
-            <a href="extended-ui-tour.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Tour">Tour</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="extended-ui-treeview.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Treeview">Treeview</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="extended-ui-misc.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Miscellaneous">Miscellaneous</div>
-            </a>
-          </li>
-        </ul>
-      </li>
-
-      <!-- Icons -->
-      <li class="menu-item">
-        <a href="javascript:void(0)" class="menu-link menu-toggle">
-          <i class="menu-icon tf-icons bx bx-crown"></i>
-          <div class="text-truncate" data-i18n="Icons">Icons</div>
-        </a>
-        <ul class="menu-sub">
-          <li class="menu-item">
-            <a href="icons-boxicons.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Boxicons">Boxicons</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="icons-font-awesome.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Fontawesome">Fontawesome</div>
-            </a>
-          </li>
-        </ul>
-      </li>
-
-      <!-- Forms & Tables -->
-      <li class="menu-header small text-uppercase">
-        <span class="menu-header-text" data-i18n="Forms & Tables">Forms &amp; Tables</span>
-      </li>
-      <!-- Forms -->
-      <li class="menu-item">
-        <a href="javascript:void(0);" class="menu-link menu-toggle">
-          <i class="menu-icon tf-icons bx bx-detail"></i>
-          <div class="text-truncate" data-i18n="Form Elements">Form Elements</div>
-        </a>
-        <ul class="menu-sub">
-          <li class="menu-item">
-            <a href="forms-basic-inputs.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Basic Inputs">Basic Inputs</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="forms-input-groups.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Input groups">Input groups</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="forms-custom-options.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Custom Options">Custom Options</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="forms-editors.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Editors">Editors</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="forms-file-upload.html" class="menu-link">
-              <div class="text-truncate" data-i18n="File Upload">File Upload</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="forms-pickers.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Pickers">Pickers</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="forms-selects.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Select & Tags">Select &amp; Tags</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="forms-sliders.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Sliders">Sliders</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="forms-switches.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Switches">Switches</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="forms-extras.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Extras">Extras</div>
-            </a>
-          </li>
-        </ul>
-      </li>
-      <li class="menu-item">
-        <a href="javascript:void(0);" class="menu-link menu-toggle">
-          <i class="menu-icon tf-icons bx bx-detail"></i>
-          <div class="text-truncate" data-i18n="Form Layouts">Form Layouts</div>
-        </a>
-        <ul class="menu-sub">
-          <li class="menu-item">
-            <a href="form-layouts-vertical.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Vertical Form">Vertical Form</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="form-layouts-horizontal.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Horizontal Form">Horizontal Form</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="form-layouts-sticky.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Sticky Actions">Sticky Actions</div>
-            </a>
-          </li>
-        </ul>
-      </li>
-      <li class="menu-item">
-        <a href="javascript:void(0);" class="menu-link menu-toggle">
-          <i class="menu-icon tf-icons bx bx-carousel"></i>
-          <div class="text-truncate" data-i18n="Form Wizard">Form Wizard</div>
-        </a>
-        <ul class="menu-sub">
-          <li class="menu-item">
-            <a href="form-wizard-numbered.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Numbered">Numbered</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="form-wizard-icons.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Icons">Icons</div>
-            </a>
-          </li>
-        </ul>
-      </li>
-      <li class="menu-item">
-        <a href="form-validation.html" class="menu-link">
-          <i class="menu-icon tf-icons bx bx-list-check"></i>
-          <div class="text-truncate" data-i18n="Form Validation">Form Validation</div>
-        </a>
-      </li>
-      <!-- Tables -->
-      <li class="menu-item">
-        <a href="tables-basic.html" class="menu-link">
-          <i class="menu-icon tf-icons bx bx-table"></i>
-          <div class="text-truncate" data-i18n="Tables">Tables</div>
-        </a>
-      </li>
-      <li class="menu-item">
-        <a href="javascript:void(0);" class="menu-link menu-toggle">
-          <i class="menu-icon tf-icons bx bx-grid"></i>
-          <div class="text-truncate" data-i18n="Datatables">Datatables</div>
-        </a>
-        <ul class="menu-sub">
-          <li class="menu-item">
-            <a href="tables-datatables-basic.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Basic">Basic</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="tables-datatables-advanced.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Advanced">Advanced</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="tables-datatables-extensions.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Extensions">Extensions</div>
-            </a>
-          </li>
-        </ul>
-      </li>
-
-      <!-- Charts & Maps -->
-      <li class="menu-header small text-uppercase">
-        <span class="menu-header-text" data-i18n="Charts & Maps">Charts &amp; Maps</span>
-      </li>
-      <li class="menu-item">
-        <a href="javascript:void(0);" class="menu-link menu-toggle">
-          <i class="menu-icon tf-icons bx bx-chart"></i>
-          <div class="text-truncate" data-i18n="Charts">Charts</div>
-        </a>
-        <ul class="menu-sub">
-          <li class="menu-item">
-            <a href="charts-apex.html" class="menu-link">
-              <div class="text-truncate" data-i18n="Apex Charts">Apex Charts</div>
-            </a>
-          </li>
-          <li class="menu-item">
-            <a href="charts-chartjs.html" class="menu-link">
-              <div class="text-truncate" data-i18n="ChartJS">ChartJS</div>
-            </a>
-          </li>
-        </ul>
-      </li>
-      <li class="menu-item">
-        <a href="maps-leaflet.html" class="menu-link">
-          <i class="menu-icon tf-icons bx bx-map-alt"></i>
-          <div class="text-truncate" data-i18n="Leaflet Maps">Leaflet Maps</div>
-        </a>
-      </li>
-
-      <!-- Misc -->
-      <li class="menu-header small text-uppercase">
-        <span class="menu-header-text" data-i18n="Misc">Misc</span>
-      </li>
-      <li class="menu-item">
-        <a href="https://themeselection.com/support/" target="_blank" class="menu-link">
-          <i class="menu-icon tf-icons bx bx-support"></i>
-          <div class="text-truncate" data-i18n="Support">Support</div>
-        </a>
-      </li>
-      <li class="menu-item">
-        <a
-          href="https://demos.themeselection.com/sneat-bootstrap-html-admin-template/documentation/"
-          target="_blank"
-          class="menu-link"
-        >
-          <i class="menu-icon tf-icons bx bx-file"></i>
-          <div class="text-truncate" data-i18n="Documentation">Documentation</div>
-        </a>
-      </li>
     </ul>
   </aside>
+  <!-- / Menu -->
 </template>
-<script setup>
-</script>
-<style>
-</style>
+
+<script setup></script>
+
+<style lang="scss" scoped></style>
diff --git a/src/views/MainView.vue b/src/views/MainView.vue
index 7f1e4c3..5d99817 100644
--- a/src/views/MainView.vue
+++ b/src/views/MainView.vue
@@ -2,6 +2,8 @@
   <div class="container-xxl flex-grow-1 container-p-y">
     <div class="row">
       <div class="col-xxl-8 mb-6 order-0">
+        <Sample-input />
+
         <div class="card">
           <div class="d-flex align-items-start row">
             <div class="col-sm-7">
@@ -1286,7 +1288,7 @@
 </template>
 
 <script setup>
-
+import SampleInput from '@c/SampleInput.vue'
 </script>
 
 <style lang="scss" scoped></style>