Styling episode & emissions WIP

diff --git a/panikweb_templates/static/css/tags.less b/panikweb_templates/static/css/tags.less
index 4b0f240560c10465783cf10a5bf6b4198cf46556..c369c9076ddf01d48743f2e02509e03d03527ca4 100644 (file)
--- a/panikweb_templates/static/css/tags.less
+++ b/panikweb_templates/static/css/tags.less
@@ -21,6 +21,8 @@ em {
 blockquote {
     padding-left:15px;
     font-family:RE03;
+       color:#aaa;
+    font-size: @l;
     margin-bottom: @m;
 }
 

diff --git a/panikweb_templates/templates/emissions/detail.html b/panikweb_templates/templates/emissions/detail.html
index 1f19687985bb690cb95e4ac1706e31dcfc31e1fe..eab70c3059709ed605e4859337176633a29e309f 100644 (file)
--- a/panikweb_templates/templates/emissions/detail.html
+++ b/panikweb_templates/templates/emissions/detail.html
@@ -1,54 +1,56 @@
+<div class="emission">
+       <div class="content emission emission-detail cf">
+               <!--
+               <nav class="menu">
+                       <ul>
+                               <li><a href="#">épisodes</a></li>
+                               <li><a href="#" class="active">à propos</a></li>
+                       </ul>
+               </nav>
+               -->
+               <header class="mainHeader">
+                       <h1 class="title">{{ emission.title }}</h1>
+               </header>
+               <div class="metas">
+                       <div class="schedule">
+                               <div>mercredi &amp; jeudi</div>
+                               <div class="time">7:30-8:00</div>
+
+                               <div>vendredi</div>
+                               <div class="time">9:00-9:30</div>
+                       </div>
+                       <button class="control">
+                               <span class="symbol">G</span>
+                               <span class="listen">Écouter <!--la dernière--></span>
+                       </button>
+                       <div class="cf"></div>
+                       {% if emission.description %}
+                       <h4 class="description">
+                               {{ emission.description|safe|striptags }}
+                       </h4>
+                       {% endif %}
+                       {% if emission.email %}
+                               <div class="email">{{ emission.email}}</div>
+                       {% endif %}
+                       {% if emission.website %}
+                               <div class="contact"><a href="{{ emission.website}}">{{ emission.website}}</a></div>
+                       {% endif %}
+               </div>
 
-<div class="content emission emission-detail">
-       <nav class="menu">
-               <ul>
-                       <!--<li><a>&lt; précédent</a></li>
-                       <li><a>suivant &gt;</a></li>-->
-                       <li><a href="#">épisodes</a></li>
-                       <li><a href="#" class="active">à propos</a></li>
-               </ul>
-       </nav>
-       <header class="mainHeader">
-               <h1 class="title">{{ emission.title }}</h1>
-       </header>
-       <div class="metas">
-               <div class="schedule">
-                       <div>mercredi &amp; jeudi</div>
-                       <div class="time">7:30-8:00</div>
+               <img class="logo" src="http://placehold.it/280X180"/>
 
-                       <div>vendredi</div>
-                       <div class="time">9:00-9:30</div>
-               </div>
-               <button class="control">
-                       <span class="symbol">G</span>
-                       <span class="listen">Écouter <!--la dernière--></span>
-               </button>
-               <div class="cf"></div>
-               {% if emission.description %}
-               <h4 class="description">
-                       {{ emission.description|safe|striptags }}
-               </h4>
+               {% if emission.text %}
+               <article class="text">
+                       {{ emission.text|safe }}
+               </article>
                {% endif %}
-               <div class="URL">http://www.lecroissantfertile.com</div>
-               <div class="contact">info@lecroissantfertile.com </div>
        </div>
-
-       <img class="logo" src="http://placehold.it/280X180"/>
-
-       {% if emission.text %}
-       <article class="text">
-               {{ emission.text|safe }}
-       </article>
+       {% if episodes %}
+               <div class="episode-list">
+               {% for episode in episodes %}
+                               {% include "episodes/detail.html" %}
+               {% endfor %}
+               </div>
        {% endif %}
-
-
-{% if episodes %}
-       <div class="episode-list">
-       {% for episode in episodes %}
-                       {% include "episodes/detail.html" %}
-       {% endfor %}
-       </div>
-{% endif %}
-
 </div>
 

diff --git a/panikweb_templates/templates/episodes/detail.html b/panikweb_templates/templates/episodes/detail.html
index a7a3ffef369a967a4a02c9f5be3d2398a8d24e4f..bf3f05758d644e013b2ba31a3b10964313ee8698 100644 (file)
--- a/panikweb_templates/templates/episodes/detail.html
+++ b/panikweb_templates/templates/episodes/detail.html
@@ -6,46 +6,52 @@
 </li>
 -->
 <div class="episode episode-detail cf">
-    <div class="date">
-        <div class="day">
-            {{ episode.first_diffusion|date:"D"}}
-        </div>
-        <div class="day-number">
-            {{ episode.first_diffusion|date:"d/m" }}
-        </div>
-        <div class="time">
-            {{ episode.first_diffusion|date:"H:i" }}
-        </div>
-    </div>
-    <div class="controls">
-        <div class="symbol" style="float:left;">A</div><div class=symbol>B</div>
-        <div class="symbol">I</div>
-        <div class="symbol">C</div>
-    </div>
-    <div class="logo">
-        <img src="http://placehold.it/100X100" />
-    </div>
-    <div class="content">
-       <h4 class="title"><a href="{{ episode.slug }}">{{ episode.title }}</a></h4>
-       <div class="metas">
-               <dl class="credits cf">
-                   <dt>Serie</dt>
-                   <dd>La musique</dd>
-                   <dt>Auteur</dt>
-                   <dd>Jean Dupont</dd>
-                   <dt>Rediffusion</dt>
-                   <dd>Émission de JetFM</dd>
-               </dl>
-               <ul class="tags">
-                   <li>1955</li>
-                   <li>RCA</li>
-                   <li>Synthetiseur</li>
-                   <li>Electronique</li>
-                   <li>Harry Olson</li>
-                   <li>1955</li>
-                   <li>RCA</li>
-                   <li>Synthetiseur</li>
-               </ul>
+       <div class="date">
+               <div class="day">
+                   {{ episode.first_diffusion|date:"D"}}
+               </div>
+               <div class="day-number">
+                   {{ episode.first_diffusion|date:"d/m" }}
+               </div>
+               <div class="time">
+                   {{ episode.first_diffusion|date:"H:i" }}
+               </div>
+       </div>
+       <div class="controls">
+               <div class="symbol" style="float:left;">A</div><div class=symbol>B</div>
+               <div class="symbol">I</div>
+               <div class="symbol">C</div>
+       </div>
+               <!--
+       <div class="logo">
+               <img src="http://placehold.it/100X100" />
+       </div>
+               -->
+       <div class="content">
+               <h4 class="title"><a href="{{ episode.slug }}">{{ episode.title }}</a></h4>
+               {% if episode.text %}
+               <article class="text">
+                       {{ episode.text|safe }}
+               </article>
+               {% endif %}
+               <!--
+               <div class="metas">
+                       <dl class="credits cf">
+                           <dt>Serie</dt><dd>La musique</dd>
+                           <dt>Auteur</dt><dd>Jean Dupont</dd>
+                           <dt>Rediffusion</dt><dd>Émission de JetFM</dd>
+                       </dl>
+                       <ul class="tags">
+                           <li>1955</li>
+                           <li>RCA</li>
+                           <li>Synthetiseur</li>
+                           <li>Electronique</li>
+                           <li>Harry Olson</li>
+                           <li>1955</li>
+                           <li>RCA</li>
+                           <li>Synthetiseur</li>
+                       </ul>
+               </div>
+               -->
        </div>
-    </div>
 </div>