work on design

cms/templates/cms/snippets/comments.html

@@ -1,6 +1,11 @@
 {% load i18n %}
+{% load static %}
 {% load honeypot %}
 
+{% if comment_form or page.comments %}
+<h2><img src="{% static "cms/images/comments.png" %}" class="icon">{% trans "Comments" %}</h2>
+{% endif %}
+
 {% if comment_form %}
 {% with comment_form as form %}
 {{ form.non_field_errors }}
@@ -30,7 +35,10 @@
 </div>
 </form>
 
-<ul>
+{% endwith %}
+{% endif %}
+
+<ul class="list">
     {% for comment in page.comments %}
     <li class="comment">
         <div class="metadata">
@@ -45,8 +53,3 @@
     {% endfor %}
 </ul>
 
-{% endwith %}
-{% endif %}
-
-
-

cms/templates/cms/snippets/date_list_item.html

@@ -16,6 +16,7 @@ is just a bit different.
     {% endwith %}
     {% endif %}
 
+    {% if not list_no_cover %}
     {% if item_big_cover %}
         {% image item.cover max-640x480 class="cover big" height="" width="" %}
     {% elif item.cover %}
@@ -23,6 +24,7 @@ is just a bit different.
     {% else %}
         <div class="cover small"></div>
     {% endif %}
+    {% endif %}
 
     <div class="flex_item">
         <h3>{{ item.title }}</h3>

cms/templates/cms/snippets/sound_list_item.html

@@ -1,13 +1,22 @@
 {% load static %}
 
 {# TODO: complete archive podcast -> info #}
-<a class="list_item sound" onclick="player.playlist.add(new Sound(
+<div class="list_item sound">
+<a onclick="player.select(player.playlist.add(new Sound(
         title='{{ item.name|escape }}',
         detail='{{ item.detail_url }}',
-        stream='{{ item.url }}'));">
-    <h3>{{ item.name }}</h3>
+        duration={{ item.duration|date:"H*3600+i*60+s" }},
+        streams='{{ item.url }}')));" class="flex_row">
+    <img src="{% static "cms/images/listen.png" %}" class="icon"/>
+    <h3 class="flex_item">{{ item.name }}</h3>
+
     <span class="info">
-        {{ duration.date|date:'H:i:s' }}
+        {% if item.duration.hour > 0 %}
+        {{ item.duration|date:'H:i:s' }}
+        {% else %}
+        {{ item.duration|date:'i:s' }}
+        {% endif %}
     </span>
 </a>
+</div>