@extends('layouts.default')

{{-- Page Title --}}
@section('title')
    Change Password
    @parent
@stop

{{-- Content --}}
@section('content')
    <div class="container">
        <h1>
            Change Password
            <a class="btn btn-dark float-right" href="{{ route('account.index') }}">Cancel</a>
        </h1>
        <hr/>
        <div class="row justify-content-center">
            <div class="col-md-7 col-lg-6">
                <form method="POST" action="{{ route('account.change-password') }}">
                    @csrf
                    {{--Email--}}
                    @include('components.form.input_row', [
                        'type' => 'password',
                        'name' => 'old_password',
                        'label' => 'Old Password',
                        'validation' => 'minLength="8" maxLength="30"',
                        'label_class' => 'col-sm-4',
                        'input_class' => 'col-sm-8'
                    ])
                    <hr />
                    {{--Passowrd--}}
                    @component('components.form.input_row', [
                        'type' => 'password',
                        'name' => 'password',
                        'label' => 'New Password',
                        'validation' => 'minLength="8" maxLength="30"',
                        'label_class' => 'col-sm-4',
                        'input_class' => 'col-sm-8'
                    ])
                        <small class="form-text text-muted">Must be at least 8 characters, contains both alphabets and digits.</small>
                    @endcomponent
                    {{--Passowrd Confirm--}}
                    @include('components.form.input_row', [
                        'type' => 'password',
                        'name' => 'password_confirmation',
                        'label' => 'New Password Confirmation',
                        'validation' => 'minLength="8" maxLength="30"',
                        'label_class' => 'col-sm-4',
                        'input_class' => 'col-sm-8'
                    ])

                    {{--Submit--}}
                    <div class="form-group text-right">
                        <button type="submit" class="btn btn-primary btn-lg px-5">Save</button>
                    </div>
                </form>
            </div>
        </div>
    </div>
@endsection