grid: add classes and tags required by osp style

panikweb/views.py

@@ -129,6 +129,8 @@ class Grid(TemplateView):
 
         context['grid'] = grid
         context['times'] = times
+        context['weekdays'] = ['Lundi', 'Mardi', 'Mercredi', 'Jeudi',
+                'Vendredi', 'Samedi', 'Dimanche']
 
         return context
 

panikweb_templates/templates/grid.html

@@ -3,20 +3,76 @@
 
 {% block content %}
 
-<h2>Grille</h2>
+<style>
+    #grille table, #grille tr, #grille td {
+        text-align: center;
+        vertical-align: middle;
+    }
+    #grille .symbol {
+        font-size:40px;
+        width:100%;
+    }
+    #grille table {
+        border-top: 5px solid #D0D0D0;
+        border-left: 5px solid #D0D0D0;
+    }
+    #grille td {
+        border-bottom: 5px solid #D0D0D0;
+        border-right: 5px solid #D0D0D0;
+    }
+    #grille .heure {
+        -webkit-transform: rotate(-90deg);
+        -moz-transform: rotate(-90deg);
+        -ms-transform: rotate(-90deg);
+        -o-transform: rotate(-90deg);
+        filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
+        padding:20px 10px;
+        font-size:15px;
+    }
 
-<table border=1>
+    #grille .jour {
+        margin-top:20px;
+        margin-bottom:30px;
+        width: 100%;
+    }
+     #grille .continu, #grille .communautaire, #grille .mix, #grille .info {
+        font-family:Reglo;
+        text-transform:uppercase;
+        font-size:15px;
+        margin-bottom:10px;
+        line-height: 100%;
+    }
+
+    #grille td:hover {
+        cursor: pointer;
+        background-color: #D0D0D0;
+    }
+</style>
+
+
+<div id="grille">
+<table>
+<tbody>
+<tr>
+  <td><br/></td>
+  {% for weekday in weekdays %}
+    <td width="13%"><h3 class="jour">{{ weekday }}</h3></td>
+  {% endfor %}
+  <td><br/></td>
+</tr>
 {% for time_header, time_cells in times|zip:grid %}
 <tr>
-  <td>{{ time_header }}</td>
+  <td class="heure">{{ time_header }}</td>
   {% for cell in time_cells %}
   <td {% if cell.w > 1 %}colspan="{{cell.w}}"{% endif %}
       {% if cell.h > 1 %}rowspan="{{cell.h}}"{% endif %}>{{ cell }}</td>
   {% endfor %}
-  <td>{{ time_header }}</td>
+  <td class="heure">{{ time_header }}</td>
 </tr>
 {% endfor %}
+</tbody>
 </table>
+</div>
 
 
 {% endblock %}