first commit

resources/views/admin/about.blade.php

@@ -0,0 +1,23 @@
+@extends('layouts.admin.app')
+
+@section('content')
+    <div class="container-xl">
+        <!-- Page title -->
+        <div class="page-header d-print-none">
+            <h2 class="page-title">
+                {{ __('About Page') }}
+            </h2>
+        </div>
+    </div>
+    <div class="page-body">
+        <div class="container-xl">
+            <div class="card">
+                <div class="card-body">
+                    <p class="card-text">
+                        {{ __('Sample static text page ') }}
+                    </p>
+                </div>
+            </div>
+        </div>
+    </div>
+@endsection

resources/views/admin/home.blade.php

@@ -0,0 +1,22 @@
+@extends('layouts.admin.app')
+
+@section('custom_styles')
+
+@endsection
+
+@section('content')
+    <div class="page-body">
+        <div class="container-xl">
+            
+            <div class="alert alert-success">
+                <div class="alert-title">
+                    {{ __('Welcome') }} {{ auth()->user()->name ?? null }}
+                </div>
+                <div class="text-muted">
+                    {{ __('You are logged in!') }}
+                </div>
+            </div>
+
+        </div>
+    </div>
+@endsection

resources/views/admin/users/index.blade.php

@@ -0,0 +1,50 @@
+@extends('layouts.admin.app')
+
+@section('content')
+    <div class="container-xl">
+        <!-- Page title -->
+        <div class="page-header d-print-none">
+            <h2 class="page-title">
+                {{ __('Users') }}
+            </h2>
+        </div>
+    </div>
+    <div class="page-body">
+        <div class="container-xl">
+
+            <div class="alert alert-info">
+                <div class="alert-title">Sample table page</div>
+            </div>
+
+            <div class="card">
+                <div class="table-responsive">
+                    <table class="table" id="dataTable" width="100%" cellspacing="0">
+                        <thead>
+                            <tr>
+                                <th>{{ __('Name') }}</th>
+                                <th>{{ __('Email Address') }}</th>
+                                <th>{{ __('Created at') }}</th>
+                                <th>{{ __('Updated in') }}</th>
+                            </tr>
+                        </thead>
+                        <tbody>
+                        @foreach($users as $user)
+                            <tr>
+                                <td>{{ $user->name }}</td>
+                                <td>{{ $user->email }}</td>
+                                <td>{{ $user->created_at }}</td>
+                                <td>{{ $user->updated_at->diffForhumans() }}</td>
+                            </tr>
+                        @endforeach
+                        </tbody>
+                    </table>
+                </div>
+                @if( $users->hasPages() )
+                <div class="card-footer pb-0">
+                    {{ $users->links() }}
+                </div>
+                @endif
+            </div>
+        </div>
+    </div>
+@endsection

resources/views/auth/login.blade.php

@@ -0,0 +1,52 @@
+@extends('layouts.admin.guest')
+
+@section('content')
+    <form class="card card-md" action="{{ route('login') }}" method="post" autocomplete="off">
+        @csrf
+
+        <div class="card-body">
+            <h2 class="card-title text-center mb-4">{{ __('Login to your account') }}</h2>
+
+            <div class="mb-3">
+                <label class="form-label">{{ __('Email address') }}</label>
+                <input type="email" name="email" value="{{ old('email') }}" class="form-control @error('email') is-invalid @enderror" placeholder="{{ __('Enter email') }}" required autofocus tabindex="1">
+                @error('email')
+                <div class="invalid-feedback">{{ $message }}</div>
+                @enderror
+            </div>
+
+            <div class="mb-3">
+                <label class="form-label">
+                    {{ __('Password') }}
+                    @if (Route::has('password.request'))
+                    <span class="form-label-description">
+                        <a href="{{ route('password.request') }}" tabindex="5">{{ __('Forgot Password?') }}</a>
+                    </span>
+                    @endif
+                </label>
+                <input type="password" name="password" class="form-control @error('password') is-invalid @enderror" placeholder="{{ __('Password') }}" required tabindex="2">
+                @error('password')
+                <div class="invalid-feedback">{{ $message }}</div>
+                @enderror
+            </div>
+
+            <div>
+                <label class="form-check">
+                    <input type="checkbox" class="form-check-input" tabindex="3" name="remember" />
+                    <span class="form-check-label">{{ __('Remember me on this device') }}</span>
+                </label>
+            </div>
+
+            <div class="form-footer">
+                <button type="submit" class="btn btn-primary w-100" tabindex="4">{{ __('Sign in') }}</button>
+            </div>
+        </div>
+    </form>
+
+    @if (Route::has('register'))
+    <div class="text-center text-muted mt-3">
+        {{ __("Don't have account yet?") }} <a href="{{ route('register') }}" tabindex="-1">{{ __('Sign up') }}</a>
+    </div>
+    @endif
+
+@endsection

resources/views/auth/passwords/confirm.blade.php

@@ -0,0 +1,32 @@
+@extends('layouts.admin.guest')
+
+@section('content')
+    <form class="card card-md" action="{{ route('password.confirm') }}" method="post" autocomplete="off">
+        @csrf
+
+        <div class="card-body">
+            <h2 class="card-title text-center mb-4">{{ __('Confirm Password') }}</h2>
+
+            <p class="text-muted mb-4">{{ __('Please confirm your password before continuing.') }}</p>
+
+            <div class="mb-3">
+                <label class="form-label">
+                    {{ __('Password') }}
+                    @if (Route::has('password.request'))
+                    <span class="form-label-description">
+                        <a href="{{ route('password.request') }}">{{ __('Forgot Password?') }}</a>
+                    </span>
+                    @endif
+                </label>
+                <input type="password" name="password" class="form-control form-control-user @error('password') is-invalid @enderror" placeholder="{{ __('Enter Password') }}">
+                @error('password')
+                <div class="invalid-feedback">{{ $message }}</div>
+                @enderror
+            </div>
+
+            <div class="form-footer">
+                <button type="submit" class="btn btn-primary w-100">{{ __('Confirm Password') }}</button>
+            </div>
+        </div>
+    </form>
+@endsection

resources/views/auth/passwords/email.blade.php

@@ -0,0 +1,41 @@
+@extends('layouts.admin.guest')
+
+@section('content')
+
+    @if (session('status'))
+    <div class="alert alert-success" role="alert">
+        {{ session('status') }}
+    </div>
+    @endif
+
+    <form class="card card-md" action="{{ route('password.email') }}" method="post" autocomplete="off">
+        @csrf
+
+        <div class="card-body">
+            <h2 class="card-title text-center mb-4">{{ __('Forgot password') }}</h2>
+
+            <p class="text-muted mb-4">{{ __('Enter your email address and your password will be reset and emailed to you.') }}</p>
+
+            <div class="mb-3">
+                <label class="form-label">{{ __('Email address') }}</label>
+                <input type="email" name="email" value="{{ old('email') }}" class="form-control form-control-user @error('email') is-invalid @enderror" placeholder="{{ __('Enter Email Address...') }}">
+                @error('email')
+                <div class="invalid-feedback">{{ $message }}</div>
+                @enderror
+            </div>
+            
+            <div class="form-footer">
+                <button type="submit" class="btn btn-primary w-100">
+                    {{ __('Reset My Password') }}
+                </button>
+            </div>
+        </div>
+    </form>
+
+    @if (Route::has('login'))
+    <div class="text-center text-muted mt-3">
+        {{ __('Already have account?') }} <a href="{{ route('login') }}" tabindex="-1">{{ __('Sign in') }}</a>
+    </div>
+    @endif
+
+@endsection

resources/views/auth/passwords/reset.blade.php

@@ -0,0 +1,49 @@
+@extends('layouts.admin.guest')
+
+@section('content')
+    <form class="card card-md" action="{{ route('password.update') }}" method="post" autocomplete="off">
+        @csrf
+
+        <input type="hidden" name="token" value="{{ $token }}">
+
+        <div class="card-body">
+            <h2 class="card-title text-center mb-4">{{ __('Reset Password') }}</h2>
+
+            <div class="mb-3">
+                <label class="form-label">{{ __('Email address') }}</label>
+                <input type="email" name="email" value="{{ old('email') }}" class="form-control @error('email') is-invalid @enderror" placeholder="{{ __('Email Address') }}">
+                @error('email')
+                <div class="invalid-feedback">{{ $message }}</div>
+                @enderror
+            </div>
+
+            <div class="mb-3">
+                <label class="form-label">{{ __('New Password') }}</label>
+                <input type="password" name="password" class="form-control @error('password') is-invalid @enderror" placeholder="{{ __('New Password') }}">
+                @error('password')
+                <div class="invalid-feedback">{{ $message }}</div>
+                @enderror
+            </div>
+
+            <div class="mb-3">
+                <label class="form-label">{{ __('Repeat New Password') }}</label>
+                <input type="password" name="password_confirmation" class="form-control @error('password_confirmation') is-invalid @enderror" placeholder="{{ __('Repeat New Password') }}">
+                @error('password_confirmation')
+                <div class="invalid-feedback">{{ $message }}</div>
+                @enderror
+            </div>
+            
+            <div class="form-footer">
+                <button type="submit" class="btn btn-primary w-100">
+                    {{ __('Reset My Password') }}
+                </button>
+            </div>
+        </div>
+    </form>
+
+    @if (Route::has('login'))
+    <div class="text-center text-muted mt-3">
+        {{ __('Already have account?') }} <a href="{{ route('login') }}" tabindex="-1">{{ __('Sign in') }}</a>
+    </div>
+    @endif
+@endsection

resources/views/auth/profile.blade.php

@@ -0,0 +1,90 @@
+@extends('layouts.admin.app')
+
+@section('content')
+    <div class="container-xl">
+        <!-- Page title -->
+        <div class="page-header d-print-none">
+            <div class="row align-items-center">
+                <div class="col">
+                <!-- Page pre-title -->
+                <div class="page-pretitle">
+                    {{ config('app.name') }}
+                </div>
+                    <h2 class="page-title">
+                        {{ __('My profile') }}
+                    </h2>
+                </div>
+            </div>
+        </div>
+    </div>
+    <div class="page-body">
+        <div class="container-xl">
+
+            @if ($message = Session::get('success'))
+            <div class="alert alert-success alert-dismissible">
+                <div class="d-flex">
+                    <div>
+                        <svg xmlns="http://www.w3.org/2000/svg" class="icon icon alert-icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
+                            <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
+                            <path d="M5 12l5 5l10 -10"></path>
+                        </svg>
+                    </div>
+                    <div>
+                        {{ $message }}
+                    </div>
+                  </div>
+                <a class="btn-close" data-bs-dismiss="alert" aria-label="close"></a>
+            </div>
+            @endif
+
+            <form action="{{ route('profile.update') }}" method="POST" class="card" autocomplete="off">
+                @csrf
+                @method('PUT')
+
+                <div class="card-body">
+
+
+                    <div class="mb-3">
+                        <label class="form-label required">{{ __('Name') }}</label>
+                        <input type="text" name="name" class="form-control @error('name') is-invalid @enderror" placeholder="{{ __('Name') }}" value="{{ old('name', auth()->user()->name) }}" required>                        
+                    </div>
+                    @error('name')
+                    <div class="invalid-feedback">{{ $message }}</div>
+                    @enderror
+
+                    <div class="mb-3">
+                        <label class="form-label required">{{ __('Email address') }}</label>
+                        <input type="email" name="email" class="form-control @error('email') is-invalid @enderror" placeholder="{{ __('Email') }}" value="{{ old('email', auth()->user()->email) }}" required>
+                    </div>
+                    @error('email')
+                    <div class="invalid-feedback">{{ $message }}</div>
+                    @enderror
+
+                    <div class="mb-3">
+                        <label class="form-label required">{{ __('New password') }}</label>
+                        <input type="password" name="password" class="form-control @error('password') is-invalid @enderror" placeholder="{{ __('New password') }}">
+                    </div>
+                    @error('password')
+                    <div class="invalid-feedback">{{ $message }}</div>
+                    @enderror
+
+                    <div class="mb-3">
+                        <label class="form-label required">{{ __('New password confirmation') }}</label>
+                        <input type="password" name="password_confirmation" class="form-control @error('password_confirmation') is-invalid @enderror" placeholder="{{ __('New password confirmation') }}" autocomplete="new-password">
+                    </div>
+                    @error('password_confirmation')
+                    <div class="invalid-feedback">{{ $message }}</div>
+                    @enderror
+
+                </div>
+
+                <div class="card-footer">
+                    <button type="submit" class="btn btn-primary">{{ __('Submit') }}</button>
+                </div>
+
+            </form>
+
+        </div>
+    </div>
+
+@endsection

resources/views/auth/register.blade.php

@@ -0,0 +1,51 @@
+@extends('layouts.admin.guest')
+
+@section('content')
+    <form class="card card-md" action="{{ route('register') }}" method="post" autocomplete="off">
+        @csrf
+
+        <div class="card-body">
+            <h2 class="card-title text-center mb-4">{{ __('Create new account') }}</h2>
+
+            <div class="mb-3">
+                <label class="form-label">{{ __('Name') }}</label>
+                <input type="text" name="name" class="form-control @error('name') is-invalid @enderror" placeholder="{{ __('Name') }}">
+                @error('name')
+                <div class="invalid-feedback">{{ $message }}</div>
+                @enderror
+            </div>
+            <div class="mb-3">
+                <label class="form-label">{{ __('Email address') }}</label>
+                <input type="email" name="email" class="form-control @error('email') is-invalid @enderror" placeholder="{{ __('Email Address') }}">
+                @error('email')
+                <div class="invalid-feedback">{{ $message }}</div>
+                @enderror
+            </div>
+            <div class="mb-3">
+                <label class="form-label">{{ __('Password') }}</label>
+                <input type="password" name="password" class="form-control @error('password') is-invalid @enderror" placeholder="{{ __('Password') }}">
+                @error('password')
+                <div class="invalid-feedback">{{ $message }}</div>
+                @enderror
+            </div>
+            <div class="mb-3">
+                <label class="form-label">{{ __('Repeat Password') }}</label>
+                <input type="password" name="password_confirmation" class="form-control form-control-user @error('password_confirmation') is-invalid @enderror" placeholder="{{ __('Repeat Password') }}">
+                @error('password_confirmation')
+                <div class="invalid-feedback">{{ $message }}</div>
+                @enderror
+            </div>
+
+            <div class="form-footer">
+                <button type="submit" class="btn btn-primary w-100">{{ __('Create new account') }}</button>
+            </div>
+        </div>
+    </form>
+
+    @if (Route::has('login'))
+    <div class="text-center text-muted mt-3">
+        {{ __('Already have account?') }} <a href="{{ route('login') }}" tabindex="-1">{{ __('Sign in') }}</a>
+    </div>
+    @endif
+
+@endsection

resources/views/auth/verify.blade.php

@@ -0,0 +1,33 @@
+@extends('layouts.admin.app')
+
+@section('content')
+    <div class="page-body">
+        <div class="container-xl">
+
+            @if (session('resent'))
+                <div class="alert alert-success" role="alert">
+                    {{ __('A fresh verification link has been sent to your email address.') }}
+                </div>
+            @endif
+
+            <div class="card">
+                <div class="card-header">
+                    <div class="card-title">
+                        {{ __('Verify Your Email Address') }}
+                    </div>
+                </div>
+                <div class="card-body">
+                    <p>{{ __('Before proceeding, please check your email for a verification link.') }}</p>
+                    
+                    {{ __('If you did not receive the email') }},
+
+                    <form class="d-inline" method="POST" action="{{ route('verification.resend') }}">
+                        @csrf
+
+                        <button type="submit" class="btn btn-primary">{{ __('click here to request another') }}</button>
+                    </form>
+                </div>
+            </div>
+        </div>
+    </div>
+@endsection

resources/views/front/country.blade.php

@@ -0,0 +1,69 @@
+@extends('layouts.front.app')
+
+@section('content')
+<div class="container py-3">
+  <div class="row justify-content-center text-center">
+    <div class="col-12 col-lg-8 py-5">
+      <h2 class="h3 fw-bold">ProductAlert is the place to be for top rated product reviews with recommendation such as the right price, latest trend, from the best brands.</h2>
+    </div>
+  </div>
+</div>
+<div class="container-fluid py-4 bg-dark text-light">
+  <div class="container">
+    <h3 class="h4 fw-bold text-center mb-3">Featured Articles</h3>
+    <div class="row g-3 justify-content-center">
+      @for($i = 1; $i <= 3; $i++)
+      <div class="col-12 col-xl-3">
+        <a href="#" class="text-decoration-none">
+        <div class="card shadow-sm">
+          <img src="https://placekitten.com/400/300" alt="" class="card-img-top">
+          <div class="card-body">
+            <p class="card-text fw-bold">Here is why a kitten catches mice faster than an adult cat.</p>
+            <div class="d-flex justify-content-between align-items-center">
+              <small class="text-body-secondary">5 April 2023</small>
+              <small class="text-body-secondary">9 mins</small>
+            </div>
+          </div>
+        </div>
+      </a>
+      </div>
+      @endfor
+          
+    </div>
+  </div>
+</div>
+<div class="container-fluid py-4">
+  <div class="container">
+    <div class="row justify-content-center">
+      <div class="col col-lg-9">
+<h3 class="h4 fw-bold text-center mb-3">What's New</h3>
+    <div class="row g-3">
+      @for($i = 1; $i <= 12; $i++)
+      <div class="col-6">
+        <a href="#" class="text-decoration-none">
+        <div class="card">
+          <div class="row g-0">
+            <div class="col-md-4">
+              <img src="https://placekitten.com/400/300" class="img-fluid rounded-start" alt="...">
+            </div>
+            <div class="col-md-8">
+              <div class="card-body">
+                <p class="card-title fw-bold">Here is why a kitten catches mice faster than an adult cat.</p>
+                <p class="card-text"><small class="text-body-secondary">5 April 2023 <span class="mx-4"></span> 3 mins</small></p>
+              </div>
+            </div>
+          </div>
+        </div>
+        </a>
+      </div>
+      @endfor
+          
+    </div>
+    <div class="text-center py-3">
+      <a href="#" class="btn btn-primary">All News & Updates</a>
+    </div>
+      </div>
+    </div>
+  </div>
+</div>
+@endsection

resources/views/layouts/admin/app.blade.php

@@ -0,0 +1,43 @@
+<!DOCTYPE html>
+<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
+
+<head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+    <meta name="description" content="">
+    <title>{{ config('app.name', 'Laravel') }}</title>
+
+    @vite('resources/sass/admin-app.scss')
+
+    <!-- Custom styles for this Page-->
+    @yield('custom_styles')
+
+</head>
+<body class="theme-light">
+    <div class="page">
+        <div class="sticky-top">
+          @include('layouts.admin.header')
+
+         	 @include('layouts.admin.navigation')
+
+			</div>
+			<div class="page-wrapper">
+
+				@yield('content')
+
+        @include('layouts.admin.footer')
+
+
+        	</div>
+      	</div>
+    </div>
+
+    <!-- Core plugin JavaScript-->
+    @vite('resources/js/admin-app.js')
+
+    <!-- Page level custom scripts -->
+    @yield('custom_scripts')
+
+</body>
+</html>

resources/views/layouts/admin/footer.blade.php

@@ -0,0 +1,35 @@
+        <footer class="footer footer-transparent d-print-none">
+          <div class="container-xl">
+            <div class="row text-center align-items-center flex-row-reverse">
+              <div class="col-lg-auto ms-lg-auto">
+                <ul class="list-inline list-inline-dots mb-0">
+{{--                   <li class="list-inline-item"><a href="https://preview.tabler.io" target="_blank" class="link-secondary" rel="noopener">Tabler Demo</a></li>
+                  <li class="list-inline-item"><a href="https://preview.tabler.io/docs/index.html" target="_blank" class="link-secondary" rel="noopener">Tabler Doc.</a></li>
+                  <li class="list-inline-item"><a href="https://preview.tabler.io/license.html" target="_blank" class="link-secondary" rel="noopener">Tabler License</a></li>
+                  <li class="list-inline-item"><a href="https://github.com/tabler/tabler" target="_blank" class="link-secondary" rel="noopener">Tabler Source code</a></li>
+                  <li class="list-inline-item">
+                    <a href="https://github.com/sponsors/codecalm" target="_blank" class="link-secondary" rel="noopener">
+                      <!-- Download SVG icon from http://tabler-icons.io/i/heart -->
+                      <svg xmlns="http://www.w3.org/2000/svg" class="icon text-pink icon-filled icon-inline" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M19.5 13.572l-7.5 7.428l-7.5 -7.428m0 0a5 5 0 1 1 7.5 -6.566a5 5 0 1 1 7.5 6.572" /></svg>
+                      Sponsor
+                    </a>
+                  </li> --}}
+                </ul>
+              </div>
+              <div class="col-12 col-lg-auto mt-3 mt-lg-0">
+                <ul class="list-inline list-inline-dots mb-0">
+                  <li class="list-inline-item">
+                    &copy; {{ date('Y') }}
+                    <a href="{{ config('app.url') }}" class="link-secondary">{{ config('app.name') }}</a>
+                  </li>
+                  <li class="list-inline-item">
+                    Version {{ config('platform.general.app_version') }}
+                  </li>
+                  <li class="list-inline-item">
+                    Created by Charles Teh
+                  </li>
+                </ul>
+              </div>
+            </div>
+          </div>
+        </footer>

resources/views/layouts/admin/guest.blade.php

@@ -0,0 +1,29 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+    <meta name="description" content="">
+    <title>{{ config('app.name', 'Laravel') }}</title>
+
+    @vite('resources/sass/app.scss')
+</head>
+<body class="border-top-wide border-primary d-flex flex-column">
+
+    <div class="page page-center">
+        <div class="container-tight py-4">
+            <div class="text-center mb-4">
+                <a href="{{ config('app.url') }}" class="navbar-brand navbar-brand-autodark">
+                    <img src="{{ url('img/logo.svg') }}" height="36" alt="" />
+                </a>
+            </div>
+
+            @yield('content')
+
+        </div>
+    </div>
+
+    @vite('resources/js/app.js')
+</body>
+</html>

resources/views/layouts/admin/header.blade.php

@@ -0,0 +1,34 @@
+      <header class="navbar navbar-expand-md navbar-light sticky-top d-print-none">
+        <div class="container-xl">
+          <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbar-menu">
+            <span class="navbar-toggler-icon"></span>
+          </button>
+          <a href="#" class="h1 navbar-brand navbar-brand-autodark d-none-navbar-horizontal pe-0 pe-md-3">
+            {{ config('app.name') }} CMS
+          </a>
+          <div class="navbar-nav flex-row order-md-last">
+
+            @auth
+            <div class="nav-item dropdown">
+              <a href="#" class="nav-link d-flex lh-1 text-reset p-0" data-bs-toggle="dropdown" aria-label="Open user menu">
+                <span class="avatar avatar-sm" style="background-image: url(https://eu.ui-avatars.com/api/?name={{ urlencode(auth()->user()->name) }})"></span>
+                <div class="d-none d-xl-block ps-2">
+                  {{ auth()->user()->name ?? null }}
+                </div>
+              </a>
+              <div class="dropdown-menu dropdown-menu-end dropdown-menu-arrow">
+                <a href="{{ route('profile.show') }}" class="dropdown-item">{{ __('Profile') }}</a>
+                <div class="dropdown-divider"></div>
+                <form method="POST" action="{{ route('logout') }}">
+                  @csrf
+                  <a href="{{ route('logout') }}" class="dropdown-item" onclick="event.preventDefault(); this.closest('form').submit();">
+                    {{ __('Log Out') }}
+                  </a>
+                </form>
+              </div>
+            </div>
+            @endauth
+
+          </div>
+        </div>
+      </header>

resources/views/layouts/admin/navigation.blade.php

@@ -0,0 +1,116 @@
+<div class="navbar-expand-md">
+    <div class="collapse navbar-collapse" id="navbar-menu">
+        <div class="navbar navbar-light">
+            <div class="container-xl">
+                <ul class="navbar-nav">
+
+                    <li class="nav-item @if(request()->routeIs('home')) active @endif">
+                        <a class="nav-link" href="{{ route('home') }}" >
+                            <span class="nav-link-icon d-md-none d-lg-inline-block"><!-- Download SVG icon from http://tabler-icons.io/i/home -->
+                                <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-door-exit" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
+                                   <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
+                                   <path d="M13 12v.01"></path>
+                                   <path d="M3 21h18"></path>
+                                   <path d="M5 21v-16a2 2 0 0 1 2 -2h7.5m2.5 10.5v7.5"></path>
+                                   <path d="M14 7h7m-3 -3l3 3l-3 3"></path>
+                                </svg>
+                            </span>
+                            <span class="nav-link-title">
+                                {{ __('Home') }}
+                            </span>
+                        </a>
+                    </li>
+
+                    
+                    <li class="nav-item @if(request()->routeIs('dashboard')) active @endif">
+                        <a class="nav-link" href="{{ route('dashboard') }}" >
+                            <span class="nav-link-icon d-md-none d-lg-inline-block"><!-- Download SVG icon from http://tabler-icons.io/i/home -->
+                                <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><polyline points="5 12 3 12 12 3 21 12 19 12" /><path d="M5 12v7a2 2 0 0 0 2 2h10a2 2 0 0 0 2 -2v-7" /><path d="M9 21v-6a2 2 0 0 1 2 -2h2a2 2 0 0 1 2 2v6" /></svg>
+                            </span>
+                            <span class="nav-link-title">
+                                {{ __('Dashboard') }}
+                            </span>
+                        </a>
+                    </li>
+
+                    <li class="nav-item @if(request()->routeIs('users.index')) active @endif">
+                        <a class="nav-link" href="{{ route('users.index') }}" >
+                            <span class="nav-link-icon d-md-none d-lg-inline-block"><!-- Download SVG icon from http://tabler-icons.io/i/file-text -->
+                                <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-users" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
+                                    <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
+                                    <circle cx="9" cy="7" r="4"></circle>
+                                    <path d="M3 21v-2a4 4 0 0 1 4 -4h4a4 4 0 0 1 4 4v2"></path>
+                                    <path d="M16 3.13a4 4 0 0 1 0 7.75"></path>
+                                    <path d="M21 21v-2a4 4 0 0 0 -3 -3.85"></path>
+                                </svg>
+                            </span>
+                            <span class="nav-link-title">
+                                {{ __('Users') }}
+                            </span>
+                        </a>
+                    </li>
+
+                    <li class="nav-item @if(request()->routeIs('about')) active @endif">
+                        <a class="nav-link" href="{{ route('about') }}" >
+                            <span class="nav-link-icon d-md-none d-lg-inline-block"><!-- Download SVG icon from http://tabler-icons.io/i/file-text -->
+                                    <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-info-circle" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
+                                        <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
+                                        <circle cx="12" cy="12" r="9"></circle>
+                                        <line x1="12" y1="8" x2="12.01" y2="8"></line>
+                                        <polyline points="11 12 12 12 12 16 13 16"></polyline>
+                                    </svg>
+                            </span>
+                            <span class="nav-link-title">
+                                {{ __('About') }}
+                            </span>
+                        </a>
+                    </li>
+
+                    <li class="nav-item dropdown">
+                        <a class="nav-link dropdown-toggle" href="#navbar-extra" data-bs-toggle="dropdown" data-bs-auto-close="outside" role="button" aria-expanded="false" >
+                            <span class="nav-link-icon d-md-none d-lg-inline-block"><!-- Download SVG icon from http://tabler-icons.io/i/star -->
+                                <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-list-details" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
+                                    <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
+                                    <path d="M13 5h8"></path>
+                                    <path d="M13 9h5"></path>
+                                    <path d="M13 15h8"></path>
+                                    <path d="M13 19h5"></path>
+                                    <rect x="3" y="4" width="6" height="6" rx="1"></rect>
+                                    <rect x="3" y="14" width="6" height="6" rx="1"></rect>
+                                </svg>
+                            </span>
+                            <span class="nav-link-title">
+                            Submenus
+                            </span>
+                        </a>
+                        <div class="dropdown-menu">
+                            <a class="dropdown-item" href="#" >
+                                Submenu Item #1
+                            </a>
+                            <div class="dropend">
+                                <a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown" data-bs-auto-close="outside" role="button" aria-expanded="false">
+                                    Submenu Item #2
+                                </a>
+                                <div class="dropdown-menu">
+                                  <a href="#" class="dropdown-item">
+                                    Subsubmenu Item #1
+                                  </a>
+                                  <a href="#" class="dropdown-item">
+                                    Subsubmenu Item #2
+                                  </a>
+                                  <a href="#" class="dropdown-item">
+                                    Subsubmenu Item #3
+                                  </a>
+                                </div>
+                              </div>
+                            <a class="dropdown-item" href="#" >
+                                Submenu Item #3
+                            </a>
+                        </div>
+                    </li>
+
+                </ul>
+            </div>
+        </div>
+    </div>
+</div>

resources/views/layouts/front/app.blade.php

@@ -0,0 +1,34 @@
+<!DOCTYPE html>
+<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
+
+<head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+    <meta name="description" content="">
+    <title>{{ config('app.name', 'Laravel') }}</title>
+
+    @vite('resources/sass/front-app.scss')
+
+    <!-- Custom styles for this Page-->
+    @yield('custom_styles')
+
+    @include('layouts.front.header')
+
+</head>
+<body>
+
+    @include('layouts.front.navigation')
+
+    @yield('content')
+
+    @include('layouts.front.footer')
+
+    <!-- Core plugin JavaScript-->
+    @vite('resources/js/front-app.js')
+
+    <!-- Page level custom scripts -->
+    @yield('custom_scripts')
+
+</body>
+</html>

resources/views/layouts/front/footer.blade.php

@@ -0,0 +1,59 @@
+<div class="container-fluid border-top">
+  <footer class="py-5 container">
+    <div class="row">
+      <div class="col-6 col-md-2 mb-3">
+        <h5>Section</h5>
+        <ul class="nav flex-column">
+          <li class="nav-item mb-2"><a href="#" class="nav-link p-0 text-body-secondary">Home</a></li>
+          <li class="nav-item mb-2"><a href="#" class="nav-link p-0 text-body-secondary">Features</a></li>
+          <li class="nav-item mb-2"><a href="#" class="nav-link p-0 text-body-secondary">Pricing</a></li>
+          <li class="nav-item mb-2"><a href="#" class="nav-link p-0 text-body-secondary">FAQs</a></li>
+          <li class="nav-item mb-2"><a href="#" class="nav-link p-0 text-body-secondary">About</a></li>
+        </ul>
+      </div>
+
+      <div class="col-6 col-md-2 mb-3">
+        <h5>Section</h5>
+        <ul class="nav flex-column">
+          <li class="nav-item mb-2"><a href="#" class="nav-link p-0 text-body-secondary">Home</a></li>
+          <li class="nav-item mb-2"><a href="#" class="nav-link p-0 text-body-secondary">Features</a></li>
+          <li class="nav-item mb-2"><a href="#" class="nav-link p-0 text-body-secondary">Pricing</a></li>
+          <li class="nav-item mb-2"><a href="#" class="nav-link p-0 text-body-secondary">FAQs</a></li>
+          <li class="nav-item mb-2"><a href="#" class="nav-link p-0 text-body-secondary">About</a></li>
+        </ul>
+      </div>
+
+      <div class="col-6 col-md-2 mb-3">
+        <h5>Section</h5>
+        <ul class="nav flex-column">
+          <li class="nav-item mb-2"><a href="#" class="nav-link p-0 text-body-secondary">Home</a></li>
+          <li class="nav-item mb-2"><a href="#" class="nav-link p-0 text-body-secondary">Features</a></li>
+          <li class="nav-item mb-2"><a href="#" class="nav-link p-0 text-body-secondary">Pricing</a></li>
+          <li class="nav-item mb-2"><a href="#" class="nav-link p-0 text-body-secondary">FAQs</a></li>
+          <li class="nav-item mb-2"><a href="#" class="nav-link p-0 text-body-secondary">About</a></li>
+        </ul>
+      </div>
+
+      <div class="col-md-5 offset-md-1 mb-3">
+        <form>
+          <h5>Subscribe to our newsletter</h5>
+          <p>Monthly digest of what's new and exciting from us.</p>
+          <div class="d-flex flex-column flex-sm-row w-100 gap-2">
+            <label for="newsletter1" class="visually-hidden">Email address</label>
+            <input id="newsletter1" type="text" class="form-control" placeholder="Email address">
+            <button class="btn btn-primary" type="button">Subscribe</button>
+          </div>
+        </form>
+      </div>
+    </div>
+
+    <div class="d-flex flex-column flex-sm-row justify-content-between py-4 my-4">
+      <p>© {{ date('Y') }} {{ config('app.name') }}. All rights reserved.</p>
+      <ul class="list-unstyled d-flex">
+        <li class="ms-3"><a class="link-body-emphasis" href="#"><svg class="bi" width="24" height="24"><use xlink:href="#twitter"></use></svg></a></li>
+        <li class="ms-3"><a class="link-body-emphasis" href="#"><svg class="bi" width="24" height="24"><use xlink:href="#instagram"></use></svg></a></li>
+        <li class="ms-3"><a class="link-body-emphasis" href="#"><svg class="bi" width="24" height="24"><use xlink:href="#facebook"></use></svg></a></li>
+      </ul>
+    </div>
+  </footer>
+</div>

resources/views/layouts/front/navigation.blade.php

@@ -0,0 +1,52 @@
+<div class="container-fluid border-bottom">
+  <header class="d-flex flex-wrap align-items-center justify-content-center justify-content-md-between py-3">
+    <div class="col-md-3 mb-2 mb-md-0">
+      <button class="navbar-toggler" type="button" data-bs-toggle="offcanvas" data-bs-target="#offcanvasNavbar" aria-controls="offcanvasNavbar" aria-label="Toggle navigation">
+      <i class="h4 bi bi-list"></i>
+    </button>
+    <div class="offcanvas offcanvas-start" tabindex="-1" id="offcanvasNavbar" aria-labelledby="offcanvasNavbarLabel">
+      <div class="offcanvas-header">
+        <h4 class="offcanvas-title fw-bold mb-0" id="offcanvasNavbarLabel">{{ config('app.name') }}</h4>
+        <button type="button" class="btn-close" data-bs-dismiss="offcanvas" aria-label="Close"></button>
+      </div>
+      <div class="offcanvas-body">
+        <ul class="navbar-nav justify-content-end flex-grow-1 pe-3">
+          <li class="nav-item">
+            <a class="nav-link active" aria-current="page" href="#">Home</a>
+          </li>
+          @foreach ($categories as $category)
+            <li class="nav-item">
+              <a class="nav-link active" aria-current="page" href="#">{{ $category->name }}</a>
+            </li>
+          @endforeach
+          
+        </ul>
+      </div>
+    </div>
+      <a href="/" class="d-inline-flex link-body-emphasis text-decoration-none">
+        <h1 class="h4 mb-0 fw-bold">{{ config('app.name') }}</h1>
+      </a>
+    </div>
+
+    <ul class="nav col-12 col-md-auto mb-2 justify-content-center mb-md-0">
+      @foreach ($categories as $category)
+        @if ($category->is_top)
+          <li><a href="#" class="nav-link px-2 link-secondary">{{ $category->short_name }}</a></li>
+        @endif
+      @endforeach
+    </ul>
+
+    <div class="col-md-3 text-end">
+<div class="dropdown">
+  <button class="btn btn-outline-secondary dropdown-toggle" type="button" id="dropdownMenuSwitch" data-bs-toggle="dropdown" aria-expanded="false">
+    {{ $country->name }}
+  </button>
+  <ul class="dropdown-menu" aria-labelledby="dropdownMenuSwitch">
+    <li><a class="dropdown-item" href="#">Country 1</a></li>
+    <li><a class="dropdown-item" href="#">Country 2</a></li>
+    <li><a class="dropdown-item" href="#">Country 3</a></li>
+  </ul>
+</div>
+    </div>
+  </header>
+</div>