From 9c47c214860f00c7a680359f32e852d73522800a Mon Sep 17 00:00:00 2001 From: Eugeniy Mikhailov Date: Wed, 11 Sep 2013 17:30:19 -0400 Subject: css style generation redone --- css_styles/evmik.scss | 328 ++++++++++++++++++++++++++++++++++++++++++++++++++ css_styles/local.mk | 14 +++ 2 files changed, 342 insertions(+) create mode 100644 css_styles/evmik.scss create mode 100644 css_styles/local.mk (limited to 'css_styles') diff --git a/css_styles/evmik.scss b/css_styles/evmik.scss new file mode 100644 index 0000000..514d16e --- /dev/null +++ b/css_styles/evmik.scss @@ -0,0 +1,328 @@ +// --------- 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; + +$toc_bg: lighten($body_bg,35%); +$toc_border_clr: $body_bg; + + +$div_padding: 0.5%; +$div_margin_vert: 0.5%; +$div_margin_horiz: 0.5%; + +$small_screen: 480px; +$large_screen: 1200px; + +$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%); + padding: 15px; + border: 1px dashed black; + } + ul { + padding-left: 1em; + } + } + div.toc { + margin: { + right: $body_margin; + left: $div_padding;; + top: $div_padding; + bottom: $div_padding; + } + float: right; + z-index: 1; + background-color: $toc_bg; + width : 15em; + border-style: solid; + border-width: 1px; + border-color: $toc_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; + } + // small screen/handheld + // @media (max-width: $small_screen) { + // above gives hick up to sass + // so I have to do hard coded values + @media (max-width: 4in) { + float: none; + width: auto; + margin: 0; + padding: 0; + h3 { + display: none; + } + ul { + padding: 0; + list-style-type : none; + text-align: center; + } + li { + display: inline-block; + padding: .4em; + } + } + } + // 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; + a { + color: $normal_fg; + } + } + 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 diff --git a/css_styles/local.mk b/css_styles/local.mk new file mode 100644 index 0000000..fa5c1a0 --- /dev/null +++ b/css_styles/local.mk @@ -0,0 +1,14 @@ +# -*- make -*- +# (C) 2013 by Eugeniy Mikhailov, + + +#PACKAGE_DIR = $(shell basename `pwd`) +PACKAGE_DIR = . + +tex_independent := +t2t_fig_files := +tex_fig_files := + +REQUIRED_TARGETS += css +INSTALL_TARGETS += install_css + -- cgit v1.2.3