@extends('layouts.app')

@section('content')
<div class="main">
    <div class="container">
        <center>
            <div class="middle">
                <div id="login">
                    <form method="POST" action="{{ route('login') }}">
                    @csrf
                        <fieldset class="clearfix">
                            <p ><span class="fa fa-user"></span><input type="text" id="username" Placeholder="ชื่อผู้ใช้"  name="username" value="{{ old('username') }}" required autocomplete="email" autofocus></p>
                            @error('username')
                                    <span class="invalid-feedback" role="alert">
                                        <strong>{{ $message }}</strong>
                                    </span>
                            @enderror
                            <p><span class="fa fa-lock"></span><input type="password" id="password" Placeholder="รหัสผ่าน" name="password" required autocomplete="current-password"></p>
                            @error('password')
                                    <span class="invalid-feedback" role="alert">
                                        <strong>{{ $message }}</strong>
                                    </span>
                            @enderror

                            <div>
                                <span style="width:48%; text-align:left;  display: inline-block;"><a class="small-text" href="{{ route('forget.password.get') }}">ลืมรหัสผ่าน ?</a></span>
                                <span style="width:50%; text-align:right;  display: inline-block;"><input type="submit" value="เข้าสู่ระบบ"></span>
                            </div>
                        </fieldset>
                        <div class="clearfix"></div>
                    </form>
                    <div class="clearfix"></div>
                </div>
                <div class="logo"><img src="{{ asset('imgs/logo-login.png') }}" alt="Logo" >
                    <div class="clearfix"></div>
                </div>
            </div>
        </center>
    </div>
</div>

@endsection
