This commit is contained in:
Dr Masroor Ehsan 2025-01-02 20:05:11 +06:00
parent ca13f405e9
commit 8ad61a9e75
9 changed files with 809 additions and 490 deletions

View File

@ -2,6 +2,7 @@
namespace App\Providers;
use Illuminate\Support\Facades\Vite;
use Illuminate\Support\ServiceProvider;
class AppServiceProvider extends ServiceProvider
@ -19,6 +20,15 @@ public function register(): void
*/
public function boot(): void
{
//
Vite::useStyleTagAttributes(function (?string $src, string $url, ?array $chunk, ?array $manifest) {
if ($src !== null) {
return [
'class' => preg_match("/(resources\/assets\/vendor\/scss\/(rtl\/)?core)-?.*/i", $src) ? 'template-customizer-core-css' :
(preg_match("/(resources\/assets\/vendor\/scss\/(rtl\/)?theme)-?.*/i", $src) ? 'template-customizer-theme-css' : ''),
];
}
return [];
});
}
}

View File

@ -0,0 +1,227 @@
<?php
namespace App\Services;
use Illuminate\Support\Facades\Config;
use Illuminate\Support\Str;
class ThemeHelper
{
public static function appClasses(): array
{
$data = config('custom.custom');
// default data array
$DefaultData = [
'myLayout' => 'vertical',
'myTheme' => 'theme-default',
'myStyle' => 'light',
'myRTLSupport' => true,
'myRTLMode' => true,
'hasCustomizer' => true,
'showDropdownOnHover' => true,
'displayCustomizer' => true,
'contentLayout' => 'compact',
'headerType' => 'fixed',
'navbarType' => 'fixed',
'menuFixed' => true,
'menuCollapsed' => false,
'footerFixed' => false,
'menuFlipped' => false,
// 'menuOffcanvas' => false,
'customizerControls' => [
'rtl',
'style',
'headerType',
'contentLayout',
'layoutCollapsed',
'showDropdownOnHover',
'layoutNavbarOptions',
'themes',
],
// 'defaultLanguage'=>'en',
];
// if any key missing of array from custom.php file it will be merge and set a default value from dataDefault array and store in data variable
$data = array_merge($DefaultData, $data);
// All options available in the template
$allOptions = [
'myLayout' => ['vertical', 'horizontal', 'blank', 'front'],
'menuCollapsed' => [true, false],
'hasCustomizer' => [true, false],
'showDropdownOnHover' => [true, false],
'displayCustomizer' => [true, false],
'contentLayout' => ['compact', 'wide'],
'headerType' => ['fixed', 'static'],
'navbarType' => ['fixed', 'static', 'hidden'],
'myStyle' => ['light', 'dark', 'system'],
'myTheme' => ['theme-default', 'theme-bordered', 'theme-semi-dark'],
'myRTLSupport' => [true, false],
'myRTLMode' => [true, false],
'menuFixed' => [true, false],
'footerFixed' => [true, false],
'menuFlipped' => [true, false],
// 'menuOffcanvas' => [true, false],
'customizerControls' => [],
// 'defaultLanguage'=>array('en'=>'en','fr'=>'fr','de'=>'de','ar'=>'ar'),
];
// if myLayout value empty or not match with default options in custom.php config file then set a default value
foreach ($allOptions as $key => $value) {
if (array_key_exists($key, $DefaultData)) {
if (gettype($DefaultData[$key]) === gettype($data[$key])) {
// data key should be string
if (is_string($data[$key])) {
// data key should not be empty
if (isset($data[$key]) && $data[$key] !== null) {
// data key should not be exist inside allOptions array's sub array
if (! array_key_exists($data[$key], $value)) {
// ensure that passed value should be match with any of allOptions array value
$result = array_search($data[$key], $value, 'strict');
if (empty($result) && $result !== 0) {
$data[$key] = $DefaultData[$key];
}
}
} else {
// if data key not set or
$data[$key] = $DefaultData[$key];
}
}
} else {
$data[$key] = $DefaultData[$key];
}
}
}
$styleVal = $data['myStyle'] == 'dark' ? 'dark' : 'light';
$styleUpdatedVal = $data['myStyle'] == 'dark' ? 'dark' : $data['myStyle'];
// Determine if the layout is admin or front based on cookies
$layoutName = $data['myLayout'];
$isAdmin = Str::contains($layoutName, 'front') ? false : true;
$modeCookieName = $isAdmin ? 'admin-mode' : 'front-mode';
$colorPrefCookieName = $isAdmin ? 'admin-colorPref' : 'front-colorPref';
// Determine style based on cookies, only if not 'blank-layout'
if ($layoutName !== 'blank') {
if (isset($_COOKIE[$modeCookieName])) {
$styleVal = $_COOKIE[$modeCookieName];
if ($styleVal === 'system') {
$styleVal = isset($_COOKIE[$colorPrefCookieName]) ? $_COOKIE[$colorPrefCookieName] : 'light';
}
$styleUpdatedVal = $_COOKIE[$modeCookieName];
}
}
isset($_COOKIE['theme']) ? $themeVal = $_COOKIE['theme'] : $themeVal = $data['myTheme'];
$directionVal = isset($_COOKIE['direction']) ? ($_COOKIE['direction'] === 'true' ? 'rtl' : 'ltr') : $data['myRTLMode'];
// layout classes
$layoutClasses = [
'layout' => $data['myLayout'],
'theme' => $themeVal,
'themeOpt' => $data['myTheme'],
'style' => $styleVal,
'styleOpt' => $data['myStyle'],
'styleOptVal' => $styleUpdatedVal,
'rtlSupport' => $data['myRTLSupport'],
'rtlMode' => $data['myRTLMode'],
'textDirection' => $directionVal, // $data['myRTLMode'],
'menuCollapsed' => $data['menuCollapsed'],
'hasCustomizer' => $data['hasCustomizer'],
'showDropdownOnHover' => $data['showDropdownOnHover'],
'displayCustomizer' => $data['displayCustomizer'],
'contentLayout' => $data['contentLayout'],
'headerType' => $data['headerType'],
'navbarType' => $data['navbarType'],
'menuFixed' => $data['menuFixed'],
'footerFixed' => $data['footerFixed'],
'menuFlipped' => $data['menuFlipped'],
'customizerControls' => $data['customizerControls'],
];
// sidebar Collapsed
if ($layoutClasses['menuCollapsed'] == true) {
$layoutClasses['menuCollapsed'] = 'layout-menu-collapsed';
}
// Header Type
if ($layoutClasses['headerType'] == 'fixed') {
$layoutClasses['headerType'] = 'layout-menu-fixed';
}
// Navbar Type
if ($layoutClasses['navbarType'] == 'fixed') {
$layoutClasses['navbarType'] = 'layout-navbar-fixed';
} elseif ($layoutClasses['navbarType'] == 'static') {
$layoutClasses['navbarType'] = '';
} else {
$layoutClasses['navbarType'] = 'layout-navbar-hidden';
}
// Menu Fixed
if ($layoutClasses['menuFixed'] == true) {
$layoutClasses['menuFixed'] = 'layout-menu-fixed';
}
// Footer Fixed
if ($layoutClasses['footerFixed'] == true) {
$layoutClasses['footerFixed'] = 'layout-footer-fixed';
}
// Menu Flipped
if ($layoutClasses['menuFlipped'] == true) {
$layoutClasses['menuFlipped'] = 'layout-menu-flipped';
}
// Menu Offcanvas
// if ($layoutClasses['menuOffcanvas'] == true) {
// $layoutClasses['menuOffcanvas'] = 'layout-menu-offcanvas';
// }
// RTL Supported template
if ($layoutClasses['rtlSupport'] == true) {
$layoutClasses['rtlSupport'] = '/rtl';
}
// RTL Layout/Mode
if ($layoutClasses['rtlMode'] == true) {
$layoutClasses['rtlMode'] = 'rtl';
$layoutClasses['textDirection'] = isset($_COOKIE['direction']) ? ($_COOKIE['direction'] === 'true' ? 'rtl' : 'ltr') : 'rtl';
} else {
$layoutClasses['rtlMode'] = 'ltr';
$layoutClasses['textDirection'] = isset($_COOKIE['direction']) && $_COOKIE['direction'] === 'true' ? 'rtl' : 'ltr';
}
// Show DropdownOnHover for Horizontal Menu
if ($layoutClasses['showDropdownOnHover'] == true) {
$layoutClasses['showDropdownOnHover'] = true;
} else {
$layoutClasses['showDropdownOnHover'] = false;
}
// To hide/show display customizer UI, not js
if ($layoutClasses['displayCustomizer'] == true) {
$layoutClasses['displayCustomizer'] = true;
} else {
$layoutClasses['displayCustomizer'] = false;
}
return $layoutClasses;
}
public static function updatePageConfig($pageConfigs): void
{
$demo = 'custom';
if (isset($pageConfigs)) {
if (count($pageConfigs) > 0) {
foreach ($pageConfigs as $config => $val) {
Config::set('custom.'.$demo.'.'.$config, $val);
}
}
}
}
}

View File

@ -1,7 +1,7 @@
@php
use App\Helpers\Helper;
use App\Services\ThemeHelper;
use Illuminate\Support\Facades\Route;
$configData = Helper::appClasses();
$configData = ThemeHelper::appClasses();
$customizerHidden = 'customizer-hide';
@endphp
@ -10,12 +10,12 @@
@section('title', 'Confirm Password')
@section('page-style')
{{-- Page Css files --}}
@vite('resources/assets/vendor/scss/pages/page-auth.scss')
{{-- Page Css files --}}
@vite('resources/assets/vendor/scss/pages/page-auth.scss')
@endsection
@section('content')
<div class="authentication-wrapper authentication-cover">
<div class="authentication-wrapper authentication-cover">
<!-- Logo -->
<a href="{{url('/')}}" class="auth-cover-brand d-flex align-items-center gap-2">
<span class="app-brand-logo demo">@include('_partials.macros',["width"=>25,"withbg"=>'var(--bs-primary)'])</span>
@ -26,8 +26,14 @@
<!-- /Left Section -->
<div class="d-none d-lg-flex col-lg-7 col-xl-8 align-items-center justify-content-center p-12 pb-2">
<img src="{{asset('assets/img/illustrations/auth-forgot-password-illustration-'.$configData['style'].'.png') }}" class="auth-cover-illustration w-100" alt="auth-illustration" data-app-light-img="illustrations/auth-forgot-password-illustration-light.png" data-app-dark-img="illustrations/auth-forgot-password-illustration-dark.png" />
<img src="{{asset('assets/img/illustrations/auth-cover-forgot-password-mask-'.$configData['style'].'.png') }}" class="authentication-image" alt="mask" data-app-light-img="illustrations/auth-cover-forgot-password-mask-light.png" data-app-dark-img="illustrations/auth-cover-forgot-password-mask-dark.png" />
<img src="{{asset('assets/img/illustrations/auth-forgot-password-illustration-'.$configData['style'].'.png') }}"
class="auth-cover-illustration w-100" alt="auth-illustration"
data-app-light-img="illustrations/auth-forgot-password-illustration-light.png"
data-app-dark-img="illustrations/auth-forgot-password-illustration-dark.png"/>
<img src="{{asset('assets/img/illustrations/auth-cover-forgot-password-mask-'.$configData['style'].'.png') }}"
class="authentication-image" alt="mask"
data-app-light-img="illustrations/auth-cover-forgot-password-mask-light.png"
data-app-dark-img="illustrations/auth-cover-forgot-password-mask-dark.png"/>
</div>
<!-- /Left Section -->
@ -43,9 +49,10 @@
<div class="input-group input-group-merge @error('password') is-invalid @enderror">
<div class="form-floating form-floating-outline">
<input type="password" id="password"
class="form-control @error('password') is-invalid @enderror" name="password"
class="form-control @error('password') is-invalid @enderror"
name="password"
placeholder="&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;"
aria-describedby="password" />
aria-describedby="password"/>
<label for="password">Password</label>
</div>
<span class="input-group-text cursor-pointer"><i class="ri-eye-off-line"></i></span>
@ -63,5 +70,5 @@ class="form-control @error('password') is-invalid @enderror" name="password"
</div>
<!-- /Confirm Password -->
</div>
</div>
</div>
@endsection

View File

@ -1,7 +1,7 @@
@php
use App\Helpers\Helper;
use App\Services\ThemeHelper;
use Illuminate\Support\Facades\Route;
$configData = Helper::appClasses();
$configData = ThemeHelper::appClasses();
$customizerHidden = 'customizer-hide';
@endphp
@ -10,12 +10,12 @@
@section('title', 'Forgot Password')
@section('page-style')
{{-- Page Css files --}}
@vite('resources/assets/vendor/scss/pages/page-auth.scss')
{{-- Page Css files --}}
@vite('resources/assets/vendor/scss/pages/page-auth.scss')
@endsection
@section('content')
<div class="authentication-wrapper authentication-cover">
<div class="authentication-wrapper authentication-cover">
<!-- Logo -->
<a href="{{url('/')}}" class="auth-cover-brand d-flex align-items-center gap-2">
<span class="app-brand-logo demo">@include('_partials.macros',["width"=>25,"withbg"=>'var(--bs-primary)'])</span>
@ -26,8 +26,14 @@
<!-- /Left Section -->
<div class="d-none d-lg-flex col-lg-7 col-xl-8 align-items-center justify-content-center p-12 pb-2">
<img src="{{asset('assets/img/illustrations/auth-forgot-password-illustration-'.$configData['style'].'.png') }}" class="auth-cover-illustration w-100" alt="auth-illustration" data-app-light-img="illustrations/auth-forgot-password-illustration-light.png" data-app-dark-img="illustrations/auth-forgot-password-illustration-dark.png" />
<img src="{{asset('assets/img/illustrations/auth-cover-forgot-password-mask-'.$configData['style'].'.png') }}" class="authentication-image" alt="mask" data-app-light-img="illustrations/auth-cover-forgot-password-mask-light.png" data-app-dark-img="illustrations/auth-cover-forgot-password-mask-dark.png" />
<img src="{{asset('assets/img/illustrations/auth-forgot-password-illustration-'.$configData['style'].'.png') }}"
class="auth-cover-illustration w-100" alt="auth-illustration"
data-app-light-img="illustrations/auth-forgot-password-illustration-light.png"
data-app-dark-img="illustrations/auth-forgot-password-illustration-dark.png"/>
<img src="{{asset('assets/img/illustrations/auth-cover-forgot-password-mask-'.$configData['style'].'.png') }}"
class="authentication-image" alt="mask"
data-app-light-img="illustrations/auth-cover-forgot-password-mask-light.png"
data-app-dark-img="illustrations/auth-cover-forgot-password-mask-dark.png"/>
</div>
<!-- /Left Section -->
@ -45,7 +51,8 @@
<form id="formAuthentication" class="mb-5" action="{{ route('password.email') }}" method="POST">
@csrf
<div class="form-floating form-floating-outline mb-5">
<input type="text" class="form-control @error('email') is-invalid @enderror" id="email" name="email" placeholder="john@example.com" autofocus>
<input type="text" class="form-control @error('email') is-invalid @enderror" id="email"
name="email" placeholder="john@example.com" autofocus>
<label for="email">Email</label>
@error('email')
<span class="invalid-feedback" role="alert">
@ -67,5 +74,5 @@
</div>
<!-- /Forgot Password -->
</div>
</div>
</div>
@endsection

View File

@ -1,7 +1,7 @@
@php
use App\Helpers\Helper;
use App\Services\ThemeHelper;
use Illuminate\Support\Facades\Route;
$configData = Helper::appClasses();
$configData = ThemeHelper::appClasses();
$customizerHidden = 'customizer-hide';
@endphp
@ -10,28 +10,36 @@
@section('title', 'Login')
@section('page-style')
{{-- Page Css files --}}
@vite('resources/assets/vendor/scss/pages/page-auth.scss')
{{-- Page Css files --}}
@vite('resources/assets/vendor/scss/pages/page-auth.scss')
@endsection
@section('content')
<div class="authentication-wrapper authentication-cover">
<div class="authentication-wrapper authentication-cover">
<!-- Logo -->
<a href="{{url('/')}}" class="auth-cover-brand d-flex align-items-center gap-2">
<span class="app-brand-logo demo">@include('_partials.macros',["width"=>25,"withbg"=>'var(--bs-primary)'])</span>
<span
class="app-brand-logo demo">@include('_partials.macros',["width"=>25,"withbg"=>'var(--bs-primary)'])</span>
<span class="app-brand-text demo text-heading fw-semibold">{{config('variables.templateName')}}</span>
</a>
<!-- /Logo -->
<div class="authentication-inner row m-0">
<!-- /Left Section -->
<div class="d-none d-lg-flex col-lg-7 col-xl-8 align-items-center justify-content-center p-12 pb-2">
<img src="{{asset('assets/img/illustrations/auth-login-illustration-'.$configData['style'].'.png') }}" class="auth-cover-illustration w-100" alt="auth-illustration" data-app-light-img="illustrations/auth-login-illustration-light.png" data-app-dark-img="illustrations/auth-login-illustration-dark.png" />
<img src="{{asset('assets/img/illustrations/auth-cover-login-mask-'.$configData['style'].'.png') }}" class="authentication-image" alt="mask" data-app-light-img="illustrations/auth-cover-login-mask-light.png" data-app-dark-img="illustrations/auth-cover-login-mask-dark.png" />
<img src="{{asset('assets/img/illustrations/auth-login-illustration-'.$configData['style'].'.png') }}"
class="auth-cover-illustration w-100" alt="auth-illustration"
data-app-light-img="illustrations/auth-login-illustration-light.png"
data-app-dark-img="illustrations/auth-login-illustration-dark.png"/>
<img src="{{asset('assets/img/illustrations/auth-cover-login-mask-'.$configData['style'].'.png') }}"
class="authentication-image" alt="mask"
data-app-light-img="illustrations/auth-cover-login-mask-light.png"
data-app-dark-img="illustrations/auth-cover-login-mask-dark.png"/>
</div>
<!-- /Left Section -->
<!-- Login -->
<div class="d-flex col-12 col-lg-5 col-xl-4 align-items-center authentication-bg position-relative py-sm-12 px-12 py-6">
<div
class="d-flex col-12 col-lg-5 col-xl-4 align-items-center authentication-bg position-relative py-sm-12 px-12 py-6">
<div class="w-px-400 mx-auto pt-5 pt-lg-0">
<h4 class="mb-1">Welcome to {{config('variables.templateName')}}! 👋</h4>
<p class="mb-5">Please sign-in to your account and start the adventure</p>
@ -46,7 +54,9 @@
<form id="formAuthentication" class="mb-5" action="{{ route('login') }}" method="POST">
@csrf
<div class="form-floating form-floating-outline mb-5">
<input type="text" class="form-control @error('email') is-invalid @enderror" id="login-email" name="email" placeholder="john@example.com" autofocus value="{{ old('email') }}">
<input type="text" class="form-control @error('email') is-invalid @enderror"
id="login-email" name="email" placeholder="john@example.com" autofocus
value="{{ old('email') }}">
<label for="login-email">Email</label>
@error('email')
<span class="invalid-feedback" role="alert">
@ -59,9 +69,10 @@
<div class="input-group input-group-merge @error('password') is-invalid @enderror">
<div class="form-floating form-floating-outline">
<input type="password" id="login-password"
class="form-control @error('password') is-invalid @enderror" name="password"
class="form-control @error('password') is-invalid @enderror"
name="password"
placeholder="&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;"
aria-describedby="password" />
aria-describedby="password"/>
<label for="login-password">Password</label>
</div>
<span class="input-group-text cursor-pointer"><i class="ri-eye-off-line"></i></span>
@ -125,5 +136,5 @@ class="form-control @error('password') is-invalid @enderror" name="password"
</div>
<!-- /Login -->
</div>
</div>
</div>
@endsection

View File

@ -1,7 +1,7 @@
@php
use App\Helpers\Helper;
use App\Services\ThemeHelper;
use Illuminate\Support\Facades\Route;
$configData = Helper::appClasses();
$configData = ThemeHelper::appClasses();
$customizerHidden = 'customizer-hide';
@endphp
@ -10,12 +10,12 @@
@section('title', 'Register Pages')
@section('page-style')
{{-- Page Css files --}}
@vite('resources/assets/vendor/scss/pages/page-auth.scss')
{{-- Page Css files --}}
@vite('resources/assets/vendor/scss/pages/page-auth.scss')
@endsection
@section('content')
<div class="authentication-wrapper authentication-cover">
<div class="authentication-wrapper authentication-cover">
<!-- Logo -->
<a href="{{url('/')}}" class="auth-cover-brand d-flex align-items-center gap-2">
<span class="app-brand-logo demo">@include('_partials.macros',["width"=>25,"withbg"=>'var(--bs-primary)'])</span>
@ -26,8 +26,14 @@
<!-- /Left Text -->
<div class="d-none d-lg-flex col-lg-7 col-xl-8 align-items-center justify-content-center p-12 pb-2">
<img src="{{asset('assets/img/illustrations/auth-register-illustration-'.$configData['style'].'.png') }}" class="auth-cover-illustration w-100" alt="auth-illustration" data-app-light-img="illustrations/auth-register-illustration-light.png" data-app-dark-img="illustrations/auth-register-illustration-dark.png" />
<img src="{{asset('assets/img/illustrations/auth-cover-register-mask-'.$configData['style'].'.png') }}" class="authentication-image" alt="mask" data-app-light-img="illustrations/auth-cover-register-mask-light.png" data-app-dark-img="illustrations/auth-cover-register-mask-dark.png" />
<img src="{{asset('assets/img/illustrations/auth-register-illustration-'.$configData['style'].'.png') }}"
class="auth-cover-illustration w-100" alt="auth-illustration"
data-app-light-img="illustrations/auth-register-illustration-light.png"
data-app-dark-img="illustrations/auth-register-illustration-dark.png"/>
<img src="{{asset('assets/img/illustrations/auth-cover-register-mask-'.$configData['style'].'.png') }}"
class="authentication-image" alt="mask"
data-app-light-img="illustrations/auth-cover-register-mask-light.png"
data-app-dark-img="illustrations/auth-cover-register-mask-dark.png"/>
</div>
<!-- /Left Text -->
@ -40,7 +46,8 @@
<form id="formAuthentication" class="mb-5" action="{{ route('register') }}" method="POST">
@csrf
<div class="form-floating form-floating-outline mb-5">
<input type="text" class="form-control @error('name') is-invalid @enderror" id="username" name="name" placeholder="johndoe" autofocus value="{{ old('name') }}">
<input type="text" class="form-control @error('name') is-invalid @enderror" id="username"
name="name" placeholder="johndoe" autofocus value="{{ old('name') }}">
<label for="username">Username</label>
@error('name')
<span class="invalid-feedback" role="alert">
@ -49,7 +56,8 @@
@enderror
</div>
<div class="form-floating form-floating-outline mb-5">
<input type="text" class="form-control @error('email') is-invalid @enderror" id="email" name="email" placeholder="john@example.com" value="{{ old('email') }}">
<input type="text" class="form-control @error('email') is-invalid @enderror" id="email"
name="email" placeholder="john@example.com" value="{{ old('email') }}">
<label for="email">Email</label>
@error('email')
<span class="invalid-feedback" role="alert">
@ -60,7 +68,10 @@
<div class="mb-5 form-password-toggle">
<div class="input-group input-group-merge @error('password') is-invalid @enderror">
<div class="form-floating form-floating-outline">
<input type="password" id="password" class="form-control @error('password') is-invalid @enderror" name="password" placeholder="&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;" aria-describedby="password" />
<input type="password" id="password"
class="form-control @error('password') is-invalid @enderror" name="password"
placeholder="&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;"
aria-describedby="password"/>
<label for="password">Password</label>
</div>
<span class="input-group-text cursor-pointer"><i class="ri-eye-off-line"></i></span>
@ -74,7 +85,10 @@
<div class="mb-5 form-password-toggle">
<div class="input-group input-group-merge">
<div class="form-floating form-floating-outline">
<input type="password" id="password-confirm" class="form-control" name="password_confirmation" placeholder="&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;" aria-describedby="password" />
<input type="password" id="password-confirm" class="form-control"
name="password_confirmation"
placeholder="&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;"
aria-describedby="password"/>
<label for="password-confirm">Confirm Password</label>
</div>
<span class="input-group-text cursor-pointer"><i class="ri-eye-off-line"></i></span>
@ -83,7 +97,8 @@
@if (Laravel\Jetstream\Jetstream::hasTermsAndPrivacyPolicyFeature())
<div class="mb-5">
<div class="form-check mt-2 @error('terms') is-invalid @enderror">
<input class="form-check-input @error('terms') is-invalid @enderror" type="checkbox" id="terms" name="terms" />
<input class="form-check-input @error('terms') is-invalid @enderror" type="checkbox"
id="terms" name="terms"/>
<label class="form-check-label" for="terms">
I agree to
<a href="{{ route('policy.show') }}" target="_blank">privacy policy</a> &
@ -134,5 +149,5 @@
</div>
<!-- /Register -->
</div>
</div>
</div>
@endsection

View File

@ -1,7 +1,7 @@
@php
use App\Helpers\Helper;
use App\Services\ThemeHelper;
use Illuminate\Support\Facades\Route;
$configData = Helper::appClasses();
$configData = ThemeHelper::appClasses();
$customizerHidden = 'customizer-hide';
@endphp
@ -10,12 +10,12 @@
@section('title', 'Reset Password')
@section('page-style')
{{-- Page Css files --}}
@vite('resources/assets/vendor/scss/pages/page-auth.scss')
{{-- Page Css files --}}
@vite('resources/assets/vendor/scss/pages/page-auth.scss')
@endsection
@section('content')
<div class="position-relative">
<div class="position-relative">
<div class="authentication-wrapper authentication-cover">
<!-- Logo -->
<a href="{{url('/')}}" class="auth-cover-brand d-flex align-items-center gap-2">
@ -27,8 +27,14 @@
<!-- /Left Section -->
<div class="d-none d-lg-flex col-lg-7 col-xl-8 align-items-center justify-content-center p-12 pb-2">
<img src="{{asset('assets/img/illustrations/auth-reset-password-illustration-'.$configData['style'].'.png') }}" class="auth-cover-illustration w-100" alt="auth-illustration" data-app-light-img="illustrations/auth-reset-password-illustration-light.png" data-app-dark-img="illustrations/auth-reset-password-illustration-dark.png" />
<img src="{{asset('assets/img/illustrations/auth-cover-reset-password-mask-'.$configData['style'].'.png') }}" class="authentication-image" alt="mask" data-app-light-img="illustrations/auth-cover-reset-password-mask-light.png" data-app-dark-img="illustrations/auth-cover-reset-password-mask-dark.png" />
<img src="{{asset('assets/img/illustrations/auth-reset-password-illustration-'.$configData['style'].'.png') }}"
class="auth-cover-illustration w-100" alt="auth-illustration"
data-app-light-img="illustrations/auth-reset-password-illustration-light.png"
data-app-dark-img="illustrations/auth-reset-password-illustration-dark.png"/>
<img src="{{asset('assets/img/illustrations/auth-cover-reset-password-mask-'.$configData['style'].'.png') }}"
class="authentication-image" alt="mask"
data-app-light-img="illustrations/auth-cover-reset-password-mask-light.png"
data-app-dark-img="illustrations/auth-cover-reset-password-mask-dark.png"/>
</div>
<!-- /Left Section -->
@ -37,12 +43,15 @@
<div class="w-px-400 mx-auto pt-5 pt-lg-0">
<h4 class="mb-1">Reset Password 🔒</h4>
<p class="mb-5">Your new password must be different from previously used passwords</p>
<form id="formAuthentication" class="mb-5" action="{{ route('password.update') }}" method="POST">
<form id="formAuthentication" class="mb-5" action="{{ route('password.update') }}"
method="POST">
@csrf
<input type="hidden" name="token" value="{{ $request->route('token') }}">
<div class="form-floating form-floating-outline mb-5">
<input type="email" class="form-control @error('email') is-invalid @enderror" id="email" name="email" placeholder="john@example.com" value="{{Request()->email}}" readonly />
<input type="email" class="form-control @error('email') is-invalid @enderror" id="email"
name="email" placeholder="john@example.com" value="{{Request()->email}}"
readonly/>
<label for="email">Email</label>
@error('email')
<span class="invalid-feedback" role="alert">
@ -53,7 +62,11 @@
<div class="mb-5 form-password-toggle">
<div class="input-group input-group-merge @error('password') is-invalid @enderror">
<div class="form-floating form-floating-outline">
<input type="password" id="password" class="form-control @error('password') is-invalid @enderror" name="password" placeholder="&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;" aria-describedby="password" autofocus />
<input type="password" id="password"
class="form-control @error('password') is-invalid @enderror"
name="password"
placeholder="&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;"
aria-describedby="password" autofocus/>
<label for="password">New Password</label>
</div>
<span class="input-group-text cursor-pointer"><i class="ri-eye-off-line"></i></span>
@ -67,7 +80,10 @@
<div class="mb-5 form-password-toggle">
<div class="input-group input-group-merge">
<div class="form-floating form-floating-outline">
<input type="password" id="confirm-password" class="form-control" name="password_confirmation" placeholder="&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;" aria-describedby="password" />
<input type="password" id="confirm-password" class="form-control"
name="password_confirmation"
placeholder="&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;"
aria-describedby="password"/>
<label for="confirm-password">Confirm Password</label>
</div>
<span class="input-group-text cursor-pointer"><i class="ri-eye-off-line"></i></span>
@ -78,7 +94,8 @@
</button>
<div class="text-center">
@if (Route::has('login'))
<a href="{{ route('login') }}" class="d-flex align-items-center justify-content-center">
<a href="{{ route('login') }}"
class="d-flex align-items-center justify-content-center">
<i class="ri-arrow-left-s-line scaleX-n1-rtl ri-20px me-1_5"></i>
Back to login
</a>
@ -90,5 +107,5 @@
<!-- /Reset Password -->
</div>
</div>
</div>
</div>
@endsection

View File

@ -1,7 +1,7 @@
@php
use App\Helpers\Helper;
use App\Services\ThemeHelper;
use Illuminate\Support\Facades\Route;
$configData = Helper::appClasses();
$configData = ThemeHelper::appClasses();
$customizerHidden = 'customizer-hide';
@endphp
@ -10,12 +10,12 @@
@section('title', 'Two Steps Verifications')
@section('page-style')
{{-- Page Css files --}}
@vite('resources/assets/vendor/scss/pages/page-auth.scss')
{{-- Page Css files --}}
@vite('resources/assets/vendor/scss/pages/page-auth.scss')
@endsection
@section('content')
<div class="authentication-wrapper authentication-cover">
<div class="authentication-wrapper authentication-cover">
<!-- Logo -->
<a href="{{url('/')}}" class="auth-cover-brand d-flex align-items-center gap-2">
<span class="app-brand-logo demo">@include('_partials.macros',["width"=>25,"withbg"=>'var(--bs-primary)'])</span>
@ -26,8 +26,14 @@
<!-- /Left Section -->
<div class="d-none d-lg-flex col-lg-7 col-xl-8 align-items-center justify-content-center p-12 pb-2">
<img src="{{asset('assets/img/illustrations/auth-two-steps-illustration-'.$configData['style'].'.png') }}" class="auth-cover-illustration w-100" alt="auth-illustration" data-app-light-img="illustrations/auth-two-steps-illustration-light.png" data-app-dark-img="illustrations/auth-two-steps-illustration-dark.png" />
<img src="{{asset('assets/img/illustrations/auth-cover-register-mask-'.$configData['style'].'.png') }}" class="authentication-image" alt="mask" data-app-light-img="illustrations/auth-cover-register-mask-light.png" data-app-dark-img="illustrations/auth-cover-register-mask-dark.png" />
<img src="{{asset('assets/img/illustrations/auth-two-steps-illustration-'.$configData['style'].'.png') }}"
class="auth-cover-illustration w-100" alt="auth-illustration"
data-app-light-img="illustrations/auth-two-steps-illustration-light.png"
data-app-dark-img="illustrations/auth-two-steps-illustration-dark.png"/>
<img src="{{asset('assets/img/illustrations/auth-cover-register-mask-'.$configData['style'].'.png') }}"
class="authentication-image" alt="mask"
data-app-light-img="illustrations/auth-cover-register-mask-light.png"
data-app-dark-img="illustrations/auth-cover-register-mask-dark.png"/>
</div>
<!-- /Left Section -->
@ -38,33 +44,40 @@
<h4 class="mb-1">Two Step Verification 💬</h4>
<div x-data="{ recovery: false }">
<div class="mb-6" x-show="! recovery">
Please confirm access to your account by entering the authentication code provided by your authenticator application.
Please confirm access to your account by entering the authentication code provided by your
authenticator application.
</div>
<div class="mb-6" x-show="recovery">
Please confirm access to your account by entering one of your emergency recovery codes.
</div>
<x-validation-errors class="mb-1" />
<x-validation-errors class="mb-1"/>
<form method="POST" action="{{ route('two-factor.login') }}">
@csrf
<div class="mb-5" x-show="! recovery">
<x-label class="form-label" value="{{ __('Code') }}" />
<x-input class="{{ $errors->has('code') ? 'is-invalid' : '' }}" type="text" inputmode="numeric" name="code" autofocus x-ref="code" autocomplete="one-time-code" />
<x-label class="form-label" value="{{ __('Code') }}"/>
<x-input class="{{ $errors->has('code') ? 'is-invalid' : '' }}" type="text"
inputmode="numeric" name="code" autofocus x-ref="code"
autocomplete="one-time-code"/>
<x-input-error for="code"></x-input-error>
</div>
<div class="mb-5" x-show="recovery">
<x-label class="form-label" value="{{ __('Recovery Code') }}" />
<x-input class="{{ $errors->has('recovery_code') ? 'is-invalid' : '' }}" type="text" name="recovery_code" x-ref="recovery_code" autocomplete="one-time-code" />
<x-label class="form-label" value="{{ __('Recovery Code') }}"/>
<x-input class="{{ $errors->has('recovery_code') ? 'is-invalid' : '' }}" type="text"
name="recovery_code" x-ref="recovery_code" autocomplete="one-time-code"/>
<x-input-error for="recovery_code"></x-input-error>
</div>
<div class="d-flex justify-content-end gap-2">
<div x-show="! recovery" x-on:click="recovery = true; $nextTick(() => { $refs.recovery_code.focus()})">
<div x-show="! recovery"
x-on:click="recovery = true; $nextTick(() => { $refs.recovery_code.focus()})">
<button type="button" class="btn btn-outline-secondary">Use a recovery code</button>
</div>
<div x-cloak x-show="recovery" x-on:click="recovery = false; $nextTick(() => { $refs.code.focus() })">
<button type="button" class="btn btn-outline-secondary">Use an authentication code</button>
<div x-cloak x-show="recovery"
x-on:click="recovery = false; $nextTick(() => { $refs.code.focus() })">
<button type="button" class="btn btn-outline-secondary">Use an authentication code
</button>
</div>
<x-button class="px-3">Log in</x-button>
</div>
@ -74,5 +87,5 @@
</div>
<!-- /Two Steps Verification -->
</div>
</div>
</div>
@endsection

View File

@ -1,8 +1,8 @@
@php
use App\Helpers\Helper;
use App\Services\ThemeHelper;
use Illuminate\Support\Facades\Route;
use Illuminate\Support\Facades\Auth;
$configData = Helper::appClasses();
$configData = ThemeHelper::appClasses();
$customizerHidden = 'customizer-hide';
@endphp
@ -11,15 +11,16 @@
@section('title', 'Verify Email')
@section('page-style')
{{-- Page Css files --}}
@vite('resources/assets/vendor/scss/pages/page-auth.scss')
{{-- Page Css files --}}
@vite('resources/assets/vendor/scss/pages/page-auth.scss')
@endsection
@section('content')
<div class="authentication-wrapper authentication-cover">
<div class="authentication-wrapper authentication-cover">
<!-- Logo -->
<a href="{{url('/')}}" class="auth-cover-brand d-flex align-items-center gap-2">
<span class="app-brand-logo demo">@include('_partials.macros',["width"=>25,"withbg"=>'var(--bs-primary)'])</span>
<span
class="app-brand-logo demo">@include('_partials.macros',["width"=>25,"withbg"=>'var(--bs-primary)'])</span>
<span class="app-brand-text demo text-heading fw-semibold">{{config('variables.templateName')}}</span>
</a>
<!-- /Logo -->
@ -27,30 +28,41 @@
<!-- /Left Section -->
<div class="d-none d-lg-flex col-lg-7 col-xl-8 align-items-center justify-content-center p-12 pb-2">
<img src="{{asset('assets/img/illustrations/auth-verify-email-illustration-'.$configData['style'].'.png') }}" class="auth-cover-illustration w-100" alt="auth-illustration" data-app-light-img="illustrations/auth-verify-email-illustration-light.png" data-app-dark-img="illustrations/auth-verify-email-illustration-dark.png" />
<img src="{{asset('assets/img/illustrations/auth-cover-login-mask-'.$configData['style'].'.png') }}" class="authentication-image" alt="mask" data-app-light-img="illustrations/auth-cover-login-mask-light.png" data-app-dark-img="illustrations/auth-cover-login-mask-dark.png" />
<img
src="{{asset('assets/img/illustrations/auth-verify-email-illustration-'.$configData['style'].'.png') }}"
class="auth-cover-illustration w-100" alt="auth-illustration"
data-app-light-img="illustrations/auth-verify-email-illustration-light.png"
data-app-dark-img="illustrations/auth-verify-email-illustration-dark.png"/>
<img src="{{asset('assets/img/illustrations/auth-cover-login-mask-'.$configData['style'].'.png') }}"
class="authentication-image" alt="mask"
data-app-light-img="illustrations/auth-cover-login-mask-light.png"
data-app-dark-img="illustrations/auth-cover-login-mask-dark.png"/>
</div>
<!-- /Left Section -->
<!-- Verify email -->
<div class="d-flex col-12 col-lg-5 col-xl-4 align-items-center authentication-bg position-relative py-sm-12 px-12 py-6">
<div
class="d-flex col-12 col-lg-5 col-xl-4 align-items-center authentication-bg position-relative py-sm-12 px-12 py-6">
<div class="w-px-400 mx-auto pt-5 pt-lg-0">
<h4 class="mb-1">Verify your email ✉️</h4>
@if (session('status') == 'verification-link-sent')
<div class="alert alert-success" role="alert">
<div class="alert-body">
A new verification link has been sent to the email address you provided during registration.
A new verification link has been sent to the email address you provided during
registration.
</div>
</div>
@endif
<p class="text-start mb-0">
Account activation link sent to your email address: <span class="h6">{{Auth::user()->email}}</span> Please follow the link inside to continue.
Account activation link sent to your email address: <span
class="h6">{{Auth::user()->email}}</span> Please follow the link inside to continue.
</p>
<div class="mt-5 d-flex flex-column gap-2">
<form method="POST" action="{{ route('verification.send') }}">
@csrf
<button type="submit" class="w-100 btn btn-label-secondary">click here to request another</button>
<button type="submit" class="w-100 btn btn-label-secondary">click here to request another
</button>
</form>
<form method="POST" action="{{route('logout')}}">
@ -62,5 +74,5 @@
</div>
<!-- / Verify email -->
</div>
</div>
</div>
@endsection