/*
  Running MySource Matrix
  Developed by Squiz - http://www.squiz.net
  MySource, MySource Matrix and Squiz.net are registered Trademarks of Squiz Pty Ltd
  Page generated: 10 September 2010 00:26:31
*/


   Text File  |  
Current Status: Live 
Asset Type:  Text File 
Asset Created: 29th Jan 2008 12:36pm by Michal Czebotar 
Last Updated: 19th Aug 2008 9:42am by Michal Czebotar 
Last Published: Never   
Status Last Changed: 29th Jan 2008 12:36pm by Michal Czebotar 

Designs Folder > EC Inner > calendar_default.css 
Designs Folder > EC Home > calendar_default.css 

 
  calendar_default.css (Id: #24618) v. 0.0.16  |  Edit File  DetailsPermissionsWorkflowRolesMetadata SchemasMetadataDependantsLinkingSettingsHistoryLogsPreviewTaggingLayouts------Web PathsEdit File     
 Back to:   diary [2] +    EC Inner [3] +    calendar_default.css [4] +    EC Inner [5] +    calendar_default.css [6]  
Locking / Editing  
 
Press the Acquire Lock(s) button to lock "calendar_default.css" for editing. Show Lock Details


   Lock Type     
 Attributes  Currently not held.  
 

  
 
 Edit File  
 
   /**
* +--------------------------------------------------------------------+
* | This MySource Matrix Module file is Copyright (c) Squiz Pty Ltd    |
* | ACN 084 670 600                                                    |
* +--------------------------------------------------------------------+
* | IMPORTANT: This Module is not available under an open source       |
* | license and consequently distribution of this and any other files  |
* | that comprise this Module is prohibited. You may only use this     |
* | Module if you have the written consent of Squiz.                   |
* +--------------------------------------------------------------------+
*
* $Id: calendar_default.css,v 1.36 2006/12/07 05:51:52 bcaldwell Exp $
*
*/

/**
 ***********************************************************************
 * CALENDAR CSS RULES
 *
 * The following CSS rules govern the layout of the calendar displays.
 * Note that most of the height, width and position attributes are set
 * in-line by the calendar and should/can not be specified here.
 *
 * Note also that these rules apply in the order they are specified.
 * When several rules apply to an element, the latest-specified rule
 * wins if there is a conflict.
 ***********************************************************************
*/

/**
 * GENERAL RULES
 */
body#whats-on div#main div#content-frame div#page-content div#content div#calendarTable { width: 565px; text-align: left; padding:0 0 10px 0; }

body#whats-on div#main div#content-frame div#page-content div#content div#calendarTable table { border: none; }

div#main div#content-frame div#page-content div#content table tbody td.eventDate {
 padding: 2px 3px;
 overflow: hidden;
}

div#calendarTable table td { text-align: left; font-size: 70%; }
div#calendarTable table th { text-align: center; font-size: 70%;  }
#calendarTable table { margin:0 auto 20px auto; }
#calendarTable div { margin: 0px }
#calendarTable td div.eventText { margin: 0px 0px 0px 1px; text-align: center; padding: 0px; }
.calendarNavLink, a.calendarNavLink:hover, a.calendarNavLink:visited { text-decoration: none; font-weight: bold; color: blue }
div#calendarList { text-align: left; width: 80ex; margin-left: auto; margin-right: auto}
th.columnLabel a {
    display: block;
    height: 100%;
    width: 100%;
}


/* popups over events */
div.popup {
    position:absolute;
    visibility:visible;
    left: 0px;
    top: 0px;
    display: none;
    width: 25ex;
    border: 1px solid black;
    padding: 1px 3px;
    background-color: white;
    z-index: 100;
}

/**
 * YEAR TABLE RULES
 * Cells in this table can be header cells or data cells.
 * Data cells can be completely empty, or contain a date,
 * or contain a date and event(s). Several of the following
 * rules could apply to a given cell.
 */
table#year { background-color: #f8f8f8; border-collapse: collapse; font-family: sans-serif; font-size: 90%  }

/* Header cells */
#year th { border: 1px solid #c8c8c8; padding: 0px; }
#year td { padding: 0px; }
#year th.monthLabel { background-color: #017ca5; color: white; font-weight: bold; }
#year th.monthLabel a, #year td.monthLabel a:visited, #year td.monthLabel a:hover { color: white; font-weight: bold; text-decoration: none; }
#year th.dayLabel { background-color: #f5c9da; color: white; text-align: center;}
#year th.dayLabelWeekend {background-color: #93b0e6; }
#year tr td a, #year tr th a {
    display: block;
    margin: 0px;
    height: 100%;
    width: 100%;
}
/* All data cells, including completely empty ones */
#year td { text-align: center; border-top: 1px solid #d8d8d8; padding: 0px;}

/* Cells with dates */
#year td.date { background-color: white; text-align: center; color: black;}

/* Weekend Cells, with or without dates */
#year td.weekend { background-color: #e6e6eb; }

/* Cells with dates, again, to make its borders overrule */
#year td.date { border: 1px solid #c0c0c0; }

/* Cells with events */
#year td.eventDate { background-color: #DFEBF9; }
#year td a, #year td a:visited, #year td a:hover { color: #3598b9; font-weight: bold; text-decoration: none; }



/**
 * MONTH TABLE RULES
 * Cells in this table can be header cells or data cells.
 * Data cells can be completely empty, or contain a date,
 * or contain a date and event(s). Several of the following
 * rules could apply to a given cell.
 */

body#whats-on div#main div#content-frame div#page-content div#content table#month { width: 565px; border: 1px solid #173e57; background-color: #f8f8f8; border-collapse: collapse;  }
#month th  { border: 1px solid #c8c8c8;}

/* Header Cells */
#month th.dayLabel, #month th.weekLink {
 background-color:#1A528F;
 color:#fff;
 font-size:1em;
}

#month th.dayLabelWeekend {  font-size:1em;background-color: #1A528F; color: #fff;width:90px;  }


/* All data cells, including completely empty ones */
#month td { padding-left: 2px; text-align: left; vertical-align: top; border: 1px solid #c0c0c0; height:70px; }

/* Cells with dates */
#month td.date { background-color: white;}

/* Weekend Cells, with or without dates */
#month td.weekend { background-color: #e6e6eb; }

/* Cells with events */
#month td.eventDate { background-color:#DFEBF9; }

/* Linked dates at top left of cells */
#month a.dateLink, #month a.dateLink:visited, #month a.dateLink:hover { font-size:1.1em;color: black; font-weight: bold; text-decoration: none; }

/* Linked event names in cells (root-node-specific classes will also apply) */
#month .event, #month a.event:visited, #month a.event:hover { font-size:1.1em; line-height: 1.1; font-weight: normal; padding: 0px 1px; text-align: center}

/* Arrowed » links to the week view from the month */
#month th.weekLink { width:10px;vertical-align: middle; padding: 0px; cursor: pointer; }
/* Week view links text */
#month th.weekLink a.dateLink, #month th.weekLink a.dateLink:visited, #month th.weekLink a.dateLink:hover { display: block;  color: white; font-weight: bold; text-decoration: none; font-size:1.2em; padding: 3px; }


/**
 * WEEK TABLE RULES
 * Cells in this table can be header cells or data cells.
 * Data cells can contain DIVs that represent events
 */

table#week { border: 1px solid #173e57; background-color: white; border-collapse: collapse }
#week td, #week th  { border: 1px solid #c0c0c0; }
#week td, #week th.timeLabel { vertical-align: top; padding: 0px;}

/* header cells */
#week th { background-color: #41afe0; text-align: center; padding: 1px }
#week th.timeLabel { background-color: #017ca5; color: white }
#week th.columnLabel { background-color: #41afe0; vertical-align: middle; font-weight: bold; color: black; white-space: nowrap; }
#week th.columnLabel a, #week th.columnLabel a:visited, #week th.columnLabel a:hover { text-decoration: none; font-weight: bold; color: black }

/* Event DIVs (root-node-specific classes will also apply) */
#week td div.event { margin: 0px 0px 1px 0px; text-align: center; padding: 0px; border: 1px solid black; }

/* Event Links (root-node-specific classes will also apply) */
#week .event, #week a.event:visited, #week a.event:hover { text-decoration: none }


/**
 * DAY TABLE RULES
 * Cells in this table can be header cells or data cells.
 * Data cells can contain DIVs that represent events
**/

table#day { border: 1px solid #173e57; background-color: white; border-collapse: collapse  }
#day td, #day th  { border: 1px solid #c0c0c0; }
#day td, #day th.timeLabel { vertical-align: top; }

/* header cells */
#day th { background-color: #41afe0; text-align: center; padding: 1px }
#day th.timeLabel { background-color: #017ca5; color: white }
#day th.columnLabel { background-color: #41afe0; vertical-align: middle; font-weight: bold; color: black; white-space: nowrap }
#day th.columnLabel a, #week th.columnLabel a:visited, #week th.columnLabel a:hover { text-decoration: none; font-weight: bold; color: black }


/* Event DIVs (root-node-specific classes will also apply) */
#day td div.event { margin: 0px 0px 1px 0px; text-align: center; padding: 0px; border: 1px solid black; }

/* Event Links (root-node-specific classes will also apply) */
#day .event, #day a.event:visited, #day a.event:hover { text-decoration: none }



/**
 * PRESET ROOT NODE RULES
 * These rules will be applied to all A and DIV elements that represent
 * events drawn from the relevant root nodes
 */
#calendarTable .aqua, #calendarTable .aqua:visited, #calendarTable .aqua:hover { background-color: aqua; color: black; }
#calendarTable .black, #calendarTable .black:visited, #calendarTable .black:hover { background-color: black; color: white; }
#calendarTable .blue, #calendarTable .blue:visited, #calendarTable .blue:hover { background-color: blue; color: white; }
#calendarTable .fuchsia, #calendarTable .fuchsia:visited, #calendarTable .fuchsia:hover { background-color: fuchsia; color: black; }
#calendarTable .gray, #calendarTable .gray:visited, #calendarTable .gray:hover { background-color: gray; color: white; }
#calendarTable .green, #calendarTable .green:visited, #calendarTable .green:hover { background-color: green; color: white; }
#calendarTable .lime, #calendarTable .lime:visited, #calendarTable .lime:hover { background-color: lime; color: black; }
#calendarTable .maroon, #calendarTable .maroon:visited, #calendarTable .maroon:hover { background-color: maroon; color: white; }
#calendarTable .navy, #calendarTable .navy:visited, #calendarTable .navy:hover { background-color: navy; color: white; }
#calendarTable .olive, #calendarTable .olive:visited, #calendarTable .olive:hover { background-color: olive; color: white; }
#calendarTable .purple, #calendarTable .purple:visited, #calendarTable .purple:hover { background-color: purple; color: white; }
#calendarTable .red, #calendarTable .red:visited, #calendarTable .red:hover { background-color: red; color: white; }
#calendarTable .silver, #calendarTable .silver:visited, #calendarTable .silver:hover { background-color: silver; color: black; }
#calendarTable .teal, #calendarTable .teal:visited, #calendarTable .teal:hover { background-color: teal; color: white; }
#calendarTable .white, #calendarTable .white:visited, #calendarTable .white:hover { background-color: white; color: black; }
#calendarTable .yellow, #calendarTable .yellow:visited, #calendarTable .yellow:hover { background-color: yellow; color: black; }

/**
 * USER-DEFINED ROOT NODE RULES
 * These rules will be applied to all A and DIV elements that represent
 * events drawn from the relevant root nodes
 * If you want these to be view-specific you can define them for each of the
 * #year, #month, #week, #day IDs
 */