{% extends "base.html" %}

{% block content %}

<div class="row justify-content-center">

	{% for service in services %}
	<div class="col col-12 col-lg-4">
		<div class="card border-primary mb-3" style="max-width: 80rem;">
			<div class="card-header border-primary bg-primary text-white">
				{{ service["SERVER_NAME"] }}
				<button class="btn btn-sm ms-2 float-end btn-light"><i class="fas fa-trash-alt"></i></button>
				<button class="btn btn-sm mx-2 float-end btn-light"><i class="fas fa-edit"></i></button>
				<a class="btn btn-sm mx-2 float-end btn-light" href="http://{{ service["SERVER_NAME"] }}" target="_blank" ><i class="fas fa-eye"></i></a>
			</div>
			<div class="card-body text-dark">
				<h5 class="card-title">Summary</h5>
				<span class="card-text">
					<div class="row justify-content-center">
						<div class="col col-6">Serve files</div>
						<div class="col col-6 text-center"><i class="fas fa-{{ env_to_summary_class(service["SERVE_FILES"], "yes") }}"></i></div>
						<div class="col col-6">Reverse proxy</div>
						<div class="col col-6 text-center"><i class="fas fa-{{ env_to_summary_class(service["USE_REVERSE_PROXY"], "yes") }}"></i></div>
						<div class="col col-6">HTTPS</div>
						<div class="col col-6 text-center"><i class="fas fa-{{ env_to_summary_class(service["AUTO_LETS_ENCRYPT"], "yes") }}"></i></div>
					</div>
				</span>
			</div>
		</div>
	</div>
	{% endfor %}

</div>

{% endblock %}