From 542950606b5eee41d01ec8aeb9113ccff86f6c7a Mon Sep 17 00:00:00 2001
From: Bob Mottram <bob@freedombone.net>
Date: Fri, 11 Oct 2019 12:31:29 +0100
Subject: [PATCH] Show dots representing calendar events

---
 epicyon-calendar.css | 42 +++++++++++++++++++++++++++++++++---------
 webinterface.py      | 13 +++++++------
 2 files changed, 40 insertions(+), 15 deletions(-)

diff --git a/epicyon-calendar.css b/epicyon-calendar.css
index e48e238ba..4e1cc8034 100644
--- a/epicyon-calendar.css
+++ b/epicyon-calendar.css
@@ -1,14 +1,13 @@
 :root {
     --main-bg-color: #282c37;
-    --calendar-bg-color: #2f333e;
-    --lines-color: darkgray;
-    --day-number: #a4a2a2;
-    --day-number2: #c9c7c7;
+    --calendar-bg-color: #eee;
+    --lines-color: black;
+    --day-number: black;
+    --day-number2: red;
     --today-foreground: white;
-    --today-circle: yellow;
-    --event-foreground: #111;
-    --title-text: #F6E9DC:
-    --title-background: #4E4F4A:
+    --today-circle: red;
+    --event-background: orange;
+    --event-foreground:white;
 }
 
 body {
@@ -95,10 +94,23 @@ tr:nth-child(even) > .calendar__day__cell:nth-child(even) {
 }
 
 .calendar__day__cell[data-event] {
-    background-color: var(--lines-color);
+    background-color: var(--event-background);
     color: var(--event-foreground);
 }
 
+.calendar__day__cell[data-event]:after {
+    content: attr(data-event);
+    color: var(--day-number);
+    display: block;
+    font-weight: 400;
+    font-size: 5rem;
+    position: absolute;
+    bottom: 0;
+    width: 100%;
+    height: 5rem;
+    text-transform: uppercase;
+}
+
 .calendar__day__cell[data-today] {
     border-radius: 50%;
     border: 4px solid var(--today-circle);
@@ -113,3 +125,15 @@ tr:nth-child(even) > .calendar__day__cell:nth-child(even) {
     color: var(--event-foreground);
     text-align: center;
 }
+.calendar__day__cell[data-today-event]:after {
+    content: attr(data-event);
+    color: var(--day-number);
+    display: block;
+    font-weight: 400;
+    font-size: 5rem;
+    position: absolute;
+    bottom: 0;
+    width: 100%;
+    height: 5rem;
+    text-transform: uppercase;
+}
diff --git a/webinterface.py b/webinterface.py
index 5f3b18b75..d60fd219e 100644
--- a/webinterface.py
+++ b/webinterface.py
@@ -2895,14 +2895,15 @@ def htmlCalendar(translate: {}, \
                     if currDate.month==monthNumber:
                         if dayOfMonth==currDate.day:
                             isToday=True
-                if dayOfMonth==5:
-                    events['5']=[{"test": 1},{"test2": 2},{"test3": 3},{"test4": 4}]
+                if dayOfMonth==11:
+                    events[str(dayOfMonth)]=[{"test": 1},{"test2": 2},{"test3": 3},{"test4": 4}]
                 if events.get(str(dayOfMonth)):
                     eventDots=''
-                    for i in range(1,len(events[str(dayOfMonth)])):
-                        eventDots+='.'
-                        if eventDots=='...':
-                            break
+                    if len(events[str(dayOfMonth)])>1:
+                        for ev in events[str(dayOfMonth)]:
+                            eventDots+='.'
+                            if eventDots=='...':
+                                break
                     # there are events for this day
                     if not isToday:
                         calendarStr+='    <td class="calendar__day__cell" data-event="'+eventDots+'">'+str(dayOfMonth)+'</td>\n'