Mercurial > hg > Papers > 2015 > kaito-lola
diff presentation/themes/blank/o/projection.css @ 3:c50a033e6635
create presentation slide
author | Kaito Tokumori <e105711@ie.u-ryukyu.ac.jp> |
---|---|
date | Wed, 01 Jul 2015 19:06:07 +0900 |
parents | |
children |
line wrap: on
line diff
--- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/presentation/themes/blank/o/projection.css Wed Jul 01 19:06:07 2015 +0900 @@ -0,0 +1,120 @@ +/********************************* + * CSS @media projection rules (not print or screen) + * + * 1) projection -> slideshow mode (display one slide at-a-time; hide all others) + * 2) screen -> outline mode (display all slides-at-once on screen) + * 3) print -> print (and print preview) + * + * toggle between projection/screen (that is, slideshow/outline) mode using t-key + * + * (note: this is a less extendend css script, to learn more about less; see lesscss.org) + */ +html, body, .presentation { + margin: 0; + padding: 0; +} +.slide { + position: absolute; + top: 0; + left: 0; + margin: 0; + padding: 2% 4% 0% 4%; + /* css note: order is => top right bottom left */ + + -moz-box-sizing: border-box; + -webkit-box-sizing: border-box; + box-sizing: border-box; + width: 100%; + height: 100%; + /* css note: lets use border-box; no need to add padding+border to get to 100% */ + + overflow-x: hidden; + overflow-y: auto; + z-index: 2; +} +/***** + * layout block structure: + * + * .layout + * > #header + * > #footer + */ +.layout #header, .layout header { + position: fixed; + top: 0; + left: 0; + width: 100%; + height: 0.5em; + z-index: 1; +} +.layout #footer, .layout footer { + position: fixed; + top: auto; + bottom: 0; + padding: 1em 0; + /* css note: order is => 1st top,bottom; 2nd right,left */ + + width: 100%; + height: 1em; + z-index: 5; + /* todo: move font-size and font-style to blank.css */ + font-size: 100%; + font-weight: bold; + /* todo: move font-size and font-style to blank.css */ + +} +.layout #footer h1, .layout footer h1 { + display: block; + margin: 0; + padding: 0 1em; + font-size: 50%; +} +.layout #footer h2, .layout footer h2 { + display: block; + margin: 0; + padding: 0 1em; + font-size: 50%; + font-style: italic; +} +/********************************* + * general text-alignment classes + */ +.left { + text-align: left; +} +.center { + text-align: center; +} +.right { + text-align: right; +} +/********************************* + * general _absolute_ font-size classes + */ +.small { + font-size: 97%; +} +.x-small { + font-size: 88%; +} +.xx-small { + font-size: 82%; +} +.large { + font-size: 103%; +} +.x-large { + font-size: 112%; +} +.xx-large { + font-size: 118%; +} +/********************************* + * general _relative_ font-size classes + */ +.smaller { + font-size: 82%; +} +.larger { + font-size: 118%; +}