My favorites | Sign in
Project Home Issues
New issue   Search
for
  Advanced search   Search tips   Subscriptions
Issue 707: Custom styling of events - enhancement
2 people starred this issue and may be notified of changes. Back to list
Status:  Done
Owner:  ----
Closed:  Nov 2010


Sign in to add a comment
 
Reported by xxxmicro...@gmail.com, Nov 10, 2010
I have made my calendar so that dropped events have a unique colour.

This may not be suitable for most people as this is for a roster of 7 people where I give each person a different colour for visual clarity.

In fullcalendar.js in two places I changed

"<span class='fc-event-title'>" + htmlEscape(event.title) + "</span>"

to 

"<span class='fc-event-title " + htmlEscape(event.title).toLowerCase() + "'>" + htmlEscape(event.title) + "</span>"

adding the title of the event (in my case a single word, the person's name) as a class.

I then embedded styles matching the names e.g.

	.steve{
		background:#360;	
	}
	.debra{
		background:#FF0;	
	}

I also added the class to the external-event divs e.g.

<div class='external-event debra'>Debra</div>
<div class='external-event steve'>Steve</div>

I had to do some tweaks to make the background colour stretch the width of the title, which in fact was the trickiest part and isn't perfect yet.

See it in action at http://hinternet.com.au/projects/fullcalendar-1.4.8/

Hope that helps someone

Nov 11, 2010
#1 xxxmicro...@gmail.com
See next issue for a solution.
Nov 21, 2010
Project Member #2 adamrs...@gmail.com
(No comment was entered for this change.)
Status: Done
Sign in to add a comment

Powered by Google Project Hosting