{% extends 'admin_base_layout.html' %}
{% load static %}
{% block content %}
<title>FitnessIQ | Trainers</title>
<div class="main-content pt-0">
	<div class="content-wrapper">
        <div class="row">
            <div class="col-12 col-md-12">
                <h2 class="f-22 mb-0 bold">Add Trainers</h2>
                <p class="gray f-14 mb-2">Welcome to Fitness IQ</p>
            </div>   
        </div>
        <form class="row" action="/add-trainer" id="add-trianer" method="POST" enctype="multipart/form-data" novalidate="novalidate">
    
            <div class="row new-user-table bookings mt-3">
                <div class="col-12 col-md-12">
                    <div class="card addService fortune dashboard-card">
                        <div class="row">
                            <div class="col-12">
                                <div class="">
                                    <div class="picUpdate d-flex align-items-center justify-content-left border p-3 mb-4">
                                        <div class="profile-pic">
                                            <div class="upload-new-photo d-flex align-items-center">
                                                <div class="pe-3 text-center mb-3">
                                                    <img src="/static/admin/images/user-default.png" id="profile-image">
                                                </div>
                                                <div class="input-upload">
                                                    <input type="file" name="avatar" id="myFileInput"  accept="image/*">
                                                    <input type="button" class="btn mb-0" value="Upload a New Photo">
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-12 col-md-6">
                                <label class="col-form-label">Name</label>
                                <input type="text" placeholder="Name" name="name" class="form-control" value="Option" maxlength="15">
                            </div>                         
                            <div class="col-12 col-md-6">
                                <label class="col-form-label">Email</label>
                                <input type="email" placeholder="Enter Email" name="email" class="form-control" maxlength="100" value="option@yopmail.com" readonly="">
                            </div>
                            <div class="col-12">
                                <div class="save-btn text-center mt-4">
                                    <button type="submit" class="save-btn">Add Trainer</button>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </form>
	</div>
</div>

{%endblock%}

{%block js%}
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
<script src="https://code.highcharts.com/highcharts.js"></script>


{% endblock %}