{% extends '_layout.html' %}
{% load commenting %}

{% block title %}
	{{ epic.name }}
{% endblock %}

{% block breadcrumb %}
	<li><a href="{% url 'index' %}">Accueil</a></li>
	<li><a>Epic #{{ epic.id }}</a></li>
{% endblock %}


{% block main %}
	{% load martortags %}
	
	<header>
		<div class="flex-row flex-space-around" style="margin-bottom: 1em;">
			<h2>
				{{ epic.name }} 
				<sup><a href="{% url 'epic_edit' epic_id=epic.id %}" style="margin-left: 5px;"><i class="fa fa-pencil"></i></a></sup>
			</h2>
		</div>
		
	</header>

	<div class="flex-row flex-space-around" style="font-size: 16px;">
		<b>{{ epic.size }}</b>
		
		<div>Stories: 
		<span class="valid">{{ epic.nb_active_stories }}</span> / 
		<span class="disabled">{{ epic.nb_closed_stories }}</span></div>
	</div>
	
	<hr>
	
	<div class="description">
		{{ epic.description|safe_markdown }}
	</div>
	
	<hr>
	
	<div class="flex-row">
		<h4 class="flex-extend">Stories</h4>
		<a href="{% url 'story_create' epic_id=epic.id %}">
			<i class="fa fa-plus"></i> Ajouter une story
		</a>
	</div>
	
	{% if epic.stories.count %}
	    <ul class="alt issues-list">
	    {% for story in epic.stories.all %}
	    
	    	{% include 'story_li.html' with story=story from='epic_details' %}

	    {% endfor %}
	    </ul>
	 {% else %}
	 	<span class="annotation">(Aucune story)</span>
	 {% endif %}


	<hr>
	
	{% comments_for epic %}
    
{% endblock %}