diff options
Diffstat (limited to 'scripts/md/slides.md')
-rw-r--r-- | scripts/md/slides.md | 64 |
1 files changed, 64 insertions, 0 deletions
diff --git a/scripts/md/slides.md b/scripts/md/slides.md new file mode 100644 index 0000000..064b8db --- /dev/null +++ b/scripts/md/slides.md | |||
@@ -0,0 +1,64 @@ | |||
1 | title: Slide Title | ||
2 | class: image | ||
3 | |||
4 | ![Mobile vs desktop users](image.png) | ||
5 | |||
6 | --- | ||
7 | |||
8 | title: Agenda | ||
9 | class: big | ||
10 | |||
11 | Things we'll cover: | ||
12 | |||
13 | - Bullet1 | ||
14 | - Bullet2 | ||
15 | - Bullet3 | ||
16 | |||
17 | --- | ||
18 | |||
19 | title: Today | ||
20 | class: nobackground fill | ||
21 | |||
22 | ![Many kinds of devices.](image.png) | ||
23 | |||
24 | <footer class="source">source: place source info here</footer> | ||
25 | |||
26 | --- | ||
27 | |||
28 | h1: Big Title Slide | ||
29 | class: title-slide | ||
30 | |||
31 | --- | ||
32 | |||
33 | title: Code Example | ||
34 | |||
35 | Media Queries are sweet: | ||
36 | |||
37 | <pre class="prettyprint" data-lang="css"> | ||
38 | @media screen and (max-width: 640px) { | ||
39 | #sidebar { display: none; } | ||
40 | } | ||
41 | </pre> | ||
42 | |||
43 | --- | ||
44 | |||
45 | title: Once more, with JavaScript | ||
46 | |||
47 | <pre class="prettyprint" data-lang="javascript"> | ||
48 | function isSmall() { | ||
49 | return window.matchMedia("(min-device-width: ???)").matches; | ||
50 | } | ||
51 | |||
52 | function hasTouch() { | ||
53 | return Modernizr.touch; | ||
54 | } | ||
55 | |||
56 | function detectFormFactor() { | ||
57 | var device = DESKTOP; | ||
58 | if (hasTouch()) { | ||
59 | device = isSmall() ? PHONE : TABLET; | ||
60 | } | ||
61 | return device; | ||
62 | } | ||
63 | </pre> | ||
64 | |||