@extends('layouts.auth')

@section("title", "Login | SaveSpace")

@section('content')

    <!-- logo -->
    <div id="logo">
        <img class="logo" src="{{ url('assets/media/images/logo.png') }}" alt="image">
     </div>
    <!-- ./ logo -->

    <h5>Sign in</h5>

    <!-- form -->
    <form action="{{ route("auth.login") }}" method="post" accept-charset="utf-8">
        @csrf
        @if(Session::has('isActiveError'))
            <div class="alert alert-danger alert-dismissible fade show" role="alert">
                <strong> {{ Session::get('isActiveError') }} </strong>
                <button type="button" class="close" data-dismiss="alert" aria-label="Close"></button>
            </div>
        @endif

        @if(Session::has('loginError'))
            <div class="alert alert-error fade show" role="alert">
                <strong> {{ Session::get('loginError') }} </strong>
                <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                </button>
            </div>
        @endif
        <div class="form-group">
            <input id="username" type="text" tabindex="1" class="form-control{{ Session::has('usernameError') ? ' is-invalid' : '' }}" value="{{ old('username') }}" name="username" placeholder="Username" autocomplete="off" required autofocus>
            @if(Session::has('usernameError'))
                <span class="invalid-feedback" role="alert">
                    <strong>{{ Session::get('usernameError') }}</strong>
                </span>
            @endif
        </div>

        <div class="form-group">
            <input id="password" type="password" tabindex="2" class="form-control{{ Session::has('passwordError') ? ' is-invalid' : '' }}" name="password" autocomplete="off" placeholder="Password" required>
            @if(Session::has('passwordError'))
                <span class="invalid-feedback" role="alert">
                    <strong>{{ Session::get('passwordError') }}</strong>
                </span>
            @endif
        </div>

        <div class="form-group d-flex justify-content-between">
            <div class="custom-control custom-checkbox">
                <input type="checkbox" class="custom-control-input" name="remember" id="remember" checked="" {{ old('remember') ? 'checked' : '' }}>

                <label class="custom-control-label" for="customCheck1">Remember me</label>
            </div>
            <a href="/auth/forgot">Reset password</a>
        </div>
        <input type="submit" value="Sign in" class="btn btn-primary btn-block">
        <hr>
        <p class="text-muted">Don't have an account?</p>
        <a href="#" class="btn btn-outline-light btn-sm">Register now!</a>
    </form>
    <!-- ./ form -->

@endsection