(css) Improve Calendar views

UI/WebServerResources/scss/views/SchedulerUI.scss

@@ -13,6 +13,10 @@ $hours_margin: 50px;
   }
 }
 
+.allDays {
+  border-bottom: 1px solid sg-color($sogoPaper, 300);
+}
+
 .days {
   display: flex;
   flex-direction: row;
@@ -68,6 +72,20 @@ $hours_margin: 50px;
   }
 }
 
+.sg-event {
+  font-size: $sg-font-size-2;
+  &, md-icon {
+    color: #fff;
+  }
+  .material-icons {
+    font-size: $sg-font-size-2;
+  }
+  .allDays & {
+    margin: 2%; // See sgCalendarDayBlock.directive.js
+    line-height: initial;
+  }
+}
+
 .daysView {
   bottom: 0;
   overflow-x: hidden;
@@ -77,11 +95,11 @@ $hours_margin: 50px;
     position: relative;
   }
   .sg-event {
-    border-radius: 10px;
-    margin-right: 1px;
+    border-radius: 3px;
     position: absolute;
-    left: 0%;
-    right: 0%;
+    left: 0;
+    right: 0;
+    opacity: 0.9; // When events from a same calendar overlap, it creates a border to help distinguish the events
     overflow: hidden;
     $i: 0;
     @while $i < 96 { // number of 15-minutes blocks in a day
@@ -107,13 +125,12 @@ $hours_margin: 50px;
   }
   .sg-event {
     border-radius: 1px;
-    font-size: $sg-font-size-2;
     overflow: hidden;
     padding: 2px;
     margin-bottom: 1px;
     text-overflow: ellipsis;
     white-space: nowrap;
-    span {
+    span { // hours
       font-weight: $sg-font-light;
     }
   }
@@ -131,8 +148,8 @@ $hours_margin: 50px;
 .gradient, .text {
   position: absolute;
   top: 1px;
-  left: 1px;
-  right: 1px;
+  left: 4px;
+  right: 2px;
   bottom: 1px;
   overflow: hidden;
   .allDays & {