From 4f97e29a98f77caa49958c4c479c85031cc15ae0 Mon Sep 17 00:00:00 2001
From: laron <simon@surlaterre.org>
Date: Mon, 9 Sep 2013 11:09:29 +0200
Subject: [PATCH] Many small fixes for small screen (paddings)

---
 panikweb_templates/static/css/specifics.css        | 14 ++++++--------
 panikweb_templates/templates/emissions.html        |  2 +-
 panikweb_templates/templates/emissions/resume.html |  4 ++--
 panikweb_templates/templates/episodes/resume.html  |  4 ++--
 panikweb_templates/templates/home.html             |  6 +-----
 panikweb_templates/templates/includes/week.html    |  6 +++---
 panikweb_templates/templates/news/inline.html      | 10 ++++++----
 panikweb_templates/templates/program.html          |  6 +++++-
 panikweb_templates/templates/search/search.html    |  8 ++++----
 panikweb_templates/templates/week.html             |  6 +++++-
 10 files changed, 35 insertions(+), 31 deletions(-)

diff --git a/panikweb_templates/static/css/specifics.css b/panikweb_templates/static/css/specifics.css
index bc8cbbf..99b660c 100644
--- a/panikweb_templates/static/css/specifics.css
+++ b/panikweb_templates/static/css/specifics.css
@@ -66,7 +66,7 @@
 /****************************************************/
 /* WRAPPER */
 /****************************************************/
-.wrapper {max-width: 1260px; margin:auto;}
+.wrapper {max-width: 1260px; margin:auto;padding:0 1em 0 1em;}
 .wrapper.text {max-width: 780px; margin:auto;}
 .wrapper.half {max-width: 510px; margin:auto;}
 .wrapper.sided{		max-width:1260px;	}
@@ -607,7 +607,7 @@ body{
 .episode.inline .logo{
 	min-height: 50px;
 	float: left;
-	margin-right:1em;
+	margin-right:0.5em;
 }
 .episode.resume .sound{
 	float:right;
@@ -652,9 +652,7 @@ body{
 	.episode.resume .content {
 		padding-left: 4em;
 	}
-}
-@media screen and (max-width: 300px) {
-	.episode.resume .logo{display:none;}
+	.resume .logo img,.inline .logo img{width:30px !important;}
 }
 
 /****************************************************/
@@ -720,7 +718,7 @@ body{
 }
 .news li a{padding:1em;}
 
-.news .logo{
+.news .logo img{
 	display:block;
 	border-style:solid;
 	border-width:2px;
@@ -781,10 +779,10 @@ ul.newsSpecial{
 }
 .program-week .programDate{
 	float:left;
-	width:5em;
+	width:3em;
 }
 .program-week .programCell{
-	margin-left:6em;
+	margin-left:3.5em;
 }
 .program-week .nonStop .programDate{
 	visibility:hidden;
diff --git a/panikweb_templates/templates/emissions.html b/panikweb_templates/templates/emissions.html
index ef32d50..7d2f678 100644
--- a/panikweb_templates/templates/emissions.html
+++ b/panikweb_templates/templates/emissions.html
@@ -6,7 +6,7 @@
 	{% emission_nav with klass="emissions" %}
 {% endblock %}
 {% block main %}
-<div class="emissions padded">
+<div class="emissions">
 	<div class="wrapper">
 		<ul class="custom list columns padded">
 		{% for emission in emissions %}
diff --git a/panikweb_templates/templates/emissions/resume.html b/panikweb_templates/templates/emissions/resume.html
index 183bc18..627afc1 100644
--- a/panikweb_templates/templates/emissions/resume.html
+++ b/panikweb_templates/templates/emissions/resume.html
@@ -5,9 +5,9 @@
 		<a class="block" href="{% url 'emission-view' slug=emission.slug %}">
 			<div class="logo left">
 				{% if emission.image %}
-					<img width="60" height="60" src="{{ emission.image|thumbnail:'60x60' }}"/>
+					<img src="{{ emission.image|thumbnail:'60x60' }}"/>
 				{% else %}
-					<img  class="smooth" width="60" height="60" src="{% static "img/defaultLogo.png" %}"/>
+					<img  class="smooth"  style="width:60px;" src="{% static "img/defaultLogo.png" %}"/>
 				{% endif %}
 			</div>
 			<div class="title ellipsis">
diff --git a/panikweb_templates/templates/episodes/resume.html b/panikweb_templates/templates/episodes/resume.html
index be8070f..05d560f 100644
--- a/panikweb_templates/templates/episodes/resume.html
+++ b/panikweb_templates/templates/episodes/resume.html
@@ -28,13 +28,13 @@
 		{% elif model = "inline" and episode.emission.image %}
 			<img src="{{ episode.emission.image|thumbnail:'60x60' }}"/>
 		{% elif model = "inline" %}
-			<img class="smooth"  width="60" height="60" src="{% static "img/defaultLogo.png" %}"/>
+			<img class="smooth"  style="width:60px;" src="{% static "img/defaultLogo.png" %}"/>
 		{% elif episode.image %}
 			<img src="{{ episode.image|thumbnail:'150x150' }}"/>
 		{% elif episode.emission.image %}
 			<img src="{{ episode.emission.image|thumbnail:'150x150' }}"/>
 		{% else %}
-			<img class="smooth" width="150" height="150" src="{% static "img/defaultLogo.png" %}"/>
+			<img class="smooth" style="width:150px;" src="{% static "img/defaultLogo.png" %}"/>
 		{% endif %}
 	</div>
 	<div class="content">
diff --git a/panikweb_templates/templates/home.html b/panikweb_templates/templates/home.html
index 69bcbf6..b8bfeac 100644
--- a/panikweb_templates/templates/home.html
+++ b/panikweb_templates/templates/home.html
@@ -10,15 +10,12 @@
 	{% endwith %}
 {% endblock %}
 {% block main %}
-	<div class="padded">
 		<div class="wrapper">
 			<h2><a href="{% url 'program' %}">Cette semaine sur Panik</a></h2>
 			{% weekview %}
 		</div>
-	</div>
 {% endblock %}
 {% block related %}
-	<div class="padded">
 		<div class="wrapper">
 			<h2><a href="{% url 'listen' %}">Écouter</a></h2>
 			<ul class="custom columns list">
@@ -29,10 +26,9 @@
 			{% endfor %}
 			</ul>
 		</div>
-	</div>
 {% endblock %}
 {% block links %}
-	<div class="wrapper padded">	
+	<div class="wrapper">	
 		<h2><a href="{% url 'emissions' %}">Émissions</a></h2>
 		<ul class="custom list columns padded">
 		{% for emission in emissions %}
diff --git a/panikweb_templates/templates/includes/week.html b/panikweb_templates/templates/includes/week.html
index 82501fa..68d3651 100644
--- a/panikweb_templates/templates/includes/week.html
+++ b/panikweb_templates/templates/includes/week.html
@@ -11,17 +11,17 @@
 </div>
 {% endif %}
 {% if not fragment or fragment = "program" %}
-<div id="weekProgramContent-{{ week|slugify }}" class="program wrapper">
+<div id="weekProgramContent-{{ week|slugify }}" class="program">
 
 	{% for day in days %}
-	<div data-tabbed="true" class="content padded" id="Program-week-{{ day.datetime|slugify }}">
+	<div data-tabbed="true" class="content" id="Program-week-{{ day.datetime|slugify }}">
 		<ul class="custom program-week list">
 		{% with day.cells as cells %}
 			{% regroup cells by datetime|date:"H:i" as time_list %}
 			{% if time_list %}
 				{% for cell in time_list %}
 					<li class="cf {% if cell.list|dictsort:"label" %}nonStop{% endif %}">
-						<div class="programDate"><spanc class="label">{{ cell.grouper }}</span></div>
+						<div class="programDate"><strong>{{ cell.grouper }}</strong></div>
 
 						<div class="programCell">
 						{% for cell in cell.list %}
diff --git a/panikweb_templates/templates/news/inline.html b/panikweb_templates/templates/news/inline.html
index 638172f..810a6ae 100644
--- a/panikweb_templates/templates/news/inline.html
+++ b/panikweb_templates/templates/news/inline.html
@@ -1,14 +1,16 @@
 {% load thumbnails %}
 {% load staticfiles %}
-<div class="content content-inline inline cf {{ class }}">
+<div class="content content-inline {% if class != "special" %}inline{% endif %} cf {{ class }}">
 	<a class="block cf" href="{% url 'news-view' slug=content.slug %}">
+		<div class="logo">
 		{% if class == "special" and content.image %}
-			<img class="logo" src="{{ content.image|thumbnail:'320x240' }}"/>	
+			<img class="nomal" src="{{ content.image|thumbnail:'320x240' }}"/>	
 		{% elif content.image %}	
-			<img class="logo left" src="{{ content.image|thumbnail:'60x60' }}"/>	
+			<img class="left" src="{{ content.image|thumbnail:'60x60' }}"/>	
 		{% else %}
-			<img class="logo left" width="60" height="60" src="{% static "img/defaultLogo.png" %}"/>
+			<img class="left" width="60" height="60" src="{% static "img/defaultLogo.png" %}"/>
 		{% endif %}
+		</div>
 		{% if content.date %}
 			<div class="smooth {% if class == "special" %}center marged {% endif %}">{{ content.date|date:"D m/M"|lower }}</div>
 		{% endif %}
diff --git a/panikweb_templates/templates/program.html b/panikweb_templates/templates/program.html
index ac12376..8d24a93 100644
--- a/panikweb_templates/templates/program.html
+++ b/panikweb_templates/templates/program.html
@@ -5,7 +5,7 @@
 {% block nav %}
 	{% emission_nav with klass="program" %}
 <div class="wrapper">
-	<div class="program ">
+	<div class="program marged">
 		<nav class="center">
 			<ul class="custom distributed">
 				{% if previous_week_no %}
@@ -30,5 +30,9 @@
 </div>
 {% endblock %}
 {% block main %}
+<div class="wrapper">
+	<div class="program marged">
 	{% weekview year=year week=week fragment="program" %}
+	</div>
+</div>
 {% endblock %}
diff --git a/panikweb_templates/templates/search/search.html b/panikweb_templates/templates/search/search.html
index 18eb849..b3339d6 100644
--- a/panikweb_templates/templates/search/search.html
+++ b/panikweb_templates/templates/search/search.html
@@ -4,7 +4,7 @@
 {% block bodyID %}Search{% endblock %}
 {% block title %}Recherche{% endblock %}
 {% block nav %}	
-<div class="padded search">
+<div class="search">
     <form method="get" action="." class="big center" id="search-form">
             {{ form.as_table }}<button class="icon-search"></button>
     </form>
@@ -54,9 +54,9 @@
 {% block main %}
 	{% if query %}
 <div class="wrapper">
-	<div class="padded">
+	<div class="marged">
 		{% if not page.object_list %}
-			<div class="big error padded center">Sorry, no result with your query!</div>
+			<div class="big error center">Sorry, no result with your query!</div>
 		{% endif %}
 		{% if page.has_previous %}
 			<div class="previous-page cf">
@@ -64,7 +64,7 @@
 			</div>
 		{% endif %}
 
-		<ul id="search-results" class="list columns padded cf">
+		<ul id="search-results" class="custom list columns cf padded">
 
 
 		{% for result in page.object_list %}
diff --git a/panikweb_templates/templates/week.html b/panikweb_templates/templates/week.html
index 5bf8a4b..8494112 100644
--- a/panikweb_templates/templates/week.html
+++ b/panikweb_templates/templates/week.html
@@ -26,5 +26,9 @@
 	{% weekview year=year week=week fragment="nav" %}
 {% endblock %}
 {% block main %}
-	{% weekview year=year week=week fragment="program" %}
+<div class="padded">
+	<div class="wrapper">
+		{% weekview year=year week=week fragment="program" %}
+	</div>
+</div>
 {% endblock %}
-- 
2.39.2