added html style template

1 files changed, 261 insertions, 0 deletions

diff --git a/evmik.scss b/evmik.scss
new file mode 100644
index 0000000..0bf3ba6
--- /dev/null
+++ b/evmik.scss
@@ -0,0 +1,261 @@
+// ---------  Color definitions start -------------------
+$body_bg: #336699;
+$body_padding: 0px;
+$body_margin: 1%;
+$body_font_family: Sans-Serif;
+
+$toc_width: 20%;
+
+$body_header_bg: $body_bg;
+$body_header_fg: white;
+
+$link_color_cmd_normal:  black;
+$link_color_cmd_visited: $link_color_cmd_normal;
+$link_color_cmd_hover:   $link_color_cmd_normal;
+$link_color_cmd_active:  $link_color_cmd_normal;
+
+$normal_bg: #ffcc99;
+$normal_fg: black;
+
+$sidebar_bg: lighten($body_bg,35%);
+$sidebar_border_clr: $body_bg;
+
+$div_padding: 0.5%;
+$div_margin_vert:  0.5%;
+$div_margin_horiz:  0.5%;
+
+$errormsg_bg:   #ff0000;
+$infomsg_bg:    #ffccff;
+
+$attention_bg:  #8f0000;
+$attention_fg:  white;
+
+
+$Quiz:          #CFECEC;
+$Homework:      #C3FDB8;
+$LabReport:     #82CAFA;
+$MidTerm:       #f0b7f0;
+$FinalExam:     #f08ab6;
+$Participation: #cccc99;
+$Unset:         #cccccc;
+
+$table_hover_bg: #ffeebb;
+
+$controls_bg: #dddddd;
+
+$col_controls_bg: #dddddd;
+$col_controls_fg: black;
+$col_controls_dangerous_bg: red;
+$col_controls_dangerous_fg: black;
+// ---------  Color definitions end   -------------------
+
+
+body {
+	padding: $body_padding;
+	margin:  $body_margin;
+	background-color: $body_bg;
+	color: $normal_fg;
+	font-family: $body_font_family;
+  text-align: justify;
+	/*
+	a {
+		color:              $link_color_cmd_normal;
+		text-decoration:    none;
+		&:visited { color:  $link_color_cmd_visited;  }
+		&:hover   { 
+			color:  $link_color_cmd_hover;    
+			text-decoration:underline;
+			background-color: lighten($controls_bg,20%);
+		}
+		&:active  { 
+			color:  $link_color_cmd_active;   
+			text-decoration:underline;
+			background-color: lighten($controls_bg,20%);
+		}
+	}
+	*/
+
+	div {
+		background-color: $normal_bg;
+		color: $normal_fg;
+		padding: {
+			top:     $div_padding;
+			bottom:  $div_padding;
+			left:    $div_padding;
+			right:   $div_padding;
+		}
+		margin: {
+			top:     $div_margin_vert;
+			bottom:  $div_margin_vert;
+			left:    $div_margin_horiz;
+			right:   $div_margin_horiz;
+		}
+		pre {
+			background-color: lighten($normal_bg,10%);
+		}
+		ul {
+			padding-left: 1em;
+		}
+	}
+	div.toc {
+		float: left;
+		width: $toc_width;
+		font-weight: bold;
+		a {
+			color: black;
+			text-decoration: none;
+		}
+		a:hover {
+			text-decoration: underline;
+		}
+	}
+	div.body {
+		float: right;
+		width: 100% - $toc_width - 5%;
+		h1 {
+			padding:  {
+				left:  $div_padding;
+				right: $div_padding;
+			}
+			text-align: left;
+			font-size: 150%;
+			font-weight: bold;
+			color: $body_header_fg;
+			background-color: $body_header_bg;
+		}
+		h2 {
+			padding:  {
+				left:  $div_padding;
+				right: $div_padding;
+			}
+			text-align: left;
+			font-size: 130%;
+			font-weight: normal;
+			color: $body_header_fg;
+			background-color: $body_header_bg;
+		}
+		h3 {
+			padding:  {
+				left:  $div_padding;
+				right: $div_padding;
+			}
+			text-align: left;
+			font-size: 115%;
+			font-weight: normal;
+			color: $body_header_fg;
+			background-color: $body_header_bg;
+		}
+		img.myphoto {
+			float: right;
+			text-align: right;
+			width: 10em;
+		}
+		#sidebar {
+			margin: {
+				left:	$div_padding;
+				right: 0;
+				top: 0;
+				bottom: 0;
+			}
+			float: right;
+			z-index: 1;
+			background-color: $sidebar_bg;
+			width		: 10em;
+			border-style: solid;
+			border-width: 1px;
+			border-color: $sidebar_border_clr;
+			ul {
+				list-style-type : none;
+				padding: {
+					top:     0;
+					bottom:  0;
+					left:    1em;
+					right:   0;
+				}
+				margin: 0;
+			}
+			p { 
+				margin: 0;
+			}
+			h3 {
+				padding: .1em;
+				margin: 0;
+				font-weight: bold;
+			}
+		}
+	}
+	div.header {
+		text-align: left;
+		font-family:  Sans-Serif;
+		h1 {
+			margin: 2pt;
+			font-size: 200%;
+			font-weight: bold;
+		}
+		h2 {
+			margin: 2pt;
+			font-size: 120%;
+			font-weight: normal;
+		}
+		h3 {
+			margin: 2pt;
+			font-size: 110%;
+			font-weight: normal;
+		}
+	}
+
+}
+body.home_page {
+	div.zero_p_space {
+	  margin: 0;
+		padding: 0;
+		p { 
+			margin: 0;
+		}
+	}
+	ul {
+		list-style-type : none;
+		padding: 0;
+		margin: 0;
+	}
+}
+
+	
+
+/*
+ * print styles
+ */
+@media print {
+	* {
+		background-color: white !important;
+		background-image: none !important;
+	}
+	div.controls { 
+		display: none;
+	}
+	div.greetings { 
+		display: none;
+	}
+	div.footer { 
+		display: none;
+	}
+	div.gradestable { 
+		table.gradestable {
+			th {
+				font-weight: bold;
+				valign: top;
+			}
+		}
+		a[href]:after {
+			content:none;
+		}
+		a img {
+			display: none;
+		}
+	}
+}
+
+
+
+ 
+// vim: ts=2:sw=2:tw=74:fdm=indent