Home > Back-end >  why the css style did not working ? ( Laravel )
why the css style did not working ? ( Laravel )

Time:01-05

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 : login page

Register page

in this tutorial it should be like this :

real design login page real design register page

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 >
    <div >
        <div >
            <div >
                <div >
                    <div >
                        <form method="POST" action="{{ route('login') }}">
                            @csrf
                            <div >
                                <label >Email</label>
                                <div >
                                    <input id="email" type="email"
                                         name="email"
                                        value="{{ old('email') }}" required autocomplete="email" autofocus>
                                    <div >
                                        <span >
                                            <i ></i>
                                        </span>
                                    </div>
                                    @error('email')
                                        <span  role="alert">
                                            <strong>{{ $message }}</strong>
                                        </span>
                                    @enderror
                                </div>
                            </div>
                            <div >
                                <label >Password</label>
                                <div >
                                    <input id="password" type="password"
                                         name="password"
                                        required autocomplete="current-password">
                                    <div >
                                        <span >
                                            <i ></i>
                                        </span>
                                    </div>
                                    @error('password')
                                        <span  role="alert">
                                            <strong>{{ $message }}</strong>
                                        </span>
                                    @enderror
                                </div>
                            </div>
                            <div >
                                <button type="submit" >
                                    {{ __('Login') }}
                                </button>

                            </div>
                            <div >
                                <div >
                                    <label >
                                        <input  type="checkbox" name="remember" id="remember"
                                            {{ old('remember') ? 'checked' : '' }}> Keep me signed in
                                    </label>
                                </div>
                                @if (Route::has('password.request'))
                                    <a 
                                        href="{{ route('password.request') }}">
                                        {{ __('Forgot Your Password?') }}
                                    </a>
                                @endif
                            </div>
                            <div >
                                <span >Not a member ?</span>
                                <a href="register.html" >Create new account</a>
                            </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 >
    <div >
        <div >
            <div >
                <div >
                    <h2 >{{ __('Register') }}</h2>
                    <div >
                        <form method="POST" action="{{ route('register') }}">
                            @csrf
                            <div >
                                <div >
                                    <input id="name" type="text"
                                         name="name"
                                        value="{{ old('name') }}" required autocomplete="name" autofocus
                                        placeholder="Name">
                                    <div >
                                        <span >
                                            <i ></i>
                                        </span>
                                    </div>
                                    @error('name')
                                        <span  role="alert">
                                            <strong>{{ $message }}</strong>
                                        </span>
                                    @enderror
                                </div>

                            </div>
                            <div >
                                <div >
                                    <input id="email" type="email"
                                         name="email"
                                        value="{{ old('email') }}" required autocomplete="email" placeholder="Email">
                                    <div >
                                        <span >
                                            <i ></i>
                                        </span>
                                    </div>
                                    @error('email')
                                        <span  role="alert">
                                            <strong>{{ $message }}</strong>
                                        </span>
                                    @enderror
                                </div>

                            </div>
                            <div >
                                <div >
                                    <input id="password" type="password"
                                         name="password"
                                        required autocomplete="new-password" placeholder="**********">

                                    <div >
                                        <span >
                                            <i ></i>
                                        </span>
                                    </div>
                                    @error('password')
                                        <span  role="alert">
                                            <strong>{{ $message }}</strong>
                                        </span>
                                    @enderror
                                </div>
                            </div>
                            <div >
                                <div >
                                    <input id="password-confirm" type="password" 
                                        name="password_confirmation" required autocomplete="new-password"
                                        placeholder="**********">
                                    <div >
                                        <span >
                                            <i ></i>
                                        </span>
                                    </div>
                                </div>
                            </div>
                            <div >
                                <div >
                                    <label >
                                        <input type="checkbox"  checked> I agree to the terms
                                    </label>
                                </div>
                            </div>
                            <div >
                                <button type="submit" >
                                    {{ __('Register') }}
                                </button>
                            </div>
                            <div >
                                <span >Already have and account ?</span>
                                <a href="{{ route('login') }}" >{{ __('Login') }}</a>
                            </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

enter image description here

CodePudding user response:

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

  •  Tags:  
  • Related