{% extends '_layout.html' %}

{% block main %}
	{% load martortags %}
	
	<header>
		<div class="flex-row">
			<h2 class="flex-extend">{{ epic.name }}</h2>
		
			<ul class="actions small">
				<li><a class="button special icon fa-edit tool-btn" href="{% url 'epic_edit' epic_id=epic.id %}" title="Modifier"></a></li>
				<!-- <li><a class="button icon fa-trash tool-btn" href="{% url 'epic_delete' epic_id=epic.id %}"></a></li> -->
			</ul>
		</div>
		
	</header>

	<div class="flex-row flex-space-around">
		<span>Taille: <b>{{ epic.size }}</b></span>
		<span>Valeur: <b>{{ epic.value }}</b></span>
	</div>
	
	<hr>
	
	<div class="flex-row">
		<h4 class="flex-extend">Stories</h4>
		<a class="button special icon fa-plus tool-btn" href="{% url 'story_create' epic_id=epic.id %}" title="Créer une nouvelle Story"></a>
	</div>
	
	{% if epic.stories.count %}
	    <ul class="alt issues-list">
	    {% for story in epic.stories.all %}
	    
		    <li id="story_{{ story_id }}" class="issue" data-id="{{ story_id }}">
		    	<div class="issue-frame flex-row">
		    		<div class="issue-frame-left flex-extend">
		    			<div class="issue-title">
		    			{% if story.closed %}
		        			<a href="{% url 'story_details' story_id=story.id %}" class="story-closed"> {{ story.name }} </a>
		        		{% else %}
		        			<a href="{% url 'story_details' story_id=story.id %}"> {{ story.name }} </a>
		        		{% endif %}
		        		</div>
		        		<div class="issue-infos">
		        			<span class="annotation">Créée le {{ story.created }}, par {{ story.author.username }}</span>
		        		</div>
		        	</div>
		        	<div class="issue-frame-right">
		        		<ul class="controls">
		        		<!-- Icone commentaires ici -->
		        		</ul>
		        		<div class="annotation issue-last-update">Dernière mise à jour le {{ story.updated }}</div>
		        	</div>
		        </div>
		    </li>
	    
	    {% endfor %}
	    </ul>
	 {% else %}
	 	<span class="annotation">(Aucune story)</span>
	 {% endif %}
	
	<hr>
	
	<div class="description">
		{{ epic.description|safe_markdown }}
	</div>

{% endblock %}