use a right column on home page on bigger screens

diff --git a/panikweb_templates/static/css/specifics.css b/panikweb_templates/static/css/specifics.css
index 60493a579f232ac77bebb68acf8499372d2cbdba..3c2cab131f831d2fa8a873a19dc77bbe6a71cd84 100644 (file)
--- a/panikweb_templates/static/css/specifics.css
+++ b/panikweb_templates/static/css/specifics.css
@@ -73,7 +73,7 @@
 
 @media screen and (min-width: 600px) {
        .wrapper.sided .leftPart,
-         .wrapper.sided .rightPart{
+       .wrapper.sided .rightPart{
                width:45%;
        }
        .wrapper.sided .leftPart{
@@ -82,6 +82,26 @@
        .wrapper.sided .rightPart{
                float:right;
        }
+
+       #Home .leftPart,
+       #Home .rightPart {
+               width: 100%;
+       }
+}
+
+
+@media screen and (min-width: 1280px) {
+       #Home .leftPart {
+               width: 60%;
+       }
+       #Home .rightPart {
+               width: 30%;
+       }
+       #recent-sounds ul.columns {
+               column-count: 1;
+               -webkit-column-count: 1;
+               -moz-column-count: 1;
+       }
 }
 
 

diff --git a/panikweb_templates/templates/home.html b/panikweb_templates/templates/home.html
index 24610b1d34c5b482bd784689ac52d565e8eaa5eb..de9cc3ee948c156d2b75eba33972ae48ac442602 100644 (file)
--- a/panikweb_templates/templates/home.html
+++ b/panikweb_templates/templates/home.html
@@ -10,35 +10,26 @@
        {% endwith %}
 {% endblock %}
 {% block main %}
-               <div class="wrapper">
-                       <h2><a href="{% url 'program' %}">Cette semaine sur Panik</a></h2>
-                       {% weekview %}
-               </div>
-<div class="padded">
-  <form method="post" action="{% url 'newsletter-subscribe' %}" class="big center" id="subscribe-form">
-  <p>Tous les lundis, l'actualité de la semaine de Panik :</p>
-    {% csrf_token %}
-    {{ newsletter_form.as_table }}
-    <button>M'inscrire</button>
-  </form>
-</div>
 
-{% endblock %}
-{% block related %}
-               <div class="wrapper">
-                       <h2><a href="{% url 'listen' %}">Derniers sons</a></h2>
-                       <ul class="custom columns list">
-                       {% for soundfile in soundfiles %}
-                               <li class="item {% if soundfile.episode.emission.categories.all.count = 0 %}nocat{% endif %} {% for category in soundfile.episode.emission.categories.all %} {{ category|slugify }}{% endfor %}">
-                                 {% soundfile_resume soundfile=soundfile date=soundfile.first_diffusion %}
-                               </li>
-                       {% endfor %}
-                       </ul>
-               </div>
-{% endblock %}
-{% block links %}
-       <div class="wrapper">   
-               <h2><a href="{% url 'emissions' %}">Nouvelles émissions dans la grille</a></h2>
+
+<div class="sided wrapper padded">
+       <div class="leftPart">
+               <h2><a href="{% url 'program' %}">Cette semaine sur Panik</a></h2>
+               {% weekview %}
+
+         <form method="post" action="{% url 'newsletter-subscribe' %}"
+                 class="big center padded" id="subscribe-form">
+         <p>Tous les lundis, l'actualité de la semaine de Panik :</p>
+           {% csrf_token %}
+           {{ newsletter_form.as_table }}
+           <button>M'inscrire</button>
+         </form>
+       </div>
+
+       <div class="rightPart">
+
+               <div id="recent-emissions">
+               <h4><a href="{% url 'emissions' %}">Nouveau dans la grille</a></h4>
                <ul class="custom list columns padded">
                {% for emission in emissions %}
                        <li class="item ellipsis">
@@ -51,5 +42,20 @@
                        </li>
                {% endfor %}
                </ul>
+               </div>
+
+               <div id="recent-sounds">
+               <h4><a href="{% url 'listen' %}">Derniers sons</a></h4>
+               <ul class="custom columns list">
+               {% for soundfile in soundfiles %}
+                       <li class="item {% if soundfile.episode.emission.categories.all.count = 0 %}nocat{% endif %} {% for category in soundfile.episode.emission.categories.all %} {{ category|slugify }}{% endfor %}">
+                         {% soundfile_resume soundfile=soundfile date=soundfile.first_diffusion %}
+                       </li>
+               {% endfor %}
+               </ul>
+               </div>
+
        </div>
+</div>
+
 {% endblock %}