Skip to content

Commit 00ea5e9

Browse files
committed
hardcoded data
1 parent d0986d4 commit 00ea5e9

File tree

7 files changed

+384
-46
lines changed

7 files changed

+384
-46
lines changed

_includes/about.html

Lines changed: 3 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
<!-- About Section -->
2-
<section id="about" class="container content-section text-center">
2+
<section id="about" class="about container content-section text-center">
33

4-
<div class="row">
4+
<div class="row content-section-a">
55
<div class="col-lg-8 col-lg-offset-2">
66
<br/>
77
<br/>
@@ -11,13 +11,7 @@
1111
<div class="row">
1212
<div class="col-lg-8 col-lg-offset-2">
1313
<br/>
14-
<br/>
15-
<h2>About CodeRoad</h2>
16-
<br/>
17-
<div class="lead">CodeRoad is a coding education platform aimed at open-sourcing interactive coding lessons. CodeRoad makes it easy for developers and teachers to create, share and edit their own lessons. All free.</div>
18-
<br/>
19-
<div class="lead">CodeRoad is currently under early development.</div>
20-
14+
<div class="lead">CodeRoad is a coding education platform aimed at open-sourcing interactive coding lessons. CodeRoad makes it easy for developers and teachers to create, share and edit their own lessons. <br>All free.</div>
2115
</div>
2216
</div>
2317
</section>

_includes/head.html

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -13,10 +13,15 @@
1313

1414
<!-- Custom CSS -->
1515
<link href="css/landing-page.css" rel="stylesheet">
16+
<link href="css/prism.css" rel="stylesheet">
1617

1718
<!-- Custom Fonts -->
1819
<link href="font-awesome-4.1.0/css/font-awesome.min.css" rel="stylesheet" type="text/css">
1920
<link href="http://fonts.googleapis.com/css?family=Lato:300,400,700,300italic,400italic,700italic" rel="stylesheet" type="text/css">
21+
<link href="fonts/firacode-webfont/FiraCode-Regular.css" rel="stylesheet" type="text/css"/>
22+
<!-- <script type="text/javascript" src="fontsmoothie.min.js" async></script> -->
23+
24+
<script src="js/prism.js"></script>
2025

2126
<script>
2227
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){

_includes/page_content.html

Lines changed: 209 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -1,52 +1,224 @@
11
<section id="services">
2-
<!-- Page Content -->
3-
{% for post in site.posts reversed %}
4-
{% capture thecycle %}{% cycle 'odd', 'even' %}{% endcapture %}
5-
{% if thecycle == 'odd' %}
6-
<div class="content-section-a">
2+
<!-- Page Content -->
73

8-
<div class="container">
4+
<div class="content-section-b">
95

10-
<div class="row">
11-
<div class="col-lg-5 col-sm-6">
12-
<hr class="section-heading-spacer">
13-
<div class="clearfix"></div>
14-
<h2 class="section-heading">{{ post.title }}</h2>
15-
<div class="lead">{{ post.content }}</div>
16-
</div>
17-
<div class="col-lg-5 col-lg-offset-2 col-sm-6">
18-
<img class="img-responsive" src="img/services/{{ post.img }}" alt="">
19-
</div>
20-
</div>
6+
<div class="container">
217

8+
<div class="row">
9+
<div class="col-lg-5 col-sm-6">
10+
<!-- <hr class="section-heading-spacer"> -->
11+
<div class="clearfix"></div>
12+
<h2 class="section-heading">Learn Faster</h2>
13+
<div class="lead">The science is in: people learn best by doing, with quick feedback in a real world environment.</div>
2214
</div>
23-
<!-- /.container -->
15+
<div class="col-lg-5 col-lg-offset-2 col-sm-6">
16+
<img class="img-responsive" src="img/services/feedback.png" alt="">
17+
</div>
18+
</div>
2419

2520
</div>
26-
<!-- /.content-section-a -->
27-
{% else %}
21+
<!-- /.container -->
22+
23+
</div>
24+
<!-- /.content-section-a -->
25+
26+
<div class="content-section-a">
27+
28+
<div class="container">
29+
30+
<div class="row">
31+
<div class="col-lg-5 col-lg-offset-1 col-sm-push-6 col-sm-6">
32+
<!-- <hr class="section-heading-spacer"> -->
33+
<div class="clearfix"></div>
34+
<h2 class="section-heading">Free & Open-Sourced</h2>
35+
<div class="lead">Build, share and collaborate on courses or curriculum over Github. Publish your version controlled tutorials on NPM. Incrementally make them better with updates and pull requests.
36+
</div>
37+
</div>
38+
<div class="col-lg-5 col-sm-pull-6 col-sm-6">
39+
<img class="img-responsive" src="img/services/npm.png" alt="">
40+
</div>
41+
</div>
2842

29-
<div class="content-section-b">
43+
</div>
44+
<!-- /.container -->
3045

31-
<div class="container">
46+
</div>
47+
<!-- /.content-section-b -->
48+
<div class="content-section-b">
3249

33-
<div class="row">
34-
<div class="col-lg-5 col-lg-offset-1 col-sm-push-6 col-sm-6">
35-
<hr class="section-heading-spacer">
36-
<div class="clearfix"></div>
37-
<h2 class="section-heading">{{ post.title }}</h2>
38-
<div class="lead">{{ post.content }}</div>
39-
</div>
40-
<div class="col-lg-5 col-sm-pull-6 col-sm-6">
41-
<img class="img-responsive" src="img/services/{{ post.img }}" alt="">
42-
</div>
43-
</div>
50+
<div class="container">
4451

52+
<div class="row">
53+
<div class="col-lg-5 col-sm-6">
54+
<!-- <hr class="section-heading-spacer"> -->
55+
<div class="clearfix"></div>
56+
<h2 class="section-heading">Inside of the Editor</h2>
57+
<div class="lead">Atom-CodeRoad is built inside the free <a href="https://atom.io">Atom Editor</a>, allowing you to use it alongside your favorite packages.</div>
58+
</div>
59+
<div class="col-lg-5 col-lg-offset-2 col-sm-6">
60+
<img height="250px" src="img/services/atom-editor.png" alt="">
4561
</div>
46-
<!-- /.container -->
62+
</div>
4763

4864
</div>
49-
<!-- /.content-section-b -->
50-
{% endif %}
51-
{% endfor %}
65+
<!-- /.container -->
66+
67+
</div>
68+
<!-- /.content-section-a -->
69+
70+
<div class="content-section-a">
71+
72+
<div class="container">
73+
74+
<div class="row">
75+
<div class="col-lg-4 col-lg-offset-2 col-sm-push-6 col-sm-6">
76+
<!-- <hr class="section-heading-spacer"> -->
77+
<div class="clearfix"></div>
78+
<h2 class="section-heading">Write in Markdown</h2>
79+
<div class="lead">Write lessons using markdown. <br>
80+
See a <a href="https://github.com/coderoad/coderoad-functional-school/blob/master/tutorial/1/01/filter.md">tutorial file</a>.
81+
<br>
82+
<br>
83+
Control the editor with a simple API:
84+
<br>
85+
<br>
86+
<br>
87+
<ul>
88+
<li><code>@import</code> load another markdown file</li>
89+
<br>
90+
<li><code>@test</code> load unit tests</li>
91+
<br>
92+
<li><code>@action</code> open a file, set/insert text</li>
93+
<br>
94+
<li><code>@hint</code> add helpful clues</li>
95+
</ul>
96+
</div>
97+
</div>
98+
<div class="col-lg-6 col-sm-pull-6 col-sm-6">
99+
<pre><code class="language-markdown">
100+
# Functional School
101+
A trip through functional programming in Javascript.
102+
103+
## Array Methods
104+
Using common built-in Javascript array methods.
105+
106+
### Filter
107+
Array -> Array of items that match a condition
108+
109+
+ Write a filter condition function called `isAda`
110+
@test('1/01/01-filter')
111+
@action(open('01-filter.js'))
112+
@action(insert(
113+
```
114+
// return true if student name
115+
// matches "Ada Lovelace"
116+
function isAda() {
117+
// write condition here
118+
}
119+
```
120+
))
121+
</pre></code>
122+
</div>
123+
</div>
124+
125+
</div>
126+
<!-- /.container -->
127+
128+
</div>
129+
<!-- /.content-section-b -->
130+
131+
<div class="content-section-b">
132+
133+
<div class="container">
134+
135+
<div class="row">
136+
<div class="col-lg-4 col-sm-6">
137+
<!-- <hr class="section-heading-spacer"> -->
138+
<div class="clearfix"></div>
139+
<h2 class="section-heading">Build with Dev Tools</h2>
140+
<div class="lead"> Write task feedback using unit tests.<br>
141+
See a <a href="https://github.com/coderoad/coderoad-functional-school/blob/master/tutorial/1/01/01-filter.spec.js">complete test file</a>.
142+
<br>
143+
<br>
144+
<br>
145+
Currently supported:
146+
<br>
147+
<br>
148+
<ul>
149+
<li>Javascript: <a href="https://github.com/coderoad/mocha-coderoad">Mocha</a></li>
150+
</ul>
151+
<br>
152+
<br>
153+
<br>
154+
<i>We hope to support more test frameworks and programming languages in the near future.</i></div>
155+
</div>
156+
<div class="col-lg-6 col-lg-offset-2 col-sm-6">
157+
<pre><code class="language-js">
158+
describe('function isAda', function () {
159+
160+
it('doesn\'t exist', function () {
161+
expect(isAda).to.not.be.undefined;
162+
});
163+
164+
it('should be a function', function () {
165+
expect(isAda).to.be.a('function');
166+
});
167+
168+
it('needs to take a param', function () {
169+
expect(isAda).to.have.length(1);
170+
});
171+
172+
it('should use the full name "Ada Lovelace"', function () {
173+
var regex = /Ada Lovelace/;
174+
expect(!!isAda.toString().match(regex)).to.be.true;
175+
});
176+
177+
});
178+
</code></pre>
179+
</div>
180+
</div>
181+
182+
</div>
183+
<!-- /.container -->
184+
185+
</div>
186+
<!-- /.content-section-a -->
187+
188+
<div class="content-section-a">
189+
190+
<div class="container">
191+
192+
<div class="row">
193+
<div class="col-lg-5 col-lg-offset-1 col-sm-push-6 col-sm-6">
194+
<!-- <hr class="section-heading-spacer"> -->
195+
<div class="clearfix"></div>
196+
<h2 class="section-heading">Compile with Coderoad-CLI</h2>
197+
<div class="lead">Building tutorials is easy with the <a href="https://github.com/coderoad/coderoad-cli">coderoad-cli</a>.
198+
</div>
199+
</div>
200+
<div class="col-lg-5 col-sm-pull-6 col-sm-6">
201+
<div class="lead">
202+
<code>> npm install -g coderoad-cli</code>
203+
<br>
204+
<br>
205+
<code>> coderoad create</code>
206+
<br>
207+
<br>
208+
<code>> coderoad build</code>
209+
<br>
210+
<br>
211+
<code>> coderoad publish</code>
212+
</div>
213+
</div>
214+
</div>
215+
216+
</div>
217+
<!-- /.container -->
218+
219+
</div>
220+
<!-- /.content-section-b -->
221+
222+
223+
52224
</section>

css/landing-page.css

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@
33
* Code licensed under the Apache License v2.0.
44
* For details, see http://www.apache.org/licenses/LICENSE-2.0.
55
*/
6+
@import url('../fonts/firacode-webfont/FiraCode-Regular.css');
67

78
body,
89
html {
@@ -88,15 +89,22 @@ h6 {
8889
letter-spacing: 2px;
8990
}
9091

92+
#about {
93+
background-color: #f8f8f8;
94+
width: 100%;
95+
}
96+
9197
.content-section-a {
9298
padding: 50px 0;
9399
background-color: #f8f8f8;
100+
padding: 20px;
94101
}
95102

96103
.content-section-b {
97104
padding: 50px 0;
98105
border-top: 1px solid #e7e7e7;
99106
border-bottom: 1px solid #e7e7e7;
107+
padding: 20px;
100108
}
101109

102110
.section-heading {
@@ -164,3 +172,30 @@ footer {
164172
p.copyright {
165173
margin: 15px 0 0;
166174
}
175+
176+
ul
177+
{
178+
list-style-type: none;
179+
}
180+
181+
182+
@font-face {
183+
font-family:'FiraCode-Regular';
184+
src: url('FiraCode-Regular.eot');
185+
src: url('FiraCode-Regular.eot?#iefix') format('embedded-opentype'),
186+
url('FiraCode-Regular.woff') format('woff'),
187+
url('FiraCode-Regular.ttf') format('truetype'),
188+
url('FiraCode-Regular.svg#FiraCode-Regular') format('svg');
189+
font-weight: 400;
190+
font-style: normal;
191+
font-stretch: normal;
192+
unicode-range: U+000D-1F310;
193+
}
194+
195+
pre > code {
196+
padding: 20px;
197+
}
198+
code {
199+
font-family: "FiraCode-Regular" !important;
200+
padding: 10px;
201+
}

0 commit comments

Comments
 (0)