UI Styling - Calendarforum

Main menu:

UI Styling

This page is used to tailor the calendar's user interface colors, font family and font sizes.

Buttons and drop-down menu at the top of the page:

Preview Theme: When pressed, the theme displayed in this window will be temporary activated for the calendar and a Stop Preview button will be displayed. The calendar can now be browsed with these styles, until the Stop Preview button is selected.
Save Theme: The displayed theme will be saved to the database and from now on this theme will be used by the calendar. The previous theme in the database will be overwritten. When the theme is saved for the first time since the Styling page is opened, prior to overwriting the theme in the database, an automatic backup will be stored in a file in the css folder; the file extension will be "abak".
Backup Theme: The theme from the database will be stored in a file in the css folder. The name given to the file will be shown in the information line at the top of the window. The file extension will be "mbak".
Restore Theme: This drop-down menu will show the LuxCal default theme and all backup files (".abak" and ".mbak") in the css folder. When an entry is selected the theme from the selected file will be displayed in the Styling page. This theme can then be previewed, modified and saved.
Close Window: Close the Styling window. If there are unsaved changes, a warning will be displayed.
Theme title: Optional theme title which will be stored along with the styles in the database and in backup files. If left blank, this field will default to the calendar title.

Styles:

Most general styles are self-explanatory; the following styles need some explanation:

font sizes: Some font sizes are specified in px (pixels) and some in em. When specified in px, the font size is fixed and when specified in em, the font size is scalable and equals: base font size x number of ems.
bars, headers and rules: The navigation bar, the footer bar, table headers and rulers.
popup windows: The event Add/Edit window and the Help window.
insert boxes: Boxes on various pages, which have no shadow. E.g. the login box on the log in page.
overlay boxes: Boxes which overlay the page and have no shadow. E.g. the Options panel, the Todo sidebar, the upcoming side bar.
content offset: The number of pixels the actual calendar content starts under the navigation bar. In certain cases, for instance when you want to add elements at the top of the calendar, you may want to shift the calendar content down by increasing its offset from navigation bar.

Grid / Views
Grid and views refer to those views where the calendar is shown as a matrix of day cells, i.e year, month, week, day and matrix view.

day cell top - hover: The top of the day cells which can be clicked to add new events.
cell head 1st of month: The full month name which is displayed each first day of the month.
weeknr / time column: The week number column in year and month view and the time column in week and day view.
weekday month 1 and 2: To distinguish month from each other, months can have alternately (slightly) different colors.
weekend month 1 and 2: Same as week days above, but for weekends.
outside month: The leading and trailing days which fall outside the month, when full month display with events on leading and trailing days has been selected on the Settings page.
day cell today: The day cell of today can have a different color than the other days.
day cell selected day: The day cell of a day selected via the date picker can have a different color than the other days.
todo check box: The check box in front of the event title for events in a category with the check box selected.

Hover Boxes
For hover boxes, which pop up in the various views when hovering the event title, different text colors, background colors and border colors can be specified, depending on the type of event (normal, private or repeating).