@extends('maintenance.layout.layout')

@section('content')
<section class="content">
    <!-- Page Header -->
    <section class="content-header">
        <div class="container-fluid">
            <div class="row mb-2">
                    <h1 style="font-weight: bold;">Change Password</h1>
            </div>
        </div>
    </section>

    <!-- Store Card -->
    <div class="card" style="max-width: 500px;">
        <div class="card-body login-card-body bg-transparent">
            <form id="changepassword-form">
                @csrf
                <input type="hidden" id="username" name="username" value="{{ auth()->user()->username }}">

                <div class="form-group">
                    <label for="defaultPassword">Old Password</label>
                    <input type="password" class="form-control" id="defaultPassword" aria-describedby="defaultPassword" name="defaultPassword"required>
                </div>
                <div class="form-group">
                    <label for="newPassword">New Password</label>
                    <input type="password" class="form-control" id="newPassword" name="newPassword"required>
                     <label class="mt-2 mb-2"id="passwordResult" style="color: red"></label>
                    <button type="submit" class="btn btn-block w-100" style="background-color: #ffdd00; position: relative;z-index: 10;">Submit</button>
                </div>

    
            </form>
        </div>
    </div>
</section>

@endsection



@section('javascript')
    <script src="{{asset('js/change-password.js')}}"></script>
@endsection