Revamped calendar basically there

To fix:
- Does not yet display events that span weeks correctly!
- Breaks (overflows) on mobile

RIGS/models.py

@@ -616,6 +616,9 @@ class Subhire(BaseEvent):
     def get_edit_url(self):
         return reverse('subhire_update', kwargs={'pk': self.pk})
 
+    def get_absolute_url(self):
+        return reverse('subhire_detail', kwargs={'pk': self.pk})
+
     @property
     def earliest_time(self):
         return find_earliest_event_time(self, [])

RIGS/templates/calendar.html

@@ -3,7 +3,6 @@
 
 {% block js %}
 <script src="{% static 'js/moment.js' %}"></script>
-<script src="{% static 'js/interaction.js' %}"></script>
 <script>
     $(document).ready(function() {
             // set some button listeners
@@ -25,6 +24,7 @@
 .week {
   display:grid;
   grid-template-columns: repeat(7, 1fr);
+  grid-auto-flow: dense;
   grid-gap: 2px 10px;
   border: 1px solid black;
   height: 8em;
@@ -71,7 +71,7 @@
 [data-span="6"] { grid-column-end: span 6; }
 [data-span="7"] { grid-column-end: span 7; }
 
-a {
+.day > a {
   color: inherit !important;
   text-decoration: inherit !important;
 }
@@ -112,7 +112,7 @@ a {
             {{ day.2|safe }}
         </div>
     {% else %}
-    <div class="day"><span style="grid-column: {{day.1}} + 1; grid-row: 1 / span 4;"><span></div>
+    <div class="day"><span style="grid-row-start: 1;">&nbsp;<span></div>
     {% endif %}
     {% endfor %}
 </div>

RIGS/utils.py

@@ -10,7 +10,7 @@ class Calendar(HTMLCalendar):
         super(Calendar, self).__init__()
 
     def get_html(self, day, event):
-        return f"<a href='{event.get_edit_url()}' class='modal-href' style='display: contents;'><div class='event event-start event-end bg-{event.color}' data-span='{event.length}' style='grid-column-start: {day[1]}'>{event}</div></a>"
+        return f"<a href='{event.get_absolute_url()}' class='modal-href' style='display: contents;'><div class='event event-start event-end bg-{event.color}' data-span='{event.length}' style='grid-column-start: calc({day[1]} + 1)'>{event}</div></a>"
 
     def formatmonth(self, withyear=True):
         events = Event.objects.filter(start_date__year=self.year, start_date__month=self.month)