diff --git a/UI/WebServerResources/js/Scheduler/sgCalendarDayBlock.directive.js b/UI/WebServerResources/js/Scheduler/sgCalendarDayBlock.directive.js
index 204a64631..8f976d43b 100644
--- a/UI/WebServerResources/js/Scheduler/sgCalendarDayBlock.directive.js
+++ b/UI/WebServerResources/js/Scheduler/sgCalendarDayBlock.directive.js
@@ -62,6 +62,12 @@
right -= 5;
}
+ // Add some padding (2%)
+ if (left === 0)
+ left = 2;
+ if (right === 0)
+ right = 2;
+
// Set position
iElement.css('left', left + '%');
iElement.css('right', right + '%');
diff --git a/UI/WebServerResources/js/Scheduler/sgCalendarMonthEvent.directive.js b/UI/WebServerResources/js/Scheduler/sgCalendarMonthEvent.directive.js
index d799a8509..54f25045c 100644
--- a/UI/WebServerResources/js/Scheduler/sgCalendarMonthEvent.directive.js
+++ b/UI/WebServerResources/js/Scheduler/sgCalendarMonthEvent.directive.js
@@ -28,9 +28,9 @@
' {{ block.starthour }} - ',
' {{ block.component.c_title }}',
' ',
- ' ',
- ' ',
- ' ',
+ ' ',
+ ' ',
+ ' ',
' ',
'
',
' ',
diff --git a/UI/WebServerResources/scss/views/SchedulerUI.scss b/UI/WebServerResources/scss/views/SchedulerUI.scss
index 46579d467..367305f97 100644
--- a/UI/WebServerResources/scss/views/SchedulerUI.scss
+++ b/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 & {