Created
March 17, 2014 10:29
-
-
Save clrh/9597055 to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html> | |
<head> | |
<title>Model</title> | |
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/> | |
<style type="text/css"> | |
@import url(http://fonts.googleapis.com/css?family=Droid+Serif); | |
@import url(http://fonts.googleapis.com/css?family=Yanone+Kaffeesatz); | |
body { | |
font-family: 'Droid Serif'; | |
font-size: 20px; | |
} | |
h1, h2, h3 { | |
font-family: 'Yanone Kaffeesatz'; | |
font-weight: 400; | |
margin-bottom: 0; | |
} | |
h1 { font-size: 4em; } | |
h2 { font-size: 2em; } | |
h3 { font-size: 1.6em; } | |
.footnote { | |
position: absolute; | |
bottom: 3em; | |
} | |
li p { line-height: 1.25em; } | |
.red { color: #fa0000; } | |
.large { font-size: 2em; } | |
a, a > code { | |
color: rgb(249, 38, 114); | |
text-decoration: none; | |
} | |
code { | |
-moz-border-radius: 5px; | |
-web-border-radius: 5px; | |
background: #e7e8e2; | |
border-radius: 5px; | |
font-size: 16px; | |
} | |
.pull-left { | |
float: left; | |
width: 47%; | |
} | |
.pull-right { | |
float: right; | |
width: 47%; | |
} | |
.pull-right ~ p { | |
clear: both; | |
} | |
#slideshow .slide .content code { | |
font-size: 0.8em; | |
} | |
#slideshow .slide .content pre code { | |
font-size: 0.9em; | |
padding: 15px; | |
} | |
.inverse { | |
background: #272822; | |
color: #777872; | |
text-shadow: 0 0 20px #333; | |
} | |
.inverse h1, .inverse h2 { | |
color: #f3f3f3; | |
line-height: 0.8em; | |
} | |
/* Slide-specific styling */ | |
#slide-inverse .footnote { | |
bottom: 12px; | |
left: 20px; | |
} | |
#slide-how .slides { | |
font-size: 0.9em; | |
position: absolute; | |
top: 151px; | |
right: 140px; | |
} | |
#slide-how .slides h3 { | |
margin-top: 0.2em; | |
} | |
#slide-how .slides .first, #slide-how .slides .second { | |
padding: 1px 20px; | |
height: 90px; | |
width: 120px; | |
-moz-box-shadow: 0 0 10px #777; | |
-webkit-box-shadow: 0 0 10px #777; | |
box-shadow: 0 0 10px #777; | |
} | |
#slide-how .slides .first { | |
background: #fff; | |
position: absolute; | |
top: 20%; | |
left: 20%; | |
z-index: 1; | |
} | |
#slide-how .slides .second { | |
position: relative; | |
background: #fff; | |
z-index: 0; | |
} | |
/* Two-column layout */ | |
.left-column { | |
color: #777; | |
width: 20%; | |
height: 92%; | |
float: left; | |
} | |
.left-column h2:last-of-type, .left-column h3:last-child { | |
color: #000; | |
} | |
.right-column { | |
width: 75%; | |
float: right; | |
padding-top: 2em; | |
} | |
</style> | |
</head> | |
<body> | |
<textarea id="source"> | |
class: center, middle | |
# %%big_title%% | |
## %%sub_title%% | |
%%description%% | |
--- | |
# %%slide1_title%% | |
1. lorem | |
2. ipsum | |
??? | |
%%notes_slide1%% | |
--- | |
# %%slide2_title%% | |
* lorem | |
* ipsum | |
--- | |
template: inverse | |
# %%big_section_title%% | |
--- | |
.left-column[ | |
## %%title1%% | |
### %%subtitle1%% | |
] | |
.right-column[ | |
* lorem | |
* ipsum | |
] | |
--- | |
.left-column[ | |
## %%title1%% | |
### %%subtitle1%% | |
### %%subtitle2%% | |
] | |
.right-column[ | |
* lorem | |
* ipsum | |
] | |
</textarea> | |
<script src="http://gnab.github.io/remark/downloads/remark-0.6.0.min.js" type="text/javascript"> | |
</script> | |
<script type="text/javascript"> | |
var slideshow = remark.create(); | |
</script> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment