Allow displaying event details

calsocial/templates/event-details.html

@@ -0,0 +1,14 @@
+{% extends 'base.html' %}
+
+{% block content %}
+<h1>
+    {{ event.title }}<br>
+    <small>
+        {{ event.start_time_for_user(current_user) }}–{{ event.end_time_for_user(current_user) }}
+    {% if current_user.timezone | string != event.time_zone %}
+        ({{ event.start_time_tz }}–{{ event.end_time_tz }} {{ event.time_zone }})
+    {% endif %}
+    </small>
+</h1>
+{{ event.description }}
+{% endblock %}

calsocial/templates/month-view.html

@@ -47,7 +47,10 @@
      background-color: #d8d8d8;
  }
 
- tr.week > td > div.event {
+ tr.week > td > a.event {
+     display: block;
+     color: black;
+     text-decoration: none;
      border: 1px solid green;
      background-color: white;
      border-radius: 2px;
@@ -118,10 +121,10 @@
             <td class="{% if day.month != calendar.timestamp.month %} other-month{% endif %}{% if day.date() == now.date() %} today{% endif %}">
                 <span class="day-num">{{ day.day }}</span>
     {% for event in calendar.day_events(day, user=current_user) %}
-                <div class="event">
+                <a href="{{ url_for('event_details', event_id=event.id) }}" class="event">
                     {{ event.start_time_for_user(current_user).strftime('%H:%M') }}–{{ event.end_time_for_user(current_user).strftime('%H:%M') }}
                     {{ event.title }}
-                </div>
+                </a>
     {% endfor %}
             </td>
 {% endfor %}