{% extends 'shared/two-column-list.html.twig'%}
  {% block sidecolumn %} 
 
  <!--begin::Contact group wrapper-->
										<div class="card card-flush">
											<!--begin::Card header-->
											<div class="card-header pt-7" id="kt_chat_contacts_header">
												<!--begin::Card title-->
												<div class="card-title">
													<h2>Categories</h2>
												</div>
												<!--end::Card title-->
											</div>
											<!--end::Card header-->
											<!--begin::Card body-->
											<div class="card-body pt-5">
												<!--begin::Contact groups-->
												<div class="d-flex flex-column gap-5">
														{% for sizecategory in categories %}
													<!--begin::Contact group-->
													<div class="d-flex flex-stack">
														<a href="{{ url(list_route_name)}}?c={{ sizecategory.uuid }}" class="fs-6 fw-bold text-gray-800 text-hover-primary text-active-primary active">{{ sizecategory.name }}</a>
														<div class="badge badge-light-primary">{{ sizecategory.size_count }}</div>
													</div>
													<!--begin::Contact group-->
													{% endfor %}
												</div>
												<!--end::Contact groups-->
											
												<!--begin::Separator-->
												<div class="separator my-7"></div>
												<!--begin::Separator-->
												<!--begin::Add new contact-->
												<a href="{{ url( mgr_route_name) }}" class="btn btn-primary w-100">
												Add new Size</a>
												<!--end::Add new contact-->
											</div>
											<!--end::Card body-->
										</div>
										<!--end::Contact group wrapper-->
  
   {% endblock  %}
  
  
  {% block table %}
									<table class="table align-middle table-row-dashed fs-6 gy-5">
										<thead>
											<tr class="text-start text-gray-500 fw-bold fs-7 text-uppercase gs-0">
												<th class="min-w-150px">{% if pagination.items.0.name is defined %} {{ pagination.items.0.name }} {% endif %} Size</th>
												<th class="text-end min-w-70px">Actions</th>
											</tr>
										</thead>
										<tbody class="fw-semibold text-gray-600">
												{% for size in pagination.items %}
											<tr>
												<td>
													<div class="d-flex">
														
														<div class="ms-5">
															<!--begin::Title-->
															<a href="{{ url('app_size_edit',{'id':size.id})}}" class="text-gray-800 text-hover-primary fs-5 fw-bold mb-1">{{ size.details }}</a>
															<!--end::Title-->
														
														</div>
													</div>
												</td>
											
												<td class="text-end">
													<a href="#" class="btn btn-sm btn-light btn-active-light-primary btn-flex btn-center" data-kt-menu-trigger="click" data-kt-menu-placement="bottom-end">Actions
													<i class="ki-duotone ki-down fs-5 ms-1"></i></a>
													<!--begin::Menu-->
													<div class="menu menu-sub menu-sub-dropdown menu-column menu-rounded menu-gray-600 menu-state-bg-light-primary fw-semibold fs-7 w-125px py-4" data-kt-menu="true">
														<!--begin::Menu item-->
														<div class="menu-item px-3">
															<a href="{{ url('app_size_edit',{'id':size.id})}}" class="menu-link px-3">Edit</a>
														</div>
														<!--end::Menu item-->
														
													</div>
													<!--end::Menu-->
												</td>
											</tr>
												
											{% endfor %}
										</tbody>
										<!--end::Table body-->
								</table>
												
                {% endblock %}