A few layout/UI tweaks, including the use of yui3 grids instead of CSS3's multi-column layout.

3 files changed, 31 insertions, 28 deletions

diff --git a/templates/base.html b/templates/base.html
index c16f020..9f09b59 100644
--- a/templates/base.html
+++ b/templates/base.html
@@ -5,6 +5,8 @@
   <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
   <title>{% block title %}Patchwork{% endblock %}</title>
   <link rel="stylesheet" type="text/css" href="/css/patchmetrics.css"/>
+  <link rel="stylesheet" type="text/css"
+    href="http://yui.yahooapis.com/3.3.0/build/cssgrids/grids-min.css">
   <script language="JavaScript" type="text/javascript" src="/js/common.js">
   </script>
 {% block headers %}{% endblock %}
diff --git a/templates/patchmetrics/frontpage.html b/templates/patchmetrics/frontpage.html
index f5b911c..33d9160 100644
--- a/templates/patchmetrics/frontpage.html
+++ b/templates/patchmetrics/frontpage.html
@@ -18,7 +18,7 @@
 
 {% block body %}
 
-<h2>Statistics for patches submitted up to the end of {{month}}</h2>
+<h2>Statistics for patches submitted upstream by Linaro engineers</h2>
 
 <p><strong>{{submitted_on_month}}</strong> patches were submitted in
 {{month}}, and <strong>{{submitted_and_accepted_on_month}}</strong>
@@ -28,37 +28,28 @@ of those have already been accepted upstream.</p>
 patches submitted in previous months that were accepted upstream in {{month}}.
 </p>
 
-<p>At the end of {{month}} we had <strong>{{total_accepted}}</strong> patches
+<p>We now have a total of <strong>{{total_accepted}}</strong> patches
 accepted upstream and <strong>{{waiting_for_feedback}}</strong> patches
 waiting for feedback, with
 <strong>{{more_than_30_days_old_waiting_for_feedback}}</strong> of those being
 older than 30 days.</p>
 
-<!-- XXX: Using a table instead of CSS3's multi-column thing because of
-          http://code.google.com/p/chromium/issues/detail?id=86504 -->
-<table>
-  <tr>
-    <td style="padding-right: 8em; text-align: center">
-      <strong>Patches per month</strong>
-      {{patches_per_month_chart|safe}}
-    </td>
-    <td style="text-align: center">
-      <strong>Patch age distribution</strong><br />
+<div class="yui3-g">
+  <div class="yui3-u-1-2">
+    <p ><strong>Patches per month</strong></p>
+    {{patches_per_month_chart|safe}}
+  </div>
+  <div class="yui3-u-1-2">
+    <p>
+      <strong>Patch age distribution</strong>
       <span>(in days; only patches waiting for feedback)</span>
-      {{patch_age_distribution_chart|safe}}
-    </td>
-  </tr>
-</table>
-
-<p>&nbsp;</p>
-<p>Check the <a href="{% url patchmetrics.views.faq %}">FAQ</a> for answers to
-common questions.</p>
+    </p>
+    {{patch_age_distribution_chart|safe}}
+  </div>
+</div>
 
-<div class="twocol">
-  <!-- Force a minimun height for our divs or else they will all be
-       constrained by the height of the smaller one (this is a courtesy of
-       CSS3's multi-col thing). -->
-  <div style="line-height: 2; min-height: 20em" class="break-after">
+<div class="yui3-g">
+  <div class="yui3-u-5-12" style="line-height: 2">
     <h3>Stats per project</h3>
     {% for p in projects %}
       <a href="{% url patchmetrics.views.project project_id=p.linkname %}"
@@ -67,7 +58,9 @@ common questions.</p>
     {% endfor %}
   </div>
 
-  <div style="line-height: 2; min-height: 20em">
+  <div class="yui3-u-1-12"></div>
+
+  <div class="yui3-u-5-12" style="line-height: 2">
     <h3>Stats per team</h3>
     {% for team in teams %}
       <a href="{% url patchmetrics.views.team team_id=team.name %}"
@@ -75,7 +68,10 @@ common questions.</p>
       {% if not forloop.last %}&nbsp;|&nbsp;{% endif %}
     {% endfor %}
   </div>
-
 </div>
 
+<br />
+<p>Check the <a href="{% url patchmetrics.views.faq %}">FAQ</a> for answers to
+common questions.</p>
+
 {% endblock %}
diff --git a/templates/patchwork/patch.html b/templates/patchwork/patch.html
index 25c9962..3c52e61 100644
--- a/templates/patchwork/patch.html
+++ b/templates/patchwork/patch.html
@@ -3,9 +3,10 @@
 {% load syntax %}
 {% load person %}
 {% load patch %}
+{% load truncate %}
 
 {% block title %}{{patch.name}}{% endblock %}
-{% block heading %}{{patch.name}}{%endblock%}
+{% block heading %}{{patch.name|truncate:70}}{%endblock%}
 
 {% block body %}
 <script language="JavaScript" type="text/javascript">
@@ -33,6 +34,10 @@ function toggle_headers(link_id, headers_id)
   <td>{{ patch.submitter|personify }}</td></tr>
  </tr>
  <tr>
+  <th>Subject</th>
+  <td>{{ patch.name }}</td></tr>
+ </tr>
+ <tr>
   <th>Date</th>
   <td>{{ patch.date }}</td>
  </tr>