LupusNobilis
/
sogo
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

fix(calendar(css)): enlarge categories color stripes 

Fixes #5301
snyk-upgrade-0ec09bc7ae34af7c5d0348d49696b8f1
Francis Lachapelle 2021-04-21 14:12:14 -04:00
parent 66afbd2172
commit bd80b6ea75
5 changed files with 45 additions and 39 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
UI/WebServerResources/js/Scheduler/sgCalendarDayBlock.directive.js
View File

@ -44,14 +44,14 @@
// Categories color stripes
' <div class="sg-category" ng-repeat="category in '+p+'block.component.categories"',
' ng-class="'+p+'(\'bg-category\' + category)"',
' ng-style="'+p+'{ right: ($index * 3) + \'px\' }"></div>',
' ng-style="'+p+'{ right: ($index * 10) + \'%\' }"></div>',
' <div class="text">',
// Priority
' <span ng-show="'+p+'block.component.c_priority" class="sg-priority">{{'+p+'block.component.c_priority}}</span>',
// Summary
' {{ '+p+'block.component.summary }}',
// Icons
' <span class="icons">',
' <span class="sg-icons">',
// Component is reccurent
' <md-icon ng-if="'+p+'block.component.occurrenceId">repeat</md-icon>',
// Component has an alarm

6
UI/WebServerResources/js/Scheduler/sgCalendarListEvent.directive.js
View File

@ -39,12 +39,13 @@
// Categories color stripes
' <div class="sg-category" ng-repeat="category in ::component.categories"',
' ng-class="::(\'bg-category\' + category)"',
' ng-style="::{ right: ($index * 3) + \'px\' }"></div>',
' ng-style="::{ right: ($index * 10) + \'%\' }"></div>',
' <div class="text">',
// Priority
' <span ng-show="::component.c_priority" class="sg-priority" ng-bind="::component.c_priority"></span>',
// Summary
' {{ ::component.c_title }}',
' <span class="icons">',
' <span class="sg-icons">',
// Component is reccurent
' <md-icon ng-if="::component.occurrenceId">repeat</md-icon>',
// Component has an alarm
@ -62,6 +63,7 @@
' <div class="secondary" ng-if="::component.c_location">',
' <md-icon>place</md-icon> <span ng-bind="::component.c_location"></span>',
' </div>',
' </div>',
'</div>'
].join('');
}

45
UI/WebServerResources/js/Scheduler/sgCalendarMonthEvent.directive.js
View File

@ -32,28 +32,31 @@
return [
'<div class="sg-event"',
// Add a class while dragging
' ng-class="{\'sg-event--dragging\': block.dragging}"',
' ng-click="clickBlock({clickEvent: $event, clickComponent: block.component})">',
// Categories color stripes
// Add a class while dragging
' ng-class="{\'sg-event--dragging\': block.dragging}"',
' ng-click="clickBlock({clickEvent: $event, clickComponent: block.component})">',
// Categories color stripes
' <div class="sg-category" ng-repeat="category in '+p+'block.component.categories"',
' ng-class="'+p+'(\'bg-category\' + category)"',
' ng-style="'+p+'{ right: ($index * 3) + \'px\' }"></div>',
' <span class="secondary" ng-if="'+p+'(!block.component.c_isallday && block.isFirst)">{{ '+p+'block.component.startHour }}</span>',
// Priority
' <span ng-show="'+p+'block.component.c_priority" class="sg-priority">{{'+p+'block.component.c_priority}}</span>',
// Summary
' {{ '+p+'block.component.summary }}',
' <span class="icons">',
// Component is reccurent
' <md-icon ng-if="'+p+'block.component.occurrenceId">repeat</md-icon>',
// Component has an alarm
' <md-icon ng-if="'+p+'block.component.c_nextalarm">alarm</md-icon>',
// Component is confidential
' <md-icon ng-if="'+p+'block.component.c_classification == 2">visibility_off</md-icon>',
// Component is private
' <md-icon ng-if="'+p+'block.component.c_classification == 1">vpn_key</md-icon>',
' </span>',
' ng-class="'+p+'(\'bg-category\' + category)"',
' ng-style="'+p+'{ right: ($index * 10) + \'%\' }"></div>',
' <div class="text">',
// Start hour
' <span class="secondary" ng-if="'+p+'(!block.component.c_isallday && block.isFirst)">{{ '+p+'block.component.startHour }}</span>',
// Priority
' <span ng-show="'+p+'block.component.c_priority" class="sg-priority">{{'+p+'block.component.c_priority}}</span>',
// Summary
' {{ '+p+'block.component.summary }}',
' <span class="sg-icons">',
// Component is reccurent
' <md-icon ng-if="'+p+'block.component.occurrenceId">repeat</md-icon>',
// Component has an alarm
' <md-icon ng-if="'+p+'block.component.c_nextalarm">alarm</md-icon>',
// Component is confidential
' <md-icon ng-if="'+p+'block.component.c_classification == 2">visibility_off</md-icon>',
// Component is private
' <md-icon ng-if="'+p+'block.component.c_classification == 1">vpn_key</md-icon>',
' </span>',
' </div>',
'</div>'
].join('');
}

3
UI/WebServerResources/scss/core/structure.scss
View File

@ -37,7 +37,8 @@ html * {
position: absolute;
top: 0;
bottom: 0;
width: 3px;
width: 10%;
z-index: $z-index-view;
}
// Group fields of a form

26
UI/WebServerResources/scss/views/SchedulerUI.scss
View File

@ -376,6 +376,16 @@ $quarter_height: 10px;
.eventInside {
overflow: hidden;
.text {
position: absolute;
top: 3px;
left: 1%;
right: 1%;
bottom: 3px;
margin: 0 2px;
overflow: hidden;
line-height: $sg-font-size-2;
}
}
.material-icons {
@ -384,7 +394,7 @@ $quarter_height: 10px;
min-width: $sg-font-size-2;
}
.icons md-icon {
.sg-icons md-icon {
float: right;
}
@ -533,10 +543,6 @@ $quarter_height: 10px;
overflow: auto;
}
}
.text {
position: relative;
overflow: auto;
}
}
// Multicolumn day cell that contains the calendar name
@ -651,14 +657,8 @@ $quarter_height: 10px;
}
.text {
position: absolute;
top: 3px;
left: 1%;
right: 1%;
bottom: 3px;
margin: 0 2px;
overflow: hidden;
line-height: $sg-font-size-2;
position: relative;
z-index: $z-index-view + 1;
}
.gradient > IMG {