Kontakt-Modul

frontend/css/calendar.css

@@ -586,34 +586,46 @@
   text-overflow: ellipsis;
 }
 
-/* Week view multi-day task range styles */
+/* Week view multi-day task range styles - continuous bars like month view */
 .calendar-week-task.has-range {
+  border-radius: 0;
+  /* Extend beyond cell boundaries for seamless connection */
+  margin-left: calc(-1 * var(--spacing-3));
+  margin-right: calc(-1 * var(--spacing-3));
+  padding: 4px var(--spacing-3);
+  /* Fixed height for consistent bar thickness */
+  height: 24px;
+  box-sizing: border-box;
+  line-height: 16px;
+  /* Transparent border for middle/end - color set via inline style on start */
+  border-left: 3px solid transparent;
   position: relative;
 }
 
-.calendar-week-task.has-range.range-start::after {
-  content: '▶';
-  position: absolute;
-  right: 8px;
-  top: 50%;
-  transform: translateY(-50%);
-  font-size: 8px;
-  color: var(--text-tertiary);
+.calendar-week-task.has-range.range-start {
+  border-radius: var(--radius-sm) 0 0 var(--radius-sm);
+  /* Start doesn't extend left into previous cell */
+  margin-left: 0;
+  /* Compensate for width difference */
+  padding-left: calc(var(--spacing-3) + 3px);
+  /* Border color set via inline style */
 }
 
-.calendar-week-task.has-range.range-end::after {
-  content: '◀';
-  position: absolute;
-  left: 28px;
-  top: 50%;
-  transform: translateY(-50%);
-  font-size: 8px;
-  color: var(--text-tertiary);
+.calendar-week-task.has-range.range-end {
+  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
+  /* End doesn't extend right into next cell */
+  margin-right: 0;
+  padding-right: calc(var(--spacing-3) + 3px);
 }
 
-.calendar-week-task.has-range.range-middle {
-  opacity: 0.7;
-  background: var(--bg-hover);
+.calendar-week-task.has-range.range-middle:empty {
+  /* Hide empty middle segments that have no content */
+  opacity: 0.3;
+}
+
+.calendar-week-task.has-range.range-middle:not(:empty) {
+  /* Show middle segments that have content (first day of week) */
+  opacity: 1;
 }
 
 /* Week Add Task Button */
@@ -635,6 +647,42 @@
   color: var(--primary);
 }
 
+/* ========================================
+   REMINDER ITEMS
+   ======================================== */
+
+.calendar-reminder-item {
+  position: relative;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  cursor: pointer;
+}
+
+.calendar-reminder-bell {
+  position: absolute;
+  right: 2px;
+  top: 50%;
+  transform: translateY(-50%);
+  font-size: 10px;
+  line-height: 1;
+  pointer-events: none;
+}
+
+/* Week view reminder styling */
+.calendar-week-task.calendar-reminder-item {
+  padding-right: 20px; /* Space for bell icon */
+}
+
+.calendar-week-task.calendar-reminder-item .calendar-reminder-bell {
+  font-size: 12px;
+}
+
+/* Month view reminder styling */
+.calendar-task.calendar-reminder-item {
+  padding-right: 16px; /* Space for bell icon */
+}
+
 /* ========================================
    DAY DETAIL POPUP
    ======================================== */