webgui/docs/upgrades/templates-7.3.1/CalendarEvent.tmpl

#CalendarEvent000000001
<table cellspacing="0" cellpadding="0" width="600" id="mCAL" border="0">
<tr>
	<td style="text-align:right;border-bottom:solid white 1px;">
		<a href="<tmpl_var urlDay>" class="tab">Day</a>
		<a href="<tmpl_var urlWeek>" class="tab">Week</a>
		<a href="<tmpl_var urlMonth>" class="tab">Month</a>
		<a href="<tmpl_var urlSearch>" class="tab">Search</a>
		
		<div class="controls">
			<a href="?func=edit">Edit</a> &bull; <a href="?func=delete">Delete</a>
		</div>
	</td>
</tr>
<tr>
	<td class="months">
		<div style="float: left;"><a href="<tmpl_var prevUrl>">&lt;&lt; Previous Event</a></div>
		<div style="float: right;"><a href="<tmpl_var nextUrl>">Next Event &gt;&gt;</a></div>
	</td>
</tr>
<tr>
	<td class="months">
		Event Details
	</td>
</tr>
<tr>
	<td style="width:100%">
		<table width="100%" cellspacing="2" cellpadding="0">
		<tr>
			<td class="heading">
				<div style="padding:4px;">Event Title</div>
			</td>
			<td class="day">	
				<div class="eventWrapper">
					<tmpl_var title>
				</div>
			</td>
		</tr>
		<tr>
			<td class="heading">
				<div style="padding:4px;">Location</div>
			</td>
			<td class="day">	
				<div class="eventWrapper">
					<tmpl_var location>
				</div>
			</td>
		</tr>
		
		<tr>
			<td class="heading">
				<div style="padding:4px;">Description</div>
			</td>
			<td class="day">							
				<div class="eventWrapper"><tmpl_var description></div>
			</td>
		</tr>

		<tr>
			<td class="heading">
				<div style="padding:4px;">Scheduled</div>
			</td>
			<td class="day">							
				<div class="eventWrapper">
					<tmpl_var startDateDayName>,
					<tmpl_var startDateMonthName>
					<tmpl_var startDateDayOfMonth>
					<tmpl_var startDateHour>:<tmpl_var startDateMinute> <tmpl_var startDateM> &bull; <tmpl_var endDateDayName>, 
					<tmpl_var endDateMonthName>
					<tmpl_var endDateDayOfMonth>
					<tmpl_var endDateHour>:<tmpl_var endDateMinute> <tmpl_var endDateM>
				</div>
			</td>
		</tr>

		<tr>
			<td class="heading">
				<div style="padding:4px;">Related Material</div>
			</td>
			<td class="day">								<div class="eventWrapper"><tmpl_loop relatedLinks>
				<a href="<tmpl_var link.url>"><tmpl_var linkUrl></a><br />
				</tmpl_loop></div>
			</td>
		</tr>
	
		</table>
	</td>
</tr>
</table>
~~~
	<style type="text/css">
		/* Edited with EditCSS */

/**** Inline STYLE-tag style sheet ****/

		body * {
			margin:0px;
		}	
		#mCAL {
			
		}
		#mCAL td {
			font-size:10px;
			font-family:arial;
		}
		#mCAL .tab {

			border-bottom-style:none;
			font-weight:bold;
			padding: 2px 15px 0px 15px;
			text-align;center;
			background-color:#E9ECF3;
			-moz-border-radius-topLeft:10px;
			-moz-border-radius-topRight:10px;
			color:#7588B5;
			text-decoration:none;
			font-size:10pt;
			display:block;
			float:left;
			margin-right:5px;
		}
		#mCAL .tab:hover {
			color:black;
		}	
		#mCAL .active {
			background-color:#DFE3EE;
			color:#404F77;
			border-bottom:solid #DFE3EE 1px;
		}	
		#mCAL a {
			font-size:11px;
			color:#517AC8;
		}	
		#mCAL .heading {
			width:200px;
			-moz-box-sizing:border-box;
			background-color:#ABB7D1;
			text-align:center;
			font-weight:bold;
			color:#374664;
			font-size:9px;
			letter-spacing:1px;
			text-transform:uppercase;
			text-align:right;
			vertical-align:top;
			-moz-border-radius-bottomRight:8px;
			-moz-border-radius-topRight:8px;			
		}
		#mCAL .day {
			background-color:#E9ECF3;			
			width:400px;
			position:relative;
			vertical-align:top;		
			-moz-border-radius-topLeft:8px;
			-moz-border-radius-bottomLeft:8px;			
			border:solid #CCD2E3 1px;
		}

		
		#mCAL .months {
			text-align:center;
			background-color:#DFE3EE;	
			color:#3E4D75;
			font-size:14px;
			font-weight:bold;
		}
		#mCAL .months a {
			color:#517AC8;
			text-decoration:none;
		}
		#mCAL .months .monthLink {
			text-decoration:none;			
			padding-left:5px;
			padding-right:5px;
			color:#AAB8D5;
			font-size:12px;
			font-weight:bold;
		}	
		#mCAL .months .current {
			color:#517AC8;
		}
		#mCAL .current {
			font-weight:bold;
			color:#517AC8;
			background-color:#fff;			
			-moz-border-radius:5px;
		}
		#mCAL .curMonth {
			text-align:center;
			margin: 2px 0px;
			background-color:#517AC8;
			color:white;
			font-size:14px;
			font-weight:bold;
		}

		#mCAL .searchField {
			margin: 2px 10px;
			border:solid #ABB7D1 1px;
		}
		#mCAL .searchBtn {
			background-color: #ABB7D1;
			border:solid #CCD2E3 1px;
			color:white;
			font-weight:bold;
			cursor:pointer;
		}
		
		#mCAL .eventWrapper {
			margin:2px 10px;
		}
	</style>