extern/egroupware
1
0
Fork 1
mirror of https://github.com/EGroupware/egroupware.git synced 2024-12-27 17:18:54 +01:00
Code Issues Packages Projects Releases Wiki Activity

Change regular (grid view) event styling

Browse Source
This commit is contained in:
Nathan Gray 2016-01-18 20:02:35 +00:00
parent f438940598
commit 57b955de9e
5 changed files with 16 additions and 45 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
calendar/js/et2_widget_daycol.js
View File

@ -804,13 +804,12 @@ var et2_calendar_daycol = et2_valueWidget.extend([et2_IDetachedDOM, et2_IResizea
{
// Calculate horizontal positioning
var left = Math.ceil(5 + (1.5 * 100 / (parseFloat(this.options.width) || 100)));
var width = 98 - left;
var right = 2;
if (columns.length !== 1)
{
width = !c ? 70 : 50;
right = !c ? 30 : 2;
left += c * (100.0-left) / columns.length;
}
if (left + width > 100.0) width = 98.0 - left;
for(var i = 0; (columns[c].indexOf(event) >= 0 || !event) && i < columns[c].length; i++)
{
@ -827,7 +826,7 @@ var et2_calendar_daycol = et2_valueWidget.extend([et2_IDetachedDOM, et2_IResizea
columns[c][i].div.css('top', '');
columns[c][i].div.css('height', '');
columns[c][i].div.css('left', '');
columns[c][i].div.css('width', '');
columns[c][i].div.css('right', '');
// Strip out of view padding
columns[c][i].body.css('padding-top','');
continue;
@ -839,7 +838,7 @@ var et2_calendar_daycol = et2_valueWidget.extend([et2_IDetachedDOM, et2_IResizea
columns[c][i].div.css('top', '');
columns[c][i].div.css('height','');
columns[c][i].div.css('left', '');
columns[c][i].div.css('width', '');
columns[c][i].div.css('right', '');
columns[c][i].body.css('padding-top','');
columns[c][i].div
.appendTo(this.all_day);
@ -872,7 +871,7 @@ var et2_calendar_daycol = et2_valueWidget.extend([et2_IDetachedDOM, et2_IResizea
// This gives the wrong height
//columns[c][i].div.outerHeight(height+'%');
columns[c][i].div.css('left', left.toFixed(1)+'%');
columns[c][i].div.css('width', width.toFixed(1)+'%');
columns[c][i].div.css('right', right.toFixed(1)+'%');
columns[c][i].div.css('z-index',parseInt(20)+c);
}

15
calendar/js/et2_widget_event.js
View File

@ -312,11 +312,6 @@ var et2_calendar_event = et2_valueWidget.extend([et2_IDetachedDOM],
{
// Most statuses use colored borders
this.div.css('border-color',status_class === 'calendar_calEventAllAccepted' ? this.div.css('background-color') : '');
// Set title color based on background brightness
this.title
.css('background-color', this.div.css('background-color'))
.css('color', jQuery.Color(this.div.css('background-color')).lightness() > 0.45 ? 'black':'white');
}
this.icons.appendTo(this.title)
@ -345,11 +340,6 @@ var et2_calendar_event = et2_valueWidget.extend([et2_IDetachedDOM],
.append('<span class="calendar_calTimespan">'+start_time + '</span>')
.append('<p>'+this.options.value.description+'</p>');
}
this.body
// Set background color to a lighter version of the header color
.css('background-color',jQuery.Color(this.title.css('background-color')).lightness(
Math.max(0.8, parseFloat(jQuery.Color(this.title.css('background-color')).lightness()))
));
},
/**
@ -420,12 +410,11 @@ var et2_calendar_event = et2_valueWidget.extend([et2_IDetachedDOM],
}
return '<div class="calendar_calEventTooltip ' + this._status_class() + '" style="border-color: '+border+'; background: '+bg_color+';">'+
'<div class="calendar_calEventHeaderSmall" style="background-color: '+this.title.css('background-color')+';">'+
'<div class="calendar_calEventHeaderSmall">'+
'<font style="color:'+header_color+'">'+timespan+'</font>'+
this.icons[0].outerHTML+
'</div>'+
'<div class="calendar_calEventBodySmall" style="background-color: '+
jQuery.Color(this.title.css('background-color')).lightness("0.9") + '">'+
'<div class="calendar_calEventBody">'+
'<p style="margin: 0px;">'+
'<span class="calendar_calEventTitle">'+this.div.attr('data-title')+'</span><br>'+
this.options.value.description+'</p>'+

29
calendar/templates/default/app.css
View File

@ -443,19 +443,15 @@ e.g. the div with class calendar_calTimeGrid is generated by the timeGridWidget
/* contains one event: header-row & -body
*/
.calendar_calEvent,.calendar_calEventPrivate{
.calendar_calEvent {
position: absolute;
left: 0px;
right: 0px;
overflow: hidden;
z-index: 20;
border-width: 1px;
border-radius: 6px;
border-style: solid;
padding-left: 6px;
min-height: 1.2em;
min-width: 5px;
-moz-border-radius: 6px;
-webkit-border-radius: 6px;
/* It is important there are no CSS transitions, it breaks resize */
-webkit-transition:none;
-moz-transition: none !important;
@ -471,6 +467,7 @@ e.g. the div with class calendar_calTimeGrid is generated by the timeGridWidget
*
*/
border-color: #808080;
background-color: #808080;
}
.calendar_calEvent:hover{
@ -530,6 +527,7 @@ e.g. the div with class calendar_calTimeGrid is generated by the timeGridWidget
white-space: nowrap;
}
.calendar_calEventTooltip{
padding-left: 6px;
border-radius: 6px;
-moz-border-radius: 6px;
-webkit-border-radius: 6px;
@ -540,6 +538,9 @@ e.g. the div with class calendar_calTimeGrid is generated by the timeGridWidget
.calendar_calEventTooltip .calendar_calEventBodySmall {
padding-bottom: 1em;
}
.calendar_calEventTooltip img {
max-width: 1.5em;
}
.calendar_calAddEvent{
width: 100%;
@ -566,7 +567,7 @@ e.g. the div with class calendar_calTimeGrid is generated by the timeGridWidget
* background-color: depending on category
* color: white || black depending on cat;
*/
background-color: #808080;
background-color: rgba(255,255,255,0.9);
}
.calendar_calEventHeaderSmall{
font-size: 8pt;
@ -591,20 +592,8 @@ e.g. the div with class calendar_calTimeGrid is generated by the timeGridWidget
left: 2px;
right: 2px;
height: 99%;
white-space: normal;
/* Gradient */
background-image: -webkit-linear-gradient(0deg, rgba(255,255,255,0) 0, rgba(255,255,255,0.85) 60%);
background-image: -moz-linear-gradient(90deg, rgba(255,255,255,0) 0, rgba(255,255,255,0.85) 60%);
background-image: linear-gradient(90deg, rgba(255,255,255,0) 0, rgba(255,255,255,0.85) 60%);
background-position: 50% 50%;
-webkit-background-origin: padding-box;
background-origin: padding-box;
-webkit-background-clip: border-box;
background-clip: border-box;
-webkit-background-size: auto auto;
background-size: auto auto;
background-color: rgba(255,255,255,0.9);
}
.calendar_calEventBody > p, .calendar_calEventBodySmall > p {
white-space: pre-wrap;

3
calendar/templates/pixelegg/app.css
View File

@ -784,9 +784,6 @@ e.g. the div with class calendar_calTimeGrid is generated by the timeGridWidget
.calendar_calEvent,
.calendar_calEventPrivate {
border-width: 1px;
border-radius: 6px;
-moz-border-radius: 6px;
-webkit-border-radius: 6px;
/* set via inline style on runtime:
* top: depending on startime
* height: depending on length

3
calendar/templates/pixelegg/app.less
View File

@ -911,9 +911,6 @@ e.g. the div with class calendar_calTimeGrid is generated by the timeGridWidget
*/
.calendar_calEvent,.calendar_calEventPrivate{
border-width: 1px;
border-radius: 6px;
-moz-border-radius: 6px;
-webkit-border-radius: 6px;
/* set via inline style on runtime:
* top: depending on startime
* height: depending on length