<?php

session_start();
include('config/config_DB.php');
include('config/checklogin.php');
check_login();

?>

<!DOCTYPE html>
<html lang="en">
<meta http-equiv="content-type" content="text/html;charset=utf-8" />

<style>
/* Profile Picture */
.profile-pic{
   display: inline-block;
   vertical-align: middle;
    width: 50px;
    height: 50px;
    overflow: hidden;
   border-radius: 50%;
}

.profile-pic img{
   width: 100%;
   height: auto;
   object-fit: cover;
}
.profile-menu .dropdown-menu {
  right: 0;
  left: unset;
}
.profile-menu .fa-fw {
  margin-right: 10px;
}

.toggle-change::after {
  border-top: 0;
  border-bottom: 0.3em solid;
  
  
  .select2-selection__choice{
  background-color: var(--bs-gray-200);
  border: none !important;
  font-size: 12px;
  font-size: 0.85rem !important;
}
}

</style>
    
	<link rel="stylesheet" href="//cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" />
	
	<?php include("head.php"); ?>
	
	<body class="hold-transition sidebar-mini layout-fixed layout-navbar-fixed">
	
	<div class="wrapper">
	 
			<?php include("navigation02.php"); ?>
	 
			<?php include("menu03.php"); ?>
	 
			<div class="content-wrapper">
					
					<div class="content-header">
						<div class="container-fluid">
							<div class="row mb-2">
								<div class="col-sm-6">
									<h1 class="m-0 text-dark">Admin Dashboard</h1>
								</div><!-- /.col -->
								
								<!--  chemin  -->
								<div class="col-sm-6">
								<ol class="breadcrumb float-sm-right">
									<li class="breadcrumb-item"><a href="#">Home</a></li>
									<li class="breadcrumb-item active">Dashboard</li>
								</ol>
								
								
								</div><!-- /.col -->
							</div><!-- /.row -->
						</div><!-- /.container-fluid -->
					</div>  <!-- /.content-header -->
			
					<!-- Main content -->
					<section class="content">
					
						<div class="container-fluid">
<!-- -->						
							<div class="row">
								<div class="col-12 col-sm-6 col-md-3">
									<div class="info-box">
										<span class="info-box-icon bg-info elevation-1"><i class="fas fa-users"></i></span>
										<div class="info-box-content">
										<span class="info-box-text">Clients</span>
										<span class="info-box-number"><?php echo "123"; ?></span>
										</div>
									</div>
								</div>
								
								
								<div class="col-12 col-sm-6 col-md-3">
									<div class="info-box mb-3">
										<span class="info-box-icon bg-danger elevation-1"><i class="fas fa-user-tie"></i></span>
										<div class="info-box-content">
										<span class="info-box-text">Staffs</span>
										<span class="info-box-number">
										<?php echo "coco"; ?></span>
										</div>
									</div>
								</div>
								
							</div><!-- ./ row -->
							

							<div class="row">
								<div class="col-md-12">
									<div class="card card-purple">
										<div class="card-header">
										<h3 class="card-title">Création d'une catégorie</h3>
										</div>
                                
										<form method="post" enctype="multipart/form-data" role="form">
										<div class="card-body">
											<div class="row">
												<div class=" col-md-6 form-group">
													<label for="exampleInputEmail1">Nom</label>
													<input type="text" name="name" required class="form-control" id="exampleInputEmail1">
												</div>
											</div>

											<div class="row">
												<div class=" col-md-6 form-group">
													<label for="exampleInputEmail1">Staff Phone Number</label>
													<input type="text" name="phone" required class="form-control" id="exampleInputEmail1">
												</div>
                                            </div>

											<div class="row">
												<div class=" col-md-6 form-group">
													<label for="exampleInputEmail1">Staff Email</label>
													<input type="email" name="email" required class="form-control" id="exampleInputEmail1">
												</div>
											</div>

										<div class="clearfix"></div>

										</div> <!-- /.card-body -->

										<div class="card-footer">
											<button type="submit" name="ajouter_categorie" class="btn btn-success">Ajouter</button>
										</div>
										
										</form>
									</div>   <!-- /.card -->
								</div><!-- /.col -->
							</div> <!-- /.row -->
						</div><!--/. container-fluid -->
					</section> <!-- /.content -->
			</div> <!-- /.content-wrapper -->
		
			<!-- Control Sidebar -->
			<aside class="control-sidebar control-sidebar-dark">
			<!-- Control sidebar content goes here -->
			</aside>
			<!-- /.control-sidebar -->

	
			<?php include("footer.php"); ?>
			
	
	</div> <!-- ./wrapper -->
			
			<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>

			<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM" crossorigin="anonymous"></script>
	 
			<!--
			<script src="https://cdn.jsdelivr.net/npm/admin-lte@3.1/dist/js/adminlte.min.js"></script>
			-->
			
			<script src="adminlte.js"></script>

			
<script>
						
			document.querySelectorAll('.dropdown-toggle').forEach(item => 
			{
				item.addEventListener('click', event => 
				{
					if(event.target.classList.contains('dropdown-toggle') )
					{
						event.target.classList.toggle('toggle-change');
					}
					else if(event.target.parentElement.classList.contains('dropdown-toggle'))
					{
						event.target.parentElement.classList.toggle('toggle-change');
					}
				})
			});
			
			
</script>
			
	</body>

</html>