mirror of
https://github.com/EGroupware/egroupware.git
synced 2024-11-30 03:43:40 +01:00
Change regular (grid view) event styling
This commit is contained in:
parent
f438940598
commit
57b955de9e
@ -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);
|
||||
|
||||
}
|
||||
|
@ -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>'+
|
||||
|
@ -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;
|
||||
|
@ -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
|
||||
|
@ -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
|
||||
|
Loading…
Reference in New Issue
Block a user