Add some navigations & display to emissions

panikweb_templates/static/css/specifics.css

@@ -264,16 +264,19 @@ body{
 /**** Liste   ****/
 /**** EMISSIONS ****/
 #Emission .emission-detail .title{}
-#Emission-tabs-detail, 	#Emission-tabs-episodes{
+#Emissions .wrapper{
 	max-width:600px;
 	margin:auto;
 }
 @media screen and (min-width: 1000px) {
-	#Emissions .withEpisodes #Emission-tabs-detail{
+	#Emissions .wrapper{
+		max-width:1024px;
+	}
+	#Emissions .wrapper.sided #Emission-tabs-detail{
 		float:left;
 		width:450px;
 	}
-	#Emissions .withEpisodes #Emission-tabs-episodes{
+	#Emissions .wrapper.sided #Emission-tabs-episodes{
 		float:right;
 		width:450px;
 	}

panikweb_templates/templates/emissions/emission_detail.html

 {% extends "emissions.html" %}
 {% load paniktags %}
 {% block bodyID %}Emissions{% endblock %}
+{% block nav %}
+<nav>
+	<ul class="inline">
+		<li>
+			<a href="{% url 'emissions' %}">
+				<span class="icon-group" ></span>
+				<span class="iconLabel">Emissions</span>
+			</a>
+		</li>
+		<li>
+			<a href="{% url 'emission-view' slug=emission.slug %}">{{ emission.title }}</a>
+		</li>
+		{% if episode %}
+		<li>
+			<a href="{% url 'episode-view' slug=episode.slug %}">{{ episode.title }}</a>
+		</li>
+		{% endif %}
+	</ul>
+</nav>
+{% endblock %}
 {% block main %}
-<div class="wrapper">
-	<div class="emission padded {% if episodes %}withEpisodes{% endif %}">
-	<header class="mainHeader">
-		<h2 class="squashed title">{{ emission.title }}</h2>
-	</header>
+<div class="wrapper {% if episodes %}sided{% else %}classic{% endif %}">
+	<div id="Emission-container" class="emission padded">
+		<header class="mainHeader">
+			<h2 class="squashed title">{{ emission.title }}</h2>
+		</header>
 		<div id="Emission-tabs-detail">
 			{% emission_detail %}
 		</div>

panikweb_templates/templates/episodes/detail.html

-
+{% load thumbnails %}
+{% load paniktags %}
 <div class="episode detail episode-detail cf">
-	<div class="date left">
-		<div class="day">
-		    {{ episode.first_diffusion|date:"D"|slice:":2"}}
-		</div>
-		<div class="number">
-		    {{ episode.first_diffusion|date:"d" }}
-		</div>
-		<div class="month">
-		    {{ episode.first_diffusion|date:"M Y" }}
-		</div>
-		<div class="time">
-		    {{ episode.first_diffusion|date:"H:i" }}
-		</div>
-	</div>
-	<div class="controls todo right">
-		<button class="symbol play">A</button><button class="symbol add">B</button>
-		<button  class="symbol download">I</button>
-		<button class="symbol buy">C</button>
-	</div>
-	<div class="logo right">
-		<img src="http://placehold.it/100X100" />
+	<h3 class="title squashed">{{ episode.title }}</h3>
+	{% if episode.image %}
+	<div class="logo">
+		<img src="{{ episode.image|thumbnail:'640x480' }}"/>
 	</div>
+	{% endif %}
+	{% if episode.main_sound %}
+		<div class="sound">
+			{% audio sound=episode.main_sound %}
+		</div>
+	{% endif %}
 	<div class="content">
-		<h4 class="title">{{ episode.title }}</h4>
 		{% if episode.description %}
 		<div class="description">
 			{{ episode.description|safe }}
@@ -52,4 +41,5 @@
 			</ul>
 		</div>
 	</div>
+	
 </div>