A place for discussion about skinning and design. Before posting questions here you should review the documentation about creating skins.
The Event Calendar pages do not have its own class in the body tag.(I can only assign a class to the body tag via the "Page Settings" on the first page that contains the Events module).
Is there a way I can add a class to the body tag on the Event Calendar Pro pages?
Creating a separate skin is not a good option for my needs.
I've just updated my copy so that the class you put in page settings will be applied to all of the supporting pages in event Calendar Pro. So this will be fixed in the next update.
That is helpful.
Would it also be possible to add an extra css class to body tag called "admin" or "eventsAdmin" on:
The reason is that I have a some different styling on the site admin pages that I would like to also apply to the Calendar Pro admin pages for consistent user experience.
Great. Thank you.
Do you know when the next update to Event Calendar Pro is expected?
My client is asking for the detail view to appear as a modal popup on the events home page.
I'm thinking that I could use jQuery and Colorbox to have the event detail view show up in an iframe in Colorbox, by referencing the "summary" or "url" class on the <a href> tag.
The downside is that the main menus will show up in the detail view, unless there is a way to change the skin. I suppose I could possible append "?skin=myAltSkin" to my event detail URL.
Thoughts or suggestions?
I've just released Event Calendar Pro 126.96.36.199 which includes the new CSS classes.
For anyone curious, I did end up using jQuery to have the event detail view show in a pop-up browser window.
Although Joe's update of including my initial request -- having the body class you assign in the Page Settings carry over to the Event Calendar's child and support pages -- it didn't provide all the control I needed for styling the Detail View page.
var myHref = $(this).attr('href'); var myExt = '?skin=popup'; var myWindow = 'Popup'; var myParameters = "'scrollbars=auto, width=600, height=500";
window.open(myHref + myExt,myWindow,myParameters);e.preventDefault();return false;});