why the css style did not working ? ( Laravel ) - php

Question

I want to ask something because I don't quite understand the file.
I want to create a Login/Register for a User and I found a tutorial to create the login and register I want.
Here tutorial website link : https://medium.com/geekculture/customize-the-login-and-register-page-for-user-admin-in-laravel-v8-9e42127d0185
and also github complete file : https://github.com/sgwebfreelancer/laravel_auth_tutorial
In the tutorial has provided a complete file with login/register for User and also Admin Panel.
But there are some problems where the css file does not seem to work and the login and register design becomes empty. It should have like a picture. Below me as well as how login and register should be:
in this tutorial it should be like this :
So how to solved this problem ? it is have any problem with css or app.blade.php file ?
login.blade.php
#extends('layouts.app')
#section('content')
<div class="container-scroller">
<div class="container-fluid page-body-wrapper full-page-wrapper">
<div class="content-wrapper d-flex align-items-center auth auth-bg-1 theme-one">
<div class="row w-100">
<div class="col-lg-4 mx-auto">
<div class="auto-form-wrapper">
<form method="POST" action="{{ route('login') }}">
#csrf
<div class="form-group">
<label class="label">Email</label>
<div class="input-group">
<input id="email" type="email"
class="form-control #error('email') is-invalid #enderror" name="email"
value="{{ old('email') }}" required autocomplete="email" autofocus>
<div class="input-group-append">
<span class="input-group-text">
<i class="mdi mdi-check-circle-outline"></i>
</span>
</div>
#error('email')
<span class="invalid-feedback" role="alert">
<strong>{{ $message }}</strong>
</span>
#enderror
</div>
</div>
<div class="form-group">
<label class="label">Password</label>
<div class="input-group">
<input id="password" type="password"
class="form-control #error('password') is-invalid #enderror" name="password"
required autocomplete="current-password">
<div class="input-group-append">
<span class="input-group-text">
<i class="mdi mdi-check-circle-outline"></i>
</span>
</div>
#error('password')
<span class="invalid-feedback" role="alert">
<strong>{{ $message }}</strong>
</span>
#enderror
</div>
</div>
<div class="form-group">
<button type="submit" class="btn btn-primary submit-btn btn-block">
{{ __('Login') }}
</button>
</div>
<div class="form-group d-flex justify-content-between">
<div class="form-check form-check-flat mt-0">
<label class="form-check-label">
<input class="form-check-input" type="checkbox" name="remember" id="remember"
{{ old('remember') ? 'checked' : '' }}> Keep me signed in
</label>
</div>
#if (Route::has('password.request'))
<a class="text-small forgot-password text-black"
href="{{ route('password.request') }}">
{{ __('Forgot Your Password?') }}
</a>
#endif
</div>
<div class="text-block text-center my-3">
<span class="text-small font-weight-semibold">Not a member ?</span>
Create new account
</div>
</form>
</div>
</div>
</div>
</div>
<!-- content-wrapper ends -->
</div>
<!-- page-body-wrapper ends -->
</div>
<!-- container-scroller -->
#endsection
register.blade.php
#extends('layouts.app')
#section('content')
<div class="container-scroller">
<div class="container-fluid page-body-wrapper full-page-wrapper">
<div class="content-wrapper d-flex align-items-center auth register-bg-1 theme-one">
<div class="row w-100">
<div class="col-lg-4 mx-auto">
<h2 class="text-center mb-4">{{ __('Register') }}</h2>
<div class="auto-form-wrapper">
<form method="POST" action="{{ route('register') }}">
#csrf
<div class="form-group">
<div class="input-group">
<input id="name" type="text"
class="form-control #error('name') is-invalid #enderror" name="name"
value="{{ old('name') }}" required autocomplete="name" autofocus
placeholder="Name">
<div class="input-group-append">
<span class="input-group-text">
<i class="mdi mdi-check-circle-outline"></i>
</span>
</div>
#error('name')
<span class="invalid-feedback" role="alert">
<strong>{{ $message }}</strong>
</span>
#enderror
</div>
</div>
<div class="form-group">
<div class="input-group">
<input id="email" type="email"
class="form-control #error('email') is-invalid #enderror" name="email"
value="{{ old('email') }}" required autocomplete="email" placeholder="Email">
<div class="input-group-append">
<span class="input-group-text">
<i class="mdi mdi-check-circle-outline"></i>
</span>
</div>
#error('email')
<span class="invalid-feedback" role="alert">
<strong>{{ $message }}</strong>
</span>
#enderror
</div>
</div>
<div class="form-group">
<div class="input-group">
<input id="password" type="password"
class="form-control #error('password') is-invalid #enderror" name="password"
required autocomplete="new-password" placeholder="**********">
<div class="input-group-append">
<span class="input-group-text">
<i class="mdi mdi-check-circle-outline"></i>
</span>
</div>
#error('password')
<span class="invalid-feedback" role="alert">
<strong>{{ $message }}</strong>
</span>
#enderror
</div>
</div>
<div class="form-group">
<div class="input-group">
<input id="password-confirm" type="password" class="form-control"
name="password_confirmation" required autocomplete="new-password"
placeholder="**********">
<div class="input-group-append">
<span class="input-group-text">
<i class="mdi mdi-check-circle-outline"></i>
</span>
</div>
</div>
</div>
<div class="form-group d-flex justify-content-center">
<div class="form-check form-check-flat mt-0">
<label class="form-check-label">
<input type="checkbox" class="form-check-input" checked> I agree to the terms
</label>
</div>
</div>
<div class="form-group">
<button type="submit" class="btn btn-primary submit-btn btn-block">
{{ __('Register') }}
</button>
</div>
<div class="text-block text-center my-3">
<span class="text-small font-weight-semibold">Already have and account ?</span>
{{ __('Login') }}
</div>
</form>
</div>
</div>
</div>
</div>
<!-- content-wrapper ends -->
</div>
<!-- page-body-wrapper ends -->
</div>
<!-- container-scroller -->
#endsection
css file asset/css/demo_1/style.css you guys see from here
https://github.com/sgwebfreelancer/laravel_auth_tutorial/blob/main/public/assets/css/demo_1/style.css
layouts/app.blade.php file you guys can see from here
https://github.com/sgwebfreelancer/laravel_auth_tutorial/blob/main/resources/views/layouts/app.blade.php
in my console, i saw my css not load it.

Answer 1

In layouts.app, line 15, you have to change :
href="{{ asset('public/assets/css/shared/style.css')
to
href="{{ asset('/assets/css/shared/style.css')