diff --git a/app/Http/Livewire/Admin/Menu.php b/app/Http/Livewire/Admin/Menu.php
new file mode 100644
index 0000000..18c9b94
--- /dev/null
+++ b/app/Http/Livewire/Admin/Menu.php
@@ -0,0 +1,14 @@
+<?php
+
+namespace App\Http\Livewire\Admin;
+
+use Livewire\Component;
+
+class Menu extends Component
+{
+    public string $pageHeader='Menu';
+    public function render()
+    {
+        return view('livewire.admin.menu',['pageHeader'=>$this->pageHeader]);
+    }
+}
diff --git a/app/Http/Livewire/Admin/Profile.php b/app/Http/Livewire/Admin/Profile.php
new file mode 100644
index 0000000..0c914b4
--- /dev/null
+++ b/app/Http/Livewire/Admin/Profile.php
@@ -0,0 +1,22 @@
+<?php
+
+namespace App\Http\Livewire\Admin;
+
+use Illuminate\Http\Request;
+use Livewire\Component;
+
+class Profile extends Component
+{
+    public $pageHeader='Profile';
+
+
+
+    public function render(Request $request)
+    {
+        return view('livewire.admin.profile',[
+            'pageHeader'=>$this->pageHeader,
+            'request' => $request,
+            'user' => $request->user()
+        ]);
+    }
+}
diff --git a/app/Models/Menu.php b/app/Models/Menu.php
new file mode 100644
index 0000000..17f7ad2
--- /dev/null
+++ b/app/Models/Menu.php
@@ -0,0 +1,11 @@
+<?php
+
+namespace App\Models;
+
+use Illuminate\Database\Eloquent\Factories\HasFactory;
+use Illuminate\Database\Eloquent\Model;
+
+class Menu extends Model
+{
+    use HasFactory;
+}
diff --git a/app/View/Components/Item/Button.php b/app/View/Components/Item/Button.php
new file mode 100644
index 0000000..8907c3d
--- /dev/null
+++ b/app/View/Components/Item/Button.php
@@ -0,0 +1,28 @@
+<?php
+
+namespace App\View\Components\Item;
+
+use Illuminate\View\Component;
+
+class Button extends Component
+{
+    /**
+     * Create a new component instance.
+     *
+     * @return void
+     */
+    public function __construct()
+    {
+        //
+    }
+
+    /**
+     * Get the view / contents that represent the component.
+     *
+     * @return \Illuminate\Contracts\View\View|\Closure|string
+     */
+    public function render()
+    {
+        return view('components.item.button');
+    }
+}
diff --git a/app/View/Components/Item/Modal.php b/app/View/Components/Item/Modal.php
new file mode 100644
index 0000000..d81ee8d
--- /dev/null
+++ b/app/View/Components/Item/Modal.php
@@ -0,0 +1,28 @@
+<?php
+
+namespace App\View\Components\Item;
+
+use Illuminate\View\Component;
+
+class Modal extends Component
+{
+    /**
+     * Create a new component instance.
+     *
+     * @return void
+     */
+    public function __construct()
+    {
+        //
+    }
+
+    /**
+     * Get the view / contents that represent the component.
+     *
+     * @return \Illuminate\Contracts\View\View|\Closure|string
+     */
+    public function render()
+    {
+        return view('components.item.modal');
+    }
+}
diff --git a/app/View/Components/Layout/Sidebar/ArrowDirection.php b/app/View/Components/Layout/Sidebar/ArrowDirection.php
new file mode 100644
index 0000000..63476e1
--- /dev/null
+++ b/app/View/Components/Layout/Sidebar/ArrowDirection.php
@@ -0,0 +1,28 @@
+<?php
+
+namespace App\View\Components\Layout\Sidebar;
+
+use Illuminate\View\Component;
+
+class ArrowDirection extends Component
+{
+    /**
+     * Create a new component instance.
+     *
+     * @return void
+     */
+    public function __construct()
+    {
+        //
+    }
+
+    /**
+     * Get the view / contents that represent the component.
+     *
+     * @return \Illuminate\Contracts\View\View|\Closure|string
+     */
+    public function render()
+    {
+        return view('components.layout.sidebar.arrow-direction');
+    }
+}
diff --git a/app/View/Components/Layout/Sidebar/ChildOne.php b/app/View/Components/Layout/Sidebar/ChildOne.php
new file mode 100644
index 0000000..4561623
--- /dev/null
+++ b/app/View/Components/Layout/Sidebar/ChildOne.php
@@ -0,0 +1,29 @@
+<?php
+
+namespace App\View\Components\Layout\Sidebar;
+
+use Illuminate\View\Component;
+
+class ChildOne extends Component
+{
+    public $links;
+    /**
+     * Create a new component instance.
+     *
+     * @return void
+     */
+    public function __construct($links=[])
+    {
+       $this->links=$links;
+    }
+
+    /**
+     * Get the view / contents that represent the component.
+     *
+     * @return \Illuminate\Contracts\View\View|\Closure|string
+     */
+    public function render()
+    {
+        return view('components.layout.sidebar.child-one',['links'=>$this->links]);
+    }
+}
diff --git a/app/View/Components/Layout/Sidebar/ChildTwo.php b/app/View/Components/Layout/Sidebar/ChildTwo.php
new file mode 100644
index 0000000..c021a85
--- /dev/null
+++ b/app/View/Components/Layout/Sidebar/ChildTwo.php
@@ -0,0 +1,28 @@
+<?php
+
+namespace App\View\Components\Layout\Sidebar;
+
+use Illuminate\View\Component;
+
+class ChildTwo extends Component
+{
+    /**
+     * Create a new component instance.
+     *
+     * @return void
+     */
+    public function __construct()
+    {
+        //
+    }
+
+    /**
+     * Get the view / contents that represent the component.
+     *
+     * @return \Illuminate\Contracts\View\View|\Closure|string
+     */
+    public function render()
+    {
+        return view('components.layout.sidebar.child-two');
+    }
+}
diff --git a/app/View/Components/Layout/Sidebar/SubOne.php b/app/View/Components/Layout/Sidebar/SubOne.php
new file mode 100644
index 0000000..8a88533
--- /dev/null
+++ b/app/View/Components/Layout/Sidebar/SubOne.php
@@ -0,0 +1,28 @@
+<?php
+
+namespace App\View\Components\Layout\Sidebar;
+
+use Illuminate\View\Component;
+
+class SubOne extends Component
+{
+    /**
+     * Create a new component instance.
+     *
+     * @return void
+     */
+    public function __construct()
+    {
+        //
+    }
+
+    /**
+     * Get the view / contents that represent the component.
+     *
+     * @return \Illuminate\Contracts\View\View|\Closure|string
+     */
+    public function render()
+    {
+        return view('components.layout.sidebar.sub-one');
+    }
+}
diff --git a/app/View/Components/Svg/Add.php b/app/View/Components/Svg/Add.php
new file mode 100644
index 0000000..d701539
--- /dev/null
+++ b/app/View/Components/Svg/Add.php
@@ -0,0 +1,28 @@
+<?php
+
+namespace App\View\Components\Svg;
+
+use Illuminate\View\Component;
+
+class Add extends Component
+{
+    /**
+     * Create a new component instance.
+     *
+     * @return void
+     */
+    public function __construct()
+    {
+        //
+    }
+
+    /**
+     * Get the view / contents that represent the component.
+     *
+     * @return \Illuminate\Contracts\View\View|\Closure|string
+     */
+    public function render()
+    {
+        return view('components.svg.add');
+    }
+}
diff --git a/app/View/Components/Svg/Home.php b/app/View/Components/Svg/Home.php
new file mode 100644
index 0000000..384fb1d
--- /dev/null
+++ b/app/View/Components/Svg/Home.php
@@ -0,0 +1,28 @@
+<?php
+
+namespace App\View\Components\Svg;
+
+use Illuminate\View\Component;
+
+class Home extends Component
+{
+    /**
+     * Create a new component instance.
+     *
+     * @return void
+     */
+    public function __construct()
+    {
+        //
+    }
+
+    /**
+     * Get the view / contents that represent the component.
+     *
+     * @return \Illuminate\Contracts\View\View|\Closure|string
+     */
+    public function render()
+    {
+        return view('components.svg.home');
+    }
+}
diff --git a/app/View/Components/Svg/Menu.php b/app/View/Components/Svg/Menu.php
new file mode 100644
index 0000000..8dbb2d2
--- /dev/null
+++ b/app/View/Components/Svg/Menu.php
@@ -0,0 +1,28 @@
+<?php
+
+namespace App\View\Components\Svg;
+
+use Illuminate\View\Component;
+
+class Menu extends Component
+{
+    /**
+     * Create a new component instance.
+     *
+     * @return void
+     */
+    public function __construct()
+    {
+        //
+    }
+
+    /**
+     * Get the view / contents that represent the component.
+     *
+     * @return \Illuminate\Contracts\View\View|\Closure|string
+     */
+    public function render()
+    {
+        return view('components.svg.menu');
+    }
+}
diff --git a/app/View/Components/Svg/Users.php b/app/View/Components/Svg/Users.php
new file mode 100644
index 0000000..c8bc09f
--- /dev/null
+++ b/app/View/Components/Svg/Users.php
@@ -0,0 +1,28 @@
+<?php
+
+namespace App\View\Components\Svg;
+
+use Illuminate\View\Component;
+
+class Users extends Component
+{
+    /**
+     * Create a new component instance.
+     *
+     * @return void
+     */
+    public function __construct()
+    {
+        //
+    }
+
+    /**
+     * Get the view / contents that represent the component.
+     *
+     * @return \Illuminate\Contracts\View\View|\Closure|string
+     */
+    public function render()
+    {
+        return view('components.svg.users');
+    }
+}
diff --git a/database/migrations/2022_11_09_085026_create_menus_table.php b/database/migrations/2022_11_09_085026_create_menus_table.php
new file mode 100644
index 0000000..d374a72
--- /dev/null
+++ b/database/migrations/2022_11_09_085026_create_menus_table.php
@@ -0,0 +1,33 @@
+<?php
+
+use Illuminate\Database\Migrations\Migration;
+use Illuminate\Database\Schema\Blueprint;
+use Illuminate\Support\Facades\Schema;
+
+return new class extends Migration
+{
+    /**
+     * Run the migrations.
+     *
+     * @return void
+     */
+    public function up()
+    {
+        Schema::create('menus', function (Blueprint $table) {
+            $table->id();
+            $table->string('name')->unique();
+            $table->string('svg')->unique()->nullable();
+            $table->timestamps();
+        });
+    }
+
+    /**
+     * Reverse the migrations.
+     *
+     * @return void
+     */
+    public function down()
+    {
+        Schema::dropIfExists('menus');
+    }
+};
diff --git a/resources/views/components/item/button.blade.php b/resources/views/components/item/button.blade.php
new file mode 100644
index 0000000..ac254e5
--- /dev/null
+++ b/resources/views/components/item/button.blade.php
@@ -0,0 +1,26 @@
+@props(['size'=>'default'])
+@switch($size)
+    @case('small')
+    <button type="button" {{ $attributes->merge(['class' => 'rounded-full py-2 px-3 inline-flex justify-center items-center gap-2 rounded-md border border-transparent font-semibold bg-blue-500 text-white
+            hover:bg-blue-600 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 transition-all text-sm dark:focus:ring-offset-gray-800']) }} >
+       <span class="flex justify-center items-center">  {{$slot}} </span>
+    </button>
+    @break
+
+    @case('default')
+    <button type="button" {{ $attributes->merge(['class' => 'py-3 px-4 inline-flex justify-center items-center gap-2 rounded-md border border-transparent font-semibold bg-blue-500 text-white
+        hover:bg-blue-600 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 transition-all text-sm dark:focus:ring-offset-gray-800']) }}>
+        {{$slot}}
+    </button>
+    @break
+
+    @case('large')
+    <button type="button" {{ $attributes->merge(['class' => 'py-3 px-4 inline-flex justify-center items-center gap-2 rounded-md border border-transparent font-semibold bg-blue-500 text-white
+        hover:bg-blue-600 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 transition-all text-sm sm:p-5 dark:focus:ring-offset-gray-800']) }}>
+        {{$slot}}
+    </button>
+    @break
+@endswitch
+
+
+
diff --git a/resources/views/components/item/modal.blade.php b/resources/views/components/item/modal.blade.php
new file mode 100644
index 0000000..31e5d74
--- /dev/null
+++ b/resources/views/components/item/modal.blade.php
@@ -0,0 +1,115 @@
+@props(['type','buttonName'=>'Give some name', 'modalHeader'=>'Give a header'])
+<x-item.button @click.prevent="isFirstModelButtonClicked = true" size="small">
+    @switch($type)
+        @case('add')
+        <x-svg.add class="flex w-4 h-4"></x-svg.add>
+        @break
+
+        @case('update')
+        <x-svg.add class="flex w-4 h-4"></x-svg.add>
+        @break
+
+        @case('delete')
+        <x-svg.add class="flex w-4 h-4"></x-svg.add>
+        @break
+    @endswitch
+
+    <span class="flex ml-1">{{__($buttonName)}}</span>
+</x-item.button>
+
+
+<div id="hs-vertically-centered-scrollable-modal"
+     class="hs-overlay  transition-all duration-300 opacity-0 w-full h-full fixed top-0 left-0 z-[80] overflow-x-hidden overflow-y-auto ustify-center items-center"
+     :class="{ 'block opacity-100 transition-all duration-300': isFirstModelButtonClicked === true, ' opacity-0 transition-all duration-300 hidden': isFirstModelButtonClicked===false  }"
+>
+    <div
+        class=" opacity-0 sm:max-w-lg sm:w-full m-3 sm:mx-auto h-[calc(100%-3.5rem)] min-h-[calc(100%-3.5rem)] flex items-center"
+        :class="{ '!flex transition-all duration-300 opacity-100 ': isFirstModelButtonClicked===true }"
+    >
+        <div
+            class="max-h-full overflow-hidden flex flex-col bg-white border shadow-sm rounded-xl dark:bg-oblue-300 dark:border-oblue-100 dark:shadow-olblue-900/[.5]">
+            <div class="flex justify-between items-center py-3 px-4 border-b dark:border-olblue-800">
+                <h3 class="flex justify-start items-center font-bold text-gray-800 dark:text-white">
+                    @switch($type)
+                        @case('add')
+                        <x-svg.add class="flex w-5 h-5"></x-svg.add>
+                        @break
+
+                        @case('update')
+                        <x-svg.add class="flex w-5 h-5"></x-svg.add>
+                        @break
+
+                        @case('delete')
+                        <x-svg.add class="flex w-5 h-5"></x-svg.add>
+                        @break
+                    @endswitch
+
+                    <span class="flex ml-1">{{$modalHeader}}</span>
+
+                </h3>
+                <button @click.prevent="isFirstModelButtonClicked = false" type="button"
+                        class="inline-flex flex-shrink-0 justify-center items-center h-8 w-8 rounded-md text-gray-500 hover:text-gray-400 focus:outline-none focus:ring-2 focus:ring-gray-400 focus:ring-offset-2 focus:ring-offset-white transition-all text-sm dark:focus:ring-gray-700 dark:focus:ring-offset-gray-800">
+                    <span class="sr-only">Close</span>
+                    <svg class="w-3.5 h-3.5" width="8" height="8" viewBox="0 0 8 8" fill="none"
+                         xmlns="http://www.w3.org/2000/svg">
+                        <path
+                            d="M0.258206 1.00652C0.351976 0.912791 0.479126 0.860131 0.611706 0.860131C0.744296 0.860131 0.871447 0.912791 0.965207 1.00652L3.61171 3.65302L6.25822 1.00652C6.30432 0.958771 6.35952 0.920671 6.42052 0.894471C6.48152 0.868271 6.54712 0.854471 6.61352 0.853901C6.67992 0.853321 6.74572 0.865971 6.80722 0.891111C6.86862 0.916251 6.92442 0.953381 6.97142 1.00032C7.01832 1.04727 7.05552 1.1031 7.08062 1.16454C7.10572 1.22599 7.11842 1.29183 7.11782 1.35822C7.11722 1.42461 7.10342 1.49022 7.07722 1.55122C7.05102 1.61222 7.01292 1.6674 6.96522 1.71352L4.31871 4.36002L6.96522 7.00648C7.05632 7.10078 7.10672 7.22708 7.10552 7.35818C7.10442 7.48928 7.05182 7.61468 6.95912 7.70738C6.86642 7.80018 6.74102 7.85268 6.60992 7.85388C6.47882 7.85498 6.35252 7.80458 6.25822 7.71348L3.61171 5.06702L0.965207 7.71348C0.870907 7.80458 0.744606 7.85498 0.613506 7.85388C0.482406 7.85268 0.357007 7.80018 0.264297 7.70738C0.171597 7.61468 0.119017 7.48928 0.117877 7.35818C0.116737 7.22708 0.167126 7.10078 0.258206 7.00648L2.90471 4.36002L0.258206 1.71352C0.164476 1.61976 0.111816 1.4926 0.111816 1.36002C0.111816 1.22744 0.164476 1.10028 0.258206 1.00652Z"
+                            fill="currentColor"/>
+                    </svg>
+                </button>
+            </div>
+            <div class="p-4 overflow-y-auto">
+                <div class="space-y-4">
+                    <div>
+                        <h3 class="text-lg font-semibold text-gray-800 dark:text-white">Be bold</h3>
+                        <p class="mt-1 text-gray-800 dark:text-gray-400">
+                            Motivate teams to do their best work. Offer best practices to get users going in the right
+                            direction. Be bold and offer just enough help to get the work started, and then get out of
+                            the way. Give accurate information so users can make educated decisions. Know your user's
+                            struggles and desired outcomes and give just enough information to let them get where they
+                            need to go.
+                        </p>
+                    </div>
+
+                    <div>
+                        <h3 class="text-lg font-semibold text-gray-800 dark:text-white">Be optimistic</h3>
+                        <p class="mt-1 text-gray-800 dark:text-gray-400">
+                            Focusing on the details gives people confidence in our products. Weave a consistent story
+                            across our fabric and be diligent about vocabulary across all messaging by being brand
+                            conscious across products to create a seamless flow across all the things. Let people know
+                            that they can jump in and start working expecting to find a dependable experience across all
+                            the things. Keep teams in the loop about what is happening by informing them of relevant
+                            features, products and opportunities for success. Be on the journey with them and highlight
+                            the key points that will help them the most - right now. Be in the moment by focusing
+                            attention on the important bits first.
+                        </p>
+                    </div>
+
+                    <div>
+                        <h3 class="text-lg font-semibold text-gray-800 dark:text-white">Be practical, with a wink</h3>
+                        <p class="mt-1 text-gray-800 dark:text-gray-400">
+                            Keep our own story short and give teams just enough to get moving. Get to the point and be
+                            direct. Be concise - we tell the story of how we can help, but we do it directly and with
+                            purpose. Be on the lookout for opportunities and be quick to offer a helping hand. At the
+                            same time realize that novbody likes a nosy neighbor. Give the user just enough to know that
+                            something awesome is around the corner and then get out of the way. Write clear, accurate,
+                            and concise text that makes interfaces more usable and consistent - and builds trust. We
+                            strive to write text that is understandable by anyone, anywhere, regardless of their culture
+                            or language so that everyone feels they are part of the team.
+                        </p>
+                    </div>
+                </div>
+            </div>
+            <div class="flex justify-end items-center gap-x-2 py-3 px-4 border-t dark:border-gray-700">
+                <button @click.prevent="isFirstModelButtonClicked = false" type="button"
+                        class="py-3 px-4 inline-flex justify-center items-center gap-2 rounded-md border font-medium bg-white text-gray-700 shadow-sm align-middle hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-white focus:ring-blue-600 transition-all text-sm dark:bg-gray-800 dark:hover:bg-slate-800 dark:border-gray-700 dark:text-gray-400 dark:hover:text-white dark:focus:ring-offset-gray-800">
+                    Close
+                </button>
+                <a class="py-3 px-4 inline-flex justify-center items-center gap-2 rounded-md border border-transparent font-semibold bg-blue-500 text-white hover:bg-blue-600 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 transition-all text-sm dark:focus:ring-offset-gray-800"
+                   href="#">
+                    Save changes
+                </a>
+            </div>
+        </div>
+    </div>
+</div>
diff --git a/resources/views/components/layout/sidebar/arrow-direction.blade.php b/resources/views/components/layout/sidebar/arrow-direction.blade.php
new file mode 100644
index 0000000..bcfeb73
--- /dev/null
+++ b/resources/views/components/layout/sidebar/arrow-direction.blade.php
@@ -0,0 +1,17 @@
+    <svg
+        class="hs-accordion-active:block ml-auto hidden w-3 h-3 text-slate-600 group-hover:text-slate-500 dark:text-slate-400"
+        width="16" height="16" viewBox="0 0 16 16" fill="none"
+        xmlns="http://www.w3.org/2000/svg">
+        <path
+            d="M2 11L8.16086 5.31305C8.35239 5.13625 8.64761 5.13625 8.83914 5.31305L15 11"
+            stroke="currentColor" stroke-width="2" stroke-linecap="round"></path>
+    </svg>
+
+    <svg
+        class="hs-accordion-active:hidden ml-auto block w-3 h-3 text-slate-600 group-hover:text-slate-500 dark:text-slate-400"
+        width="16" height="16" viewBox="0 0 16 16" fill="none"
+        xmlns="http://www.w3.org/2000/svg">
+        <path
+            d="M2 5L8.16086 10.6869C8.35239 10.8637 8.64761 10.8637 8.83914 10.6869L15 5"
+            stroke="currentColor" stroke-width="2" stroke-linecap="round"></path>
+    </svg>
diff --git a/resources/views/components/layout/sidebar/child-one.blade.php b/resources/views/components/layout/sidebar/child-one.blade.php
new file mode 100644
index 0000000..95b577c
--- /dev/null
+++ b/resources/views/components/layout/sidebar/child-one.blade.php
@@ -0,0 +1,54 @@
+@props(['id'=>null, 'name'=>null , 'childCount'=>0])
+@if($id != null)
+    <li class="hs-accordion" id="{{$id}}">
+        <a {{ $attributes->merge(['class' => 'hs-accordion-toggle cursor-pointer flex items-center gap-x-3.5 py-2 px-2.5 hs-accordion-active:text-blue-600 hs-accordion-active:hover:bg-transparent text-sm text-slate-700
+rounded-md hover:bg-slate-100  dark:hover:bg-oblue-500 dark:text-slate-400 dark:hover:bg-oblue-500 dark:hs-accordion-active:text-white']) }} >
+            @switch($name)
+                @case('Users')
+                <x-svg.users></x-svg.users>
+                {{ __($name) }}
+                @break
+
+{{--                @case('Menu')--}}
+{{--                <x-svg.menu></x-svg.menu>--}}
+{{--                {{ __($name) }}--}}
+{{--                @break--}}
+
+                @default
+                {{ __($name) }}
+                @break
+            @endswitch
+            @if($childCount > 0) <x-layout.sidebar.arrow-direction></x-layout.sidebar.arrow-direction> @endif
+        </a>
+        <div id="{{$id}}"
+             class="hs-accordion-content w-full overflow-hidden transition-[height] duration-300 hidden">
+            {{$slot}}
+        </div>
+    </li>
+@else
+    <li>
+        <a {{ $attributes->merge(['class' => 'flex items-center gap-x-3.5 py-2 px-2.5 text-sm text-slate-700 rounded-md hover:bg-slate-100 dark:hover:bg-oblue-500 dark:text-slate-400 dark:hover:bg-oblue-500']) }} href="route($href)">
+            @switch($name)
+                @case('Dashboard')
+                <x-svg.home></x-svg.home>
+                {{ __($name) }}
+                @break
+
+                @case('Users')
+                <x-svg.users></x-svg.users>
+                {{ __($name) }}
+                @break
+
+                @case('Menu')
+                <x-svg.menu></x-svg.menu>
+                {{ __($name) }}
+                @break
+
+                @default
+                {{ __($name) }}
+                @break
+            @endswitch
+        </a>
+    </li>
+@endif
+
diff --git a/resources/views/components/layout/sidebar/child-two.blade.php b/resources/views/components/layout/sidebar/child-two.blade.php
new file mode 100644
index 0000000..094f4a0
--- /dev/null
+++ b/resources/views/components/layout/sidebar/child-two.blade.php
@@ -0,0 +1,13 @@
+@props(['links'=>[]])
+@if(count($links) > 0)
+<ul class="pt-2 pl-2">
+    @foreach($links as $link)
+    <li>
+        <a class="flex items-center gap-x-3.5 py-2 px-2.5 text-sm text-slate-700 rounded-md hover:bg-slate-100 dark:text-slate-400 dark:hover:bg-oblue-500"
+           href="javascript:;">
+            {{$link}}
+        </a>
+    </li>
+    @endforeach
+</ul>
+    @endif
diff --git a/resources/views/components/layout/sidebar/parent.blade.php b/resources/views/components/layout/sidebar/parent.blade.php
new file mode 100644
index 0000000..3425cfe
--- /dev/null
+++ b/resources/views/components/layout/sidebar/parent.blade.php
@@ -0,0 +1,5 @@
+<nav x-data="{ active:false }" class="hs-accordion-group p-6 w-full flex flex-col flex-wrap" data-hs-accordion-always-open>
+    <ul class="space-y-1.5">
+        {{$slot}}
+    </ul>
+</nav>
diff --git a/resources/views/components/svg/add.blade.php b/resources/views/components/svg/add.blade.php
new file mode 100644
index 0000000..960bac6
--- /dev/null
+++ b/resources/views/components/svg/add.blade.php
@@ -0,0 +1,3 @@
+<svg {{ $attributes->merge(['class' => 'flex-none']) }} xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" >
+    <path stroke-linecap="round" stroke-linejoin="round" d="M12 4.5v15m7.5-7.5h-15" />
+</svg>
diff --git a/resources/views/components/svg/home.blade.php b/resources/views/components/svg/home.blade.php
new file mode 100644
index 0000000..7a53887
--- /dev/null
+++ b/resources/views/components/svg/home.blade.php
@@ -0,0 +1,7 @@
+<svg {{ $attributes->merge(['class' => 'flex-none']) }} xmlns="http://www.w3.org/2000/svg" width="16" height="16"
+     fill="currentColor" viewBox="0 0 16 16">
+    <path fill-rule="evenodd"
+          d="M2 13.5V7h1v6.5a.5.5 0 0 0 .5.5h9a.5.5 0 0 0 .5-.5V7h1v6.5a1.5 1.5 0 0 1-1.5 1.5h-9A1.5 1.5 0 0 1 2 13.5zm11-11V6l-2-2V2.5a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5z"/>
+    <path fill-rule="evenodd"
+          d="M7.293 1.5a1 1 0 0 1 1.414 0l6.647 6.646a.5.5 0 0 1-.708.708L8 2.207 1.354 8.854a.5.5 0 1 1-.708-.708L7.293 1.5z"/>
+</svg>
diff --git a/resources/views/components/svg/menu.blade.php b/resources/views/components/svg/menu.blade.php
new file mode 100644
index 0000000..05382ca
--- /dev/null
+++ b/resources/views/components/svg/menu.blade.php
@@ -0,0 +1,4 @@
+<svg {{ $attributes->merge(['class' => 'flex-none']) }}  xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"  width="16" height="16">
+    <path stroke-linecap="round" stroke-linejoin="round" d="M3.75 5.25h16.5m-16.5 4.5h16.5m-16.5 4.5h16.5m-16.5 4.5h16.5" />
+</svg>
+
diff --git a/resources/views/components/svg/users.blade.php b/resources/views/components/svg/users.blade.php
new file mode 100644
index 0000000..f5e2b00
--- /dev/null
+++ b/resources/views/components/svg/users.blade.php
@@ -0,0 +1,5 @@
+<svg {{ $attributes->merge(['class' => 'flex-none']) }} xmlns="http://www.w3.org/2000/svg" width="16" height="16"
+     fill="currentColor" viewBox="0 0 16 16">
+    <path
+        d="M15 14s1 0 1-1-1-4-5-4-5 3-5 4 1 1 1 1h8zm-7.978-1A.261.261 0 0 1 7 12.996c.001-.264.167-1.03.76-1.72C8.312 10.629 9.282 10 11 10c1.717 0 2.687.63 3.24 1.276.593.69.758 1.457.76 1.72l-.008.002a.274.274 0 0 1-.014.002H7.022zM11 7a2 2 0 1 0 0-4 2 2 0 0 0 0 4zm3-2a3 3 0 1 1-6 0 3 3 0 0 1 6 0zM6.936 9.28a5.88 5.88 0 0 0-1.23-.247A7.35 7.35 0 0 0 5 9c-4 0-5 3-5 4 0 .667.333 1 1 1h4.216A2.238 2.238 0 0 1 5 13c0-1.01.377-2.042 1.09-2.904.243-.294.526-.569.846-.816zM4.92 10A5.493 5.493 0 0 0 4 13H1c0-.26.164-1.03.76-1.724.545-.636 1.492-1.256 3.16-1.275zM1.5 5.5a3 3 0 1 1 6 0 3 3 0 0 1-6 0zm3-2a2 2 0 1 0 0 4 2 2 0 0 0 0-4z"></path>
+</svg>
diff --git a/resources/views/livewire/admin/menu.blade.php b/resources/views/livewire/admin/menu.blade.php
new file mode 100644
index 0000000..a68ae4d
--- /dev/null
+++ b/resources/views/livewire/admin/menu.blade.php
@@ -0,0 +1,13 @@
+<div>
+    @livewire('layout.navigation')
+    @livewire('layout.toggle')
+    @livewire('layout.sidebar')
+    @livewire('layout.header',['header'=>$pageHeader])
+
+    <!-- Page Content -->
+    <x-layout.content>
+
+<x-item.modal buttonName="Create" type="add" modalHeader="Create Menu"></x-item.modal>
+
+    </x-layout.content>
+</div>
diff --git a/resources/views/livewire/admin/profile.blade.php b/resources/views/livewire/admin/profile.blade.php
new file mode 100644
index 0000000..165ecc3
--- /dev/null
+++ b/resources/views/livewire/admin/profile.blade.php
@@ -0,0 +1,63 @@
+<div>
+    @livewire('layout.navigation')
+    @livewire('layout.toggle')
+    @livewire('layout.sidebar')
+    @livewire('layout.header',['header'=>$pageHeader])
+
+    <!-- Page Content -->
+    <x-layout.content>
+
+
+        <div>
+            <div class="max-w-7xl mx-auto py-0 sm:px-6 lg:px-0">
+                @if (Laravel\Fortify\Features::canUpdateProfileInformation())
+                    @if(Auth::guard('admin')->check())
+                        @livewire('admin-update-profile-information-form')
+                    @else
+                        @livewire('profile.update-profile-information-form')
+                    @endif
+                    <x-jet-section-border/>
+                @endif
+
+                @if (Laravel\Fortify\Features::enabled(Laravel\Fortify\Features::updatePasswords()))
+                    <div class="mt-10 sm:mt-0">
+                        @livewire('profile.update-password-form')
+                    </div>
+
+                    <x-jet-section-border />
+                @endif
+
+                @if (Laravel\Fortify\Features::canManageTwoFactorAuthentication())
+                    <div class="mt-10 sm:mt-0">
+
+                        @if(Auth::guard('admin')->check())
+                            @livewire('admin-two-factor-authentication-form')
+                        @else
+                            @livewire('profile.two-factor-authentication-form')
+                        @endif
+
+                    </div>
+
+                    <x-jet-section-border />
+                @endif
+
+                <div class="mt-10 sm:mt-0">
+                    @livewire('profile.logout-other-browser-sessions-form')
+                </div>
+
+                @if (Laravel\Jetstream\Jetstream::hasAccountDeletionFeatures())
+                    <x-jet-section-border />
+
+                    <div class="mt-10 sm:mt-0">
+                        @livewire('profile.delete-user-form')
+                    </div>
+                @endif
+            </div>
+        </div>
+
+
+
+
+    </x-layout.content>
+
+</div>