Hi there, Just wanting to share a modification made on the lightning xpi : inverting colors between the event category and calendar.
Right now, all is hard coded. If someone want to improve this adding an option in the prefs, I just don't know how to do this... These modifications have to be done inside the file /chrome/calendar.jar What was done on : XML : allow usage of "calendar-id" or "categories" (cat name) on some DOM objects JS : inverting colors of "calendar-id" and "categories" CSS : minor tweaks (always display the border, refining appearance of selected events) PNG : stretched to 12px (instead of 8) ------------------------ Same results for SOGo core in second attached file. Same thing, all hardcoded, if someone want to help me adding this as an option, you're welcome :) Feel free to improve this ! Regards -- Vincent
diff --git a/content/calendar/calendar-month-view.xml b/content/calendar/calendar-month-view.xml
index 0853ade..ba69e18 100644
--- a/content/calendar/calendar-month-view.xml
+++ b/content/calendar/calendar-month-view.xml
@@ -61,7 +61,7 @@
<xul:hbox>
<xul:box anonid="event-container"
class="calendar-color-box"
- xbl:inherits="calendar-uri,calendar-id"
+ xbl:inherits="calendar-uri,calendar-id,categories"
flex="1">
<xul:box class="calendar-event-selection" orient="horizontal" flex="1">
<xul:stack anonid="eventbox"
@@ -102,7 +102,7 @@
class="item-classification-box"
pack="end"/>
</xul:hbox>
- <xul:calendar-category-box anonid="category-box" xbl:inherits="categories" pack="end"/>
+ <xul:calendar-category-box anonid="category-box" xbl:inherits="categories,calendar-id" pack="end"/>
</xul:stack>
</xul:hbox>
<xul:image anonid="gradient"
diff --git a/content/calendar/calendar-multiday-view.xml b/content/calendar/calendar-multiday-view.xml
index 7e375a7..40f2bc6 100644
--- a/content/calendar/calendar-multiday-view.xml
+++ b/content/calendar/calendar-multiday-view.xml
@@ -2143,7 +2143,7 @@
class="item-classification-box"
pack="end"/>
</xul:hbox>
- <xul:calendar-category-box anonid="category-box" xbl:inherits="categories" pack="end" />
+ <xul:calendar-category-box anonid="category-box" xbl:inherits="categories,calendar-id" pack="end" />
</xul:stack>
<xul:box xbl:inherits="orient">
<xul:calendar-event-gripbar anonid="gripbar1"
diff --git a/content/calendar/calendar-view-core.xml b/content/calendar/calendar-view-core.xml
index 448ee4a..6372bb0 100644
--- a/content/calendar/calendar-view-core.xml
+++ b/content/calendar/calendar-view-core.xml
@@ -56,7 +56,7 @@
<xul:hbox>
<xul:box anonid="event-container"
class="calendar-color-box"
- xbl:inherits="calendar-uri,calendar-id"
+ xbl:inherits="calendar-uri,calendar-id,categories"
flex="1">
<xul:box class="calendar-event-selection" orient="horizontal" flex="1">
<xul:stack anonid="eventbox"
@@ -81,7 +81,7 @@
</xul:vbox>
<xul:stack>
<xul:calendar-category-box anonid="category-box"
- xbl:inherits="categories"
+ xbl:inherits="categories,calendar-id"
pack="end"/>
<xul:hbox anonid="alarm-icons-box"
class="alarm-icons-box"
@@ -401,7 +401,7 @@
<content>
<xul:vbox anonid="category-box"
class="category-color-box calendar-event-selection"
- xbl:inherits="categories">
+ xbl:inherits="categories,calendar-id">
<xul:hbox flex="1">
<xul:image class="calendar-category-box-gradient" height="1"/>
</xul:hbox>
diff --git a/content/calendar/calendar-views.js b/content/calendar/calendar-views.js
index c2b4490..17b75e2 100644
--- a/content/calendar/calendar-views.js
+++ b/content/calendar/calendar-views.js
@@ -512,7 +512,7 @@ function updateStyleSheetForViews(aCalendar) {
if (!(aCalendar.id in ruleCache)) {
// We haven't create a rule for this calendar yet, do so now.
let sheet = getViewStyleSheet();
- let ruleString = '.calendar-color-box[calendar-id="' + aCalendar.id + '"] {} ';
+ let ruleString = '.category-color-box[calendar-id="' + aCalendar.id + '"] {} ';
let ruleIndex = sheet.insertRule(ruleString, sheet.cssRules.length);
ruleCache[aCalendar.id] = sheet.cssRules[ruleIndex];
@@ -592,7 +592,7 @@ var categoryManagement = {
if (!(aCatName in this.categoryStyleCache)) {
// We haven't created a rule for this category yet, do so now.
let sheet = getViewStyleSheet();
- let ruleString = '.category-color-box[categories~="' + aCatName + '"] {} ';
+ let ruleString = '.calendar-color-box[categories~="' + aCatName + '"] {} ';
let ruleIndex = sheet.insertRule(ruleString, sheet.cssRules.length);
this.categoryStyleCache[aCatName] = sheet.cssRules[ruleIndex];
diff --git a/skin/calendar/calendar-views.css b/skin/calendar/calendar-views.css
index b2e6cd9..d5ba5b3 100644
--- a/skin/calendar/calendar-views.css
+++ b/skin/calendar/calendar-views.css
@@ -43,9 +43,6 @@
* ***** END LICENSE BLOCK ***** */
/* Core */
-calendar-category-box:not([categories]) {
- display: none;
-}
.calendar-item-image {
list-style-image: url(chrome://calendar/skin/day-box-item-image.png);
@@ -199,8 +196,13 @@ calendar-header-container[weekend="true"][selected="true"],
margin: 1px;
}
+.calendar-event-box-container:not([categories]) {
+ background-color: #ACACAC;
+}
+
.calendar-event-box-container[categories] {
-moz-margin-end: 0px;
+ margin: 1px;
}
.calendar-event-details {
@@ -233,7 +235,7 @@ calendar-event-box[selected="true"] {
border-bottom: 1px solid #727272;
}
-calendar-event-box[selected="true"] .calendar-event-selection {
+calendar-event-box[selected="true"] .calendar-event-box-container .calendar-event-selection {
color: #000000 !important;
background-color: #ffdb67 !important;
}
@@ -444,7 +446,7 @@ calendar-month-day-box-item {
padding: 0px 1px;
}
-calendar-month-day-box-item[selected="true"] .calendar-event-selection {
+calendar-month-day-box-item[selected="true"] .calendar-event-box-container .calendar-event-selection {
color: #000000 !important;
background-color: #ffdb67 !important;
}
@@ -468,7 +470,7 @@ calendar-month-day-box-item[selected="true"] .calendar-event-selection {
border-bottom: 1px solid #D2D2D2;
}
-calendar-editable-item[selected="true"] .calendar-event-selection {
+calendar-editable-item[selected="true"] .calendar-event-box-container .calendar-event-selection {
color: #000000 !important;
background-color: #ffdb67 !important;
}
diff --git a/skin/calendar/category-overlay.png b/skin/calendar/category-overlay.png
index d44fb60..bb5f306 100644
Binary files a/skin/calendar/category-overlay.png and b/skin/calendar/category-overlay.png differ
diff --git a/Templates/SchedulerUI/UIxCalendarSelector.wox b/Templates/SchedulerUI/UIxCalendarSelector.wox
index 33e935c..e94631e 100644
--- a/Templates/SchedulerUI/UIxCalendarSelector.wox
+++ b/Templates/SchedulerUI/UIxCalendarSelector.wox
@@ -9,7 +9,7 @@
<style type="text/css">
<var:foreach list="calendars" item="currentCalendar">
.calendarFolder<var:string value="currentCalendar.folder" />
-{ background-color: <var:string value="currentCalendar.color" /> !important; color: <var:string value="contrastingTextColor" /> !important; }
+{ background-color: <var:string value="currentCalendar.color" /> !important; color: <var:string value="contrastingTextColor" /> !important; border-right: 8px solid <var:string value="currentCalendar.color" />; }
div.colorBox.calendarFolder<var:string value="currentCalendar.folder" />
{ color: <var:string value="currentCalendar.color" /> !important; }
</var:foreach>
diff --git a/WebServerResources/SchedulerUI.js b/WebServerResources/SchedulerUI.js
index 668b5e4..7600285 100644
--- a/WebServerResources/SchedulerUI.js
+++ b/WebServerResources/SchedulerUI.js
@@ -1392,7 +1392,7 @@ function resetCategoriesStyles() {
categoriesStyles.keys().each(function(category) {
var color = UserDefaults['SOGoCalendarCategoriesColors'][category];
if (color) {
- rules[rules.length] = '{ border-right: 8px solid ' + color + '; }';
+ rules[rules.length] = '{ background-color: ' + color + '!important; }';
selectors[selectors.length] = 'DIV.' + categoriesStyles.get(category);
}
});
signature.asc
Description: OpenPGP digital signature
