Improve formatting on list.php

2 files changed, 38 insertions, 6 deletions

diff --git a/list.php b/list.php
index 90e6084..3210aff 100644
--- a/list.php
+++ b/list.php
@@ -16,6 +16,20 @@ function htmlid ($str)
 	return preg_replace ('/\W/','-',$str);
 }
 
+function format_date_range ($start,$end)
+{
+	$dates=date ('D j',$start);
+	if (date ('Y',$start) != date ('Y',$end))
+		$dates.=date (' M Y',$start).' to '.date ('j M',$end);
+	else if (date ('M',$start) != date ('M',$end))
+		$dates.=date (' M',$start).' to '.date ('j M',$end);
+	else
+		$dates.='–'.date ('j M',$end);
+	if (date ('Y') != date ('Y',$end))
+		$dates.=date (' Y',$end);
+	return $dates;
+}
+
 $selected_keywords=isset ($_GET['keywords']) ? explode(',',$_GET['keywords']) : null;
 
 $keywords=get_keywords();
@@ -48,14 +62,19 @@ if (isset ($_GET['keywords']) && count ($_GET['keywords']) != count ($keywords))
 </tr>
 <?php
 $events=is_null ($selected_keywords) ? get_events() : get_events ($selected_keywords);
+$last_month=null;
 foreach ($events as $event){
-	echo '<tr>';
-	echo '<td>'.date ('D j M Y',strtotime ($event['start_date']));
-	if ($event['end_date']!=$event['start_date'])
-		echo ' to '.date ('j M',strtotime ($event['end_date']));
-	echo '</td>';
+	$start_date=strtotime ($event['start_date']);
+	$end_date=strtotime ($event['end_date']);
+
+	$month=date ('m',$start_date);
+	echo $month==$last_month ? '<tr>' : '<tr class="new-month">';
+	$last_month=$month;
+
+	echo '<td>'.format_date_range ($start_date,$end_date).'</td>';
 	echo '<td>'.htmlspecialchars ($event['location']).'</td>';
-	echo '<td><span class="title-link" title="Click for details" onclick="expand_or_collapse(this,'.$event['id'].');">'.htmlspecialchars ($event['title']).'</span></td>';
+	echo '<td class="large"><span class="title-link" title="Click for details" onclick="expand_or_collapse(this,'.$event['id'].');">'.htmlspecialchars ($event['title']).'</span></td>';
+
 	foreach ($event['keywords'] as $i => $kw){
 		if (!is_null ($selected_keywords) && !in_array ($kw,$selected_keywords))
 			$event['keywords'][$i]='<span class="filtered-keyword">'.htmlspecialchars ($kw).'</span>';
@@ -63,6 +82,7 @@ foreach ($events as $event){
 			$event['keywords'][$i]=htmlspecialchars ($kw);
 	}
 	echo '<td>'.implode (', ',$event['keywords']).'</td>';
+
 	echo '</tr>';
 }
 ?>
diff --git a/style.css b/style.css
index d9ad143..647250e 100644
--- a/style.css
+++ b/style.css
@@ -14,12 +14,24 @@ tr:first-child {
 	border-bottom: 1px solid black;
 }
 
+tr.new-month {
+	border-top: 1px dotted #888;
+}
+
 th, td {
 	padding-right: 1em;
 	text-align: left;
 	vertical-align: top;
 }
 
+td {
+	font-size: 90%;
+}
+
+td.large {
+	font-size: initial;
+}
+
 .description {
 	font-size: 85%;
 }