{% extends "templates/base.html" %}
{% block title %}Profile{% endblock %}
{% from "www/lms/macros/hero.html" import hero %}

{% block head_include %}
	<style>
		section {
			padding: 5rem 0 5rem 0;
		}
	</style>
{% endblock %}

{% macro card(program) %}
<div class="col-sm-4 mb-4 text-left">
	<a href="/lms/program?program={{ program.name }}" class="no-decoration no-underline">
	<div class="card h-100">
		<div class='card-body'>
			<h5 class='card-title'>{{ program.program }}</h5>
			<ul class="list-unstyled text-muted">
				{% for course in program.progress %}
				<li>
					{% if course.completed %} <span class="indicator green">
					{% elif course.started %} <span class="indicator orange">
					{% else %} <span class="indicator blue">
					{% endif %}
						<a class="text-muted" href="/lms/course?name={{ course.name }}&program={{ program.name }}">{{ course.course }}</a>
					</span>
				</li>
				{% endfor %}
			</ul>
		</div>
		<div class='card-footer'>
			<span class="small">{{ program.completion }}{{_('% Complete')}}</span>
		</div>
	</div>
	</a>
</div>
{% endmacro %}

{% block content %}
<section class="section">
	<div class='container pb-5'>
		<div class="mb-3 row">
			<div class="col-md-7">
				<a href="/lms" class="text-muted">
					{{_('Back to Home')}}
				</a>
			</div>
			<div class="col-md-5 text-right">
				<a href="/update-profile?name={{ frappe.session.user }}" target="blank" class="mt-0 text-muted">{{_('Edit Profile')}}</a>
			</div>
		</div>
		<h1>{{ student.first_name }} {{ student.last_name or '' }}</h1>
		<p class="lead" style="max-width: 100%;">{{ student.name }}</p>
	</div>
	<div class='container'>
		<div class="row mt-5">
			{% for program in progress %}
				{{ card(program) }}
			{% endfor %}
		</div>
	</div>
</section>
{% endblock %}