Skip to content

Commit a84c08c

Browse files
calebsmithcalebsmith
committed
WIP - Moved more of class1 over to part1.md and fixed external markdown
1 parent 6bd5703 commit a84c08c

File tree

8 files changed

+278
-106
lines changed

8 files changed

+278
-106
lines changed

‎.gitmodules

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
[submodule "reveal"]
2+
path = reveal
3+
url = https://github.com/hakimel/reveal.js

‎css/dark.css

+52
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,52 @@
1+
/* Tomorrow Night Theme */
2+
/* http://jmblog.github.com/color-themes-for-google-code-highlightjs */
3+
/* Original theme - https://github.com/chriskempson/tomorrow-theme */
4+
/* http://jmblog.github.com/color-themes-for-google-code-highlightjs */
5+
.tomorrow-comment, pre .comment, pre .title {
6+
color: #969896;
7+
}
8+
9+
.tomorrow-red, pre .variable, pre .attribute, pre .tag, pre .regexp, pre .ruby .constant, pre .xml .tag .title, pre .xml .pi, pre .xml .doctype, pre .html .doctype, pre .css .id, pre .css .class, pre .css .pseudo {
10+
color: #cc6666;
11+
}
12+
13+
.tomorrow-orange, pre .number, pre .preprocessor, pre .built_in, pre .literal, pre .params, pre .constant {
14+
color: #de935f;
15+
}
16+
17+
.tomorrow-yellow, pre .class, pre .ruby .class .title, pre .css .rules .attribute {
18+
color: #f0c674;
19+
}
20+
21+
.tomorrow-green, pre .string, pre .value, pre .inheritance, pre .header, pre .ruby .symbol, pre .xml .cdata {
22+
color: #b5bd68;
23+
}
24+
25+
.tomorrow-aqua, pre .css .hexcolor {
26+
color: #8abeb7;
27+
}
28+
29+
.tomorrow-blue, pre .function, pre .python .decorator, pre .python .title, pre .ruby .function .title, pre .ruby .title .keyword, pre .perl .sub, pre .javascript .title, pre .coffeescript .title {
30+
color: #81a2be;
31+
}
32+
33+
.tomorrow-purple, pre .keyword, pre .javascript .function {
34+
color: #b294bb;
35+
}
36+
37+
pre code {
38+
display: block;
39+
background: #1d1f21;
40+
color: #c5c8c6;
41+
padding: 0.5em;
42+
}
43+
44+
pre .coffeescript .javascript,
45+
pre .javascript .xml,
46+
pre .tex .formula,
47+
pre .xml .javascript,
48+
pre .xml .vbscript,
49+
pre .xml .css,
50+
pre .xml .cdata {
51+
opacity: 0.5;
52+
}

‎css/fonts/Gotham/Gotham-Bold.otf

154 KB
Binary file not shown.

‎css/fonts/Gotham/Gotham-Book.otf

155 KB
Binary file not shown.

‎css/gdicool.css

+153
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,153 @@
1+
@font-face {
2+
font-family: "Gotham";
3+
src: local("Gotham"), url("fonts/Gotham/Gotham-Medium.otf") format("opentype");
4+
font-weight: normal;
5+
font-style: normal; }
6+
7+
@font-face {
8+
font-family: "Gotham-Book";
9+
src: local("Gotham-Book"), url("fonts/Gotham/Gotham-Book.otf") format("opentype");
10+
font-weight: normal;
11+
font-style: normal; }
12+
13+
@font-face {
14+
font-family: "Gotham-Italic";
15+
src: local("Gotham-Italic"), url("fonts/Gotham/Gotham-MediumItalic.otf") format("opentype");
16+
font-weight: normal;
17+
font-style: italic; }
18+
19+
@font-face {
20+
font-family: "Gotham-Bold";
21+
src: local("Gotham-Bold"), url("fonts/Gotham/Gotham-Bold.otf") format("opentype");
22+
font-weight: bold;
23+
font-style: bold; }
24+
25+
/*********************************************
26+
* GLOBAL STYLES
27+
*********************************************/
28+
body {
29+
background: #e9f1da;
30+
background: -moz-radial-gradient(center, circle cover, #f7fbfc 0%, #e9f1da 100%);
31+
background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%, #f7fbfc), color-stop(100%, #e9f1da));
32+
background: -webkit-radial-gradient(center, circle cover, #f7fbfc 0%, #e9f1da 100%);
33+
background: -o-radial-gradient(center, circle cover, #f7fbfc 0%, #e9f1da 100%);
34+
background: -ms-radial-gradient(center, circle cover, #f7fbfc 0%, #e9f1da 100%);
35+
background: radial-gradient(center, circle cover, #f7fbfc 0%, #e9f1da 100%);
36+
background-color: #92bb44; }
37+
38+
.reveal {
39+
font-family: "Gotham-Book", "Helvetica", Arial, sans-serif;
40+
font-size: 36px;
41+
font-weight: 200;
42+
letter-spacing: -0.02em;
43+
color: #333333; }
44+
45+
::selection {
46+
color: white;
47+
background: #134674;
48+
text-shadow: none; }
49+
50+
/*********************************************
51+
* HEADERS
52+
*********************************************/
53+
.reveal h1,
54+
.reveal h2,
55+
.reveal h3,
56+
.reveal h4,
57+
.reveal h5,
58+
.reveal h6 {
59+
margin: 0 0 20px 0;
60+
color: #8b0036;
61+
font-family: "Gotham-Bold", Impact, sans-serif;
62+
line-height: 0.9em;
63+
letter-spacing: 0.02em;
64+
text-transform: uppercase;
65+
text-shadow: 0px 0px 6px rgba(0, 0, 0, 0.2); }
66+
67+
.reveal h1 {
68+
text-shadow: 0px 0px 6px rgba(0, 0, 0, 0.2); }
69+
70+
/*********************************************
71+
* LINKS
72+
*********************************************/
73+
.reveal a:not(.image) {
74+
color: #01a9b4;
75+
text-decoration: none;
76+
-webkit-transition: color .15s ease;
77+
-moz-transition: color .15s ease;
78+
-ms-transition: color .15s ease;
79+
-o-transition: color .15s ease;
80+
transition: color .15s ease; }
81+
82+
.reveal a:not(.image):hover {
83+
color: #f9b8bb;
84+
text-shadow: none;
85+
border: none; }
86+
87+
.reveal .roll span:after {
88+
color: #fff;
89+
background: #01a9b4; }
90+
91+
/*********************************************
92+
* IMAGES
93+
*********************************************/
94+
.reveal section img {
95+
margin: 15px;
96+
background: rgba(255, 255, 255, 0.12);
97+
border: 4px solid #333333;
98+
box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
99+
-webkit-transition: all .2s linear;
100+
-moz-transition: all .2s linear;
101+
-ms-transition: all .2s linear;
102+
-o-transition: all .2s linear;
103+
transition: all .2s linear; }
104+
105+
.reveal a:hover img {
106+
background: rgba(255, 255, 255, 0.2);
107+
border-color: #01a9b4;
108+
box-shadow: 0 0 20px rgba(0, 0, 0, 0.55); }
109+
110+
/*********************************************
111+
* NAVIGATION CONTROLS
112+
*********************************************/
113+
.reveal .controls div.left,
114+
.reveal .controls div.left.enabled {
115+
border-right-color: #01a9b4; }
116+
117+
.reveal .controls div.right,
118+
.reveal .controls div.right.enabled {
119+
border-left-color: #01a9b4; }
120+
121+
.reveal .controls div.up,
122+
.reveal .controls div.up.enabled {
123+
border-bottom-color: #01a9b4; }
124+
125+
.reveal .controls div.down,
126+
.reveal .controls div.down.enabled {
127+
border-top-color: #01a9b4; }
128+
129+
.reveal .controls div.left.enabled:hover {
130+
border-right-color: #f9b8bb; }
131+
132+
.reveal .controls div.right.enabled:hover {
133+
border-left-color: #f9b8bb; }
134+
135+
.reveal .controls div.up.enabled:hover {
136+
border-bottom-color: #f9b8bb; }
137+
138+
.reveal .controls div.down.enabled:hover {
139+
border-top-color: #f9b8bb; }
140+
141+
/*********************************************
142+
* PROGRESS BAR
143+
*********************************************/
144+
.reveal .progress {
145+
background: rgba(0, 0, 0, 0.2); }
146+
147+
.reveal .progress span {
148+
background: #01a9b4;
149+
-webkit-transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985);
150+
-moz-transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985);
151+
-ms-transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985);
152+
-o-transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985);
153+
transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); }

‎part1.html

+10-102
Original file line numberDiff line numberDiff line change
@@ -13,27 +13,15 @@
1313
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
1414

1515
<link rel="stylesheet" href="reveal/css/reveal.css">
16-
<link rel="stylesheet" href="reveal/css/theme/gdicool.css" id="theme">
16+
<link rel="stylesheet" href="css/gdicool.css" id="theme">
1717
<!-- For syntax highlighting -->
18-
<!-- dark editor--><link rel="stylesheet" href="reveal/lib/css/dark.css">
18+
<link rel="stylesheet" href="css/dark.css">
19+
1920

2021
<!-- If use the PDF print sheet so students can print slides-->
2122

2223
<link rel="stylesheet" href="reveal/css/print/pdf.css" type="text/css" media="print">
2324

24-
<!-- Style Overrides of GDI theme and reveal styles -->
25-
<style>
26-
h1, h2, h3, h4, h5, h6 {
27-
text-align: center;
28-
}
29-
// FIXME: Image still isn't centered
30-
img {
31-
display: block;
32-
position: relative;
33-
margin-left: 0px auto;
34-
margin-right: 0px auto;
35-
}
36-
</style>
3725
<!--[if lt IE 9]>
3826
<script src="lib/js/html5shiv.js"></script>
3927
<![endif]-->
@@ -42,96 +30,15 @@
4230

4331
<body>
4432
<div class="reveal">
45-
<!-- Any section element inside of this container is displayed as a slide -->
4633
<div class="slides">
47-
<!-- Opening slide -->
48-
<section>
49-
<img src="images/gdi_logo_badge.png">
50-
<h3>Intro to Python</h3>
51-
<h4>Class 1</h4>
52-
</section>
53-
54-
<section data-markdown="part1.md"
55-
data-separator="^\n\n\n"
56-
data-vertical="^\n\n"
57-
data-notes="^Note:">
58-
</section>
59-
60-
<section>
61-
<h3>What we will cover today</h3>
62-
<ul>
63-
<li class ="fragment">Why Python?</li>
64-
<li class ="fragment">What is programming?</li>
65-
<li class ="fragment">Variables and arithmetic</li>
66-
<li class ="fragment">Statements and Error Messages</li>
67-
<li class ="fragment">Development Environment Setup</li>
68-
</ul>
34+
<!-- load the markdown file for all of the slide content -->
35+
<section data-markdown="part1.md"
36+
data-separator="^}\n\n"
37+
data-vertical="^\n\n"
38+
data-notes="^Note:">
6939
</section>
7040

7141
<!-- Block 1: 25 minutes -->
72-
<section>
73-
<h3>Why Python?</h3>
74-
<ul>
75-
<li class ="fragment">Suitable for beginners, yet used by professionals</li>
76-
<li class ="fragment">Readable, maintainable code</li>
77-
<li class ="fragment">Rapid rate of development</li>
78-
<li class ="fragment">Few "magical" side-effects</li>
79-
<li class ="fragment">Variety of applications</li>
80-
</ul>
81-
</section>
82-
83-
<section>
84-
<h3>What is Python used for?</h3>
85-
<ul>
86-
<li class ="fragment">System Administration (Fabric, Salt, Ansible)</li>
87-
<li class ="fragment">3D animation and image editing (Maya, Blender, Gimp)</li>
88-
<li class ="fragment">Scientific computing (numpy, scipy)</li>
89-
<li class ="fragment">Web development (Django, Flask)</li>
90-
<li class ="fragment">Game Development (Civilization 4, EVE Online)</li>
91-
</ul>
92-
</section>
93-
94-
<section>
95-
<h3>Who is using Python?</h3>
96-
<ul>
97-
<li>Disney</li>
98-
<li>Dropbox</li>
99-
<li>Canonical and Red Hat</li>
100-
<li>Google</li>
101-
<li>NASA</li>
102-
</ul>
103-
</section>
104-
105-
<section>
106-
<h3>What is programming?</h3>
107-
<ul>
108-
<li class="fragment">Teaching the computer to do a task</li>
109-
<li class="fragment">A program is made of one or more files of code, each of which solve part of the overall task</li>
110-
<li class="fragment">Programming code is human readable but also needs a form that the computer can run directly. This form is not human readable.</li>
111-
<li class="fragment">To create the form of code the computer can use, we use the Python <a href="http://en.wikipedia.org/wiki/Interpreter_(computing)">interpreter</a>. Other languages use other interpreters or a <a href="http://en.wikipedia.org/wiki/Compiler">compiler</a></li>
112-
<li class="fragment">Don't focus on what's "under the hood" for now. We will "drive the car" first</li>
113-
<li class="fragment">In other words, there are many layers to the onion. We start at one layer and slowly move toward layers that are beneath or above us</li>
114-
</ul>
115-
</section>
116-
117-
<section>
118-
<h3>Command line, Python Shell, Text Editors</h3>
119-
<table>
120-
<tr>
121-
<td><strong>Terminal</strong></td>
122-
<td>A program that has a command line interface and issues commands to the operating system.</td>
123-
</tr>
124-
<tr>
125-
<td><strong>Python Shell</strong></td>
126-
<td>A command line program that runs inside of the terminal, takes Python code as input, interprets it, and prints out any results.</td>
127-
</tr>
128-
<tr>
129-
<td><strong>Text Editor</strong></td>
130-
<td>A program that opens text files and allows the user to edit and save them. (Different than a word processor).</td>
131-
</tr>
132-
</table>
133-
</section>
134-
13542
<section>
13643
<h3>Example Text Editors</h3>
13744
<table>
@@ -418,14 +325,15 @@ <h3>Questions?</h3>
418325
controls: true,
419326
progress: true,
420327
history: true,
328+
slideNumber: true,
421329

422330
theme: Reveal.getQueryHash().theme, // available themes are in /css/theme
423331
transition: Reveal.getQueryHash().transition || 'default', // default/cube/page/concave/zoom/linear/none
424332

425333
// Optional libraries used to extend on reveal.js
426334
dependencies: [
427335
{ src: 'reveal/lib/js/classList.js', condition: function() { return !document.body.classList; } },
428-
{ src: 'reveal/plugin/markdown/showdown.js', condition: function() { return !!document.querySelector( '[data-markdown]' ); } },
336+
{ src: 'reveal/plugin/markdown/marked.js', condition: function() { return !!document.querySelector( '[data-markdown]' ); } },
429337
{ src: 'reveal/plugin/markdown/markdown.js', condition: function() { return !!document.querySelector( '[data-markdown]' ); } },
430338
{ src: 'reveal/plugin/highlight/highlight.js', async: true, callback: function() { hljs.initHighlightingOnLoad(); } },
431339
{ src: 'reveal/plugin/zoom-js/zoom.js', async: true, condition: function() { return !!document.body.classList; } },

0 commit comments

Comments
 (0)