DIR : /home/kozerus/public_html/pn/uize/site-source/js/Uize/Widgets/Calendar/Css.csst

/home/kozerus/public_html/pn/uize/site-source/js/Uize/Widgets/Calendar

<%@ required ('Uize.Widgets.CssUtil'); %>
<%
	var _cssUtil = Uize.Widgets.CssUtil;
%>
.`` {
	display: inline-block;
	position: relative;
	background: #fff;
}

/*** calendar controls ***/
	.`controls` {
		position: relative;
	}
	.`controls` .`indicator` {
		display: block;
		position: relative;
		font-weight: bold;
		text-align: center;
	}

	/*** styling common to year and month navigation ***/
		.`previousMonth`, .`nextMonth` {
			position: absolute;
			top: 0;
		}
		.`previousMonth` {
			left: 0;
		}
		.`nextMonth` {
			right: 0;
		}

/*** grid ***/
	.`grid` {
		text-align: center;
	}

	.`grid` a,
	.`grid` a:link,
	.`grid` a:visited,
	.`grid` a:hover,
	.`grid` a:active {
		text-decoration: none;
		border: none;
	}

	.`grid` th, .`grid` td a {
		color: #000;
	}
	.`grid` td {
		font-weight: normal;
	}
	.`grid` th {
		font-weight: bold;
	}
	.`grid` td a {
		display: block;
		width: 100%;
		height: 100%;
		text-align: center;
	}
	.`grid` th {
		background: #eee;
	}
	.`grid` td a:hover {
		background-color: #666;
		color: #fff;
	}
	.`grid` td.`selected` a {
		background-color: <%= _cssUtil.selectedValue.bgColor %>;
		font-weight: bold;
		color: <%= _cssUtil.selectedValue.color %>;
	}
	.`grid` td.`grayed` {
		color: #999;
	}
	.`grid` table {
		border-collapse: collapse;
	}
	.`grid` th, .`grid` td {
		border: 0;
		padding: 0;
	}

/*** different sizes ***/
<%
	var _sizes = _cssUtil.sizes;
	Uize.forEach (
		_sizes,
		function (_size,_sizeName) {
			var
				_sizeOuter = _size.outer,
				_sizeFont = _size.font,
				_padding = _sizeOuter - _sizeFont,
				_paddingTop = Math.round (_padding / 2)
			;
			%>
			/*** <%= _sizeName %> ***/
				.`<%= _sizeName %>` .`grid` table {
					margin-top: <%= {tiny:1,small:2,medium:3,large:4} [_sizeName] + 2 %>px;
				}
				.`<%= _sizeName %>` .`controls`,
				.`<%= _sizeName %>` .`grid` td,
				.`<%= _sizeName %>` .`grid` th {
					font-size: <%= _sizeFont %>px;
					vertical-align: center;
				}
				.`<%= _sizeName %>` .`controls` {
					line-height: <%= _sizeFont %>px;
					padding-top: <%= _paddingTop %>px;
					padding-bottom: <%= _padding - _paddingTop %>px;
				}
				.`<%= _sizeName %>` .`grid` td a {
					line-height: <%= _sizeFont %>px;
					padding-top: <%= _paddingTop %>px;
				}

				.`<%= _sizeName %>` .`grid` th,
				.`<%= _sizeName %>` .`grid` td {
					width: <%= _sizeOuter %>px;
					height: <%= _sizeOuter %>px;
				}
			<%
		}
	);
%>