Highlight empty slots in calendar

assets/tailwind.css

@@ -42,21 +42,22 @@ footer a:hover {
     cursor: pointer;
 }
 
-a.currentShow {
+.currentShow {
     background-color: theme('colors.aura.purple');
     border-color: theme('colors.indigo.800');
     color: white;
 }
 
-.conflict {
+.conflict,
+.currentShow.emptySlot{
     background-color: theme('colors.red.600');
     border-color: theme('colors.red.800');
     color: white;
 }
 
 .noconflict {
-    background-color: theme('colors.aura.purple');
-    border-color: theme('colors.indigo.800');
+    background-color: theme('colors.aura.purple') !important;
+    border-color: theme('colors.indigo.800') !important;
     color: white;
 }
 

src/Pages/EmissionManager.vue

@@ -549,17 +549,21 @@
             loadCalendarSlots() {
                 this.calendarSlots = []
                 for (let i in this.timeslots) {
+                    const isEmpty = !this.timeslots[i].playlist_id;
+                    let emptyText = '';
                     let highlighting = 'otherShow'
 
                     if (this.timeslots[i].show === this.selectedShow.id) {
-                        highlighting = 'currentShow'
+                        highlighting = 'currentShow '
+                        highlighting +=  isEmpty ? 'emptySlot' : ''
+                        emptyText = isEmpty ? this.$t('calendar.empty') : ''
                     }
 
                     this.calendarSlots.push({
                         id: this.timeslots[i].id,
                         start: this.timeslots[i].start,
                         end: this.timeslots[i].end,
-                        title: this.getShowTitleById(this.timeslots[i].show),
+                        title: this.getShowTitleById(this.timeslots[i].show) + `\n${emptyText}`,
                         className: highlighting
                     })
                 }

src/i18n/de.js

@@ -407,6 +407,7 @@ export default {
 
     'calendar': {
         'today': 'Heute',
+        'empty': '(Keine Playlist!)'
     },
 
     // Etc

src/i18n/en.js

@@ -408,6 +408,7 @@ export default {
 
     'calendar': {
         'today': 'Today',
+        'empty': '(No playlist!)',
     },
 
     // Etc