|
0
|
1 <!--
|
|
|
2 Google IO 2012 HTML5 Slide Template
|
|
|
3
|
|
|
4 Authors: Eric Bidelman <ebidel@gmail.com>
|
|
|
5 Luke Mahe <lukem@google.com>
|
|
|
6
|
|
|
7 URL: https://code.google.com/p/io-2012-slides
|
|
|
8 -->
|
|
|
9 <!DOCTYPE html>
|
|
|
10 <html>
|
|
|
11 <head>
|
|
|
12 <title>Google IO 2012</title>
|
|
|
13 <meta charset="utf-8">
|
|
|
14 <meta http-equiv="X-UA-Compatible" content="chrome=1">
|
|
|
15 <!--<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0">-->
|
|
|
16 <!--<meta name="viewport" content="width=device-width, initial-scale=1.0">-->
|
|
|
17 <!--This one seems to work all the time, but really small on ipad-->
|
|
|
18 <!--<meta name="viewport" content="initial-scale=0.4">-->
|
|
|
19 <meta name="apple-mobile-web-app-capable" content="yes">
|
|
|
20 <link rel="stylesheet" media="all" href="theme/css/default.css">
|
|
|
21 <link rel="stylesheet" media="all" href="theme/css/app.css">
|
|
|
22 <link rel="stylesheet" media="only screen and (max-device-width: 480px)" href="theme/css/phone.css">
|
|
|
23 <base target="_blank"> <!-- This amazingness opens all links in a new tab. -->
|
|
|
24 <script data-main="js/slides" src="js/require-1.0.8.min.js"></script>
|
|
|
25 </head>
|
|
|
26 <body style="opacity: 0">
|
|
|
27
|
|
|
28 <slides class="layout-widescreen">
|
|
|
29
|
|
|
30 <!-- <slide class="logoslide nobackground">
|
|
|
31 <article class="flexbox vcenter">
|
|
|
32 <span><img src="images/google_developers_logo.png"></span>
|
|
|
33 </article>
|
|
|
34 </slide>
|
|
|
35 -->
|
|
|
36 <slide class="title-slide segue nobackground">
|
|
|
37 <aside class="gdbar"><img src="images/google_developers_icon_128.png"></aside>
|
|
|
38 <!-- The content of this hgroup is replaced programmatically through the slide_config.json. -->
|
|
|
39 <hgroup class="auto-fadein">
|
|
|
40 <h1 data-config-title><!-- populated from slide_config.json --></h1>
|
|
|
41 <h2 data-config-subtitle><!-- populated from slide_config.json --></h2>
|
|
|
42 <p data-config-presenter><!-- populated from slide_config.json --></p>
|
|
|
43 </hgroup>
|
|
|
44 </slide>
|
|
|
45
|
|
|
46 {% for slide in slides %}
|
|
|
47 <slide {% if slide.class %}class="{{- slide.class -}}"{% endif %} {% if slide.image %}style="background-image: url({{- slide.image -}})"{% endif %}>
|
|
|
48 {% if 'segue' in slide.class %}
|
|
|
49 <aside class="gdbar"><img src="images/google_developers_icon_128.png"></aside>
|
|
|
50 <hgroup class="auto-fadein">
|
|
|
51 <h2>{{- slide.title -}}</h2>
|
|
|
52 <h3>{{- slide.subtitle -}}</h3>
|
|
|
53 </hgroup>
|
|
|
54 {% else %}
|
|
|
55 <hgroup>
|
|
|
56 <h2>{{- slide.title -}}</h2>
|
|
|
57 <h3>{{- slide.subtitle -}}</h3>
|
|
|
58 </hgroup>
|
|
|
59 <article {% if slide.content_class %}class="{{- slide.content_class -}}"{% endif %}>
|
|
|
60 {{- slide.content -}}
|
|
|
61 </article>
|
|
|
62 {% endif %}
|
|
|
63 </slide>
|
|
|
64 {% endfor %}
|
|
|
65
|
|
|
66 <slide class="thank-you-slide segue nobackground">
|
|
|
67 <aside class="gdbar right"><img src="images/google_developers_icon_128.png"></aside>
|
|
|
68 <article class="flexbox vleft auto-fadein">
|
|
|
69 <h2><Thank You!></h2>
|
|
|
70 <p>Important contact information goes here.</p>
|
|
|
71 </article>
|
|
|
72 <p class="auto-fadein" data-config-contact>
|
|
|
73 <!-- populated from slide_config.json -->
|
|
|
74 </p>
|
|
|
75 </slide>
|
|
|
76
|
|
|
77 <!-- <slide class="logoslide dark nobackground">
|
|
|
78 <article class="flexbox vcenter">
|
|
|
79 <span><img src="images/google_developers_logo_white.png"></span>
|
|
|
80 </article>
|
|
|
81 </slide> -->
|
|
|
82
|
|
|
83 <slide class="backdrop"></slide>
|
|
|
84
|
|
|
85 </slides>
|
|
|
86
|
|
|
87 <script>
|
|
|
88 var _gaq = _gaq || [];
|
|
|
89 _gaq.push(['_setAccount', 'UA-XXXXXXXX-1']);
|
|
|
90 _gaq.push(['_trackPageview']);
|
|
|
91
|
|
|
92 (function() {
|
|
|
93 var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
|
|
|
94 ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
|
|
|
95 var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
|
|
|
96 })();
|
|
|
97 </script>
|
|
|
98
|
|
|
99 <!--[if IE]>
|
|
|
100 <script src="http://ajax.googleapis.com/ajax/libs/chrome-frame/1/CFInstall.min.js"></script>
|
|
|
101 <script>CFInstall.check({mode: 'overlay'});</script>
|
|
|
102 <![endif]-->
|
|
|
103 </body>
|
|
|
104 </html>
|
