Dashed lines before labeled hour-segments are not visible

[l0wlik34G6]

Describe the bug

Dashed line is not visible before labeled hour-segments (see screenshot)

I'm pretty sure, this does not fit every way of displaying the calendar, but for me it was ok:

   .cal-day-view .cal-hour:not(:last-child) .cal-hour-segment,
   .cal-day-view .cal-hour:last-child :not(:last-child) .cal-hour-segment {
+    z-index: 150;
+    position: relative;
     border-bottom: thin dashed; }
   .cal-day-view .cal-time {

   .cal-day-view .cal-event-container {
     position: absolute;
+    z-index: 200;
     cursor: pointer; }
     .cal-day-view .cal-event-container.resize-active {
-      z-index: 1;
+      z-index: 190;
       pointer-events: none; }
   .cal-day-view .cal-event {

     border-bottom-right-radius: 5px; }
   .cal-day-view .cal-drag-active {
-    z-index: 1; }
+    z-index: 190; }
     .cal-day-view .cal-drag-active * {
       pointer-events: none; }

Hopefully, I didn't forget any changes I made.

Screenshots

Before:

(to see the issue better, I changed the border color to black)

After:

Versions

• @angular/core: 7.2.13
• angular-calendar: 0.27.3
• Browser name and version: chrome 73.0

[matts-bot]

Thanks so much for opening an issue! If you'd like me to give priority to answering your issue or would just like to support this project, then please consider supporting me on Patreon

[mattlewis92]

I'm also unable to reproduce this as well, can you make a runnable stackblitz for this as well please? Thanks!

[l0wlik34G6]

Also here: https://stackblitz.com/edit/angular-calendar-952
:)

[mattlewis92]

Got it, thanks! Again it looks like another bootstrap issue

[mattlewis92]

Also fixed in 0.27.4 👍