Skip to content

Commit f6ce9d6

Browse files
KimberleyCookKimberleyCook
authored
Merge pull request #338 from codebar/adjust-homepage
amend to tutorial homepage
2 parents 4408a9a + 0810469 commit f6ce9d6

3 files changed

Lines changed: 121 additions & 120 deletions

File tree

‎assets/codebar_logo.png‎

8.68 KB
Loading

‎index.html‎

Lines changed: 101 additions & 105 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
<head>
44
<meta charset="utf-8">
55
<meta http-equiv="X-UA-Compatible" content="chrome=1">
6-
<title>codebar.io - Tutorials by codebar</title>
6+
<title>codebar - Tutorials by codebar</title>
77

88
<link rel="stylesheet" href="stylesheets/styles.css">
99
<link rel="stylesheet" href="stylesheets/custom.css">
@@ -15,12 +15,13 @@
1515
</head>
1616
<body>
1717
<div class="wrapper">
18-
<header>
19-
<h1><a href="https://codebar.io">codebar.io</a></h1>
20-
<p>Tutorials</p>
2118

22-
<p class="view"><a href="https://github.com/codebar/tutorials">View on GitHub <small>codebar/tutorials</small></a></p>
19+
<header>
20+
<h1>codebar tutorials</h1>
21+
<img src="assets/codebar_logo.png" class="logo" alt="codebar logo">
22+
<p class="view"><a href="https://github.com/codebar/tutorials">View our tutorials on GitHub</a></p>
2323
</header>
24+
2425
<section>
2526
<p class="lead">
2627
Are you working on the tutorials on your own time?
@@ -29,111 +30,106 @@ <h1><a href="https://codebar.io">codebar.io</a></h1>
2930
</p>
3031

3132
<h2>Guides</h2>
33+
3234
<ul>
3335
<li><a href="general/setup/tutorial.html">Getting started guide for students.</a>
34-
<br> If you're new to codebar, follow this to set up your computer.</li>
36+
<br>(If you're new to codebar, follow this to set up your computer.)</li>
3537
<li><a href="coaches/lesson-guide.html">Lesson guide for coaches</a></li>
3638
</ul>
3739

38-
<h2>HTML &amp; CSS</h2>
39-
<ul>
40-
<li><a href="html/lesson1/tutorial.html">Lesson 1 - Introducing HTML</a></li>
41-
<li><a href="html/lesson2/tutorial.html">Lesson 2 - Introducing CSS</a></li>
42-
<li><a href="html/lesson3/tutorial.html">Lesson 3 - Beyond the basics</a></li>
43-
<li><a href="html/lesson4/tutorial.html">Lesson 4 - CSS, layouts and formatting</a></li>
44-
<li><a href="html/lesson5/tutorial.html">Lesson 5 - Dive into HTML5 &amp; CSS3</a></li>
45-
<li><a href="html/lesson6/tutorial.html">Lesson 6 - Advanced HTML5</a></li>
46-
<li><a href="html/lesson7/tutorial.html">Lesson 7 - Media queries and responsive design</a></li>
47-
</ul>
48-
49-
<h2>Command Line</h2>
50-
<ul>
51-
<li><a href="command-line/introduction/tutorial.html">Lesson 1 - Introduction to the command line</a></li>
52-
</ul>
53-
54-
<h2>Version Control</h2>
55-
<ul>
56-
<li><a href="version-control/introduction/tutorial.html">Introduction to version control</a></li>
57-
<li><a href="version-control/command-line/tutorial.html">Introduction to the git command line</a></li>
58-
</ul>
59-
60-
<h2>JavaScript</h2>
61-
<ul>
62-
<li><a href="js/lesson1/tutorial.html">Lesson 1 - Introduction to JavaScript</a></li>
63-
<li><a href="js/lesson2/tutorial.html">Lesson 2 - Expressions, Loops and Arrays</a></li>
64-
<li><a href="js/lesson3/tutorial.html">Lesson 3 - Introduction to jQuery</a></li>
65-
<li><a href="js/lesson4/tutorial.html">Lesson 4 - HTTP Requests, AJAX and APIs</a></li>
66-
<li><a href="js/lesson5/tutorial.html">Lesson 5 - HTTP Requests, AJAX and APIs (part 2)</a></li>
67-
<li><a href="js/lesson6/tutorial.html">Lesson 6 - Drawing in Canvas</a></li>
68-
<li><a href="js/lesson7/tutorial.html">Lesson 7 - Introduction to Testing</a></li>
69-
<li><a href="js/lesson8/tutorial.html">Lesson 8 - Building your own app</a></li>
70-
</ul>
71-
72-
<h2>Ruby</h2>
73-
74-
<p class="lead">If you are just getting started with Ruby, we recommend using <a href="http://nitrous.io">nitrous.io</a>, as setting up your local environment can be time consuming.</p>
75-
76-
<ul>
77-
<li><a href="ruby/lesson1/tutorial.html">Lesson 1 - Introduction to Ruby</a></li>
78-
<li><a href="ruby/lesson2/tutorial.html">Lesson 2 - Ruby Basics</a></li>
79-
<li><a href="ruby/lesson3/tutorial.html">Lesson 3 - Ruby Basics (part 2)</a></li>
80-
<li><a href="ruby/lesson4/tutorial.html">Lesson 4 - Object Oriented Ruby and Inheritance</a></li>
81-
<li><a href="ruby/lesson5/tutorial.html">Lesson 5 - Object Oriented Ruby and Inheritance (part 2)</a></li>
82-
</ul>
83-
84-
<h2>Python</h2>
85-
86-
<ul>
87-
<li><a href="python/lesson0/tutorial.html">Installing Python</a></li>
88-
<li><a href="python/lesson1/tutorial.html">Lesson 1 - Strings, Integers and Floats</a></li>
89-
<li><a href="python/lesson2/tutorial.html">Lesson 2 - Playing with variables</a></li>
90-
<li><a href="python/lesson3/tutorial.html">Lesson 3 - Lists, Tuples and Dictionaries</a></li>
91-
<li><a href="python/lesson4/tutorial.html">Lesson 4 - Fun with Functions</a></li>
92-
</ul>
93-
94-
<h3>Other Recommended Python Resources</h3>
95-
<ul>
96-
<li><a href="http://pymbook.readthedocs.io/en/latest/">Python For You and Me</li>
97-
<li><a href="https://learnpythonthehardway.org/book/">Learn Python The Hard Way</li>
98-
</ul>
99-
100-
<h2>Android</h2>
101-
102-
<ul>
103-
<li><a href="android/introduction/tutorial.html">Lesson 1 -
104-
Introduction to Android Development with Cookie
105-
Clicker</a></li>
106-
</ul>
107-
108-
<h2>PHP</h2>
109-
110-
<p class="lead">If you are just getting started quickly and easily with PHP, we recommend using <a href="https://docs.c9.io/docs/getting-started">cloud9Ide</a>, as setting up your local environment can be time consuming.</p>
111-
112-
<ul>
113-
<li><a href="php/lesson1/tutorial.html">Lesson 1 - Introduction to PHP</a></li>
114-
</ul>
115-
116-
<h2>Other Useful Resources</h2>
117-
<p>The following resources can be helpful to continue learning. They all have content related to the topics listed above.</p>
118-
<ul>
119-
<li><a href="https://www.codewars.com/">Codewars</a></li>
120-
<li><a href="https://www.codecademy.com/">Codecademy</a></li>
121-
</ul>
122-
123-
</section>
124-
<footer>
125-
</footer>
126-
</div>
127-
<script src="javascripts/scale.fix.js"></script>
128-
<script type="text/javascript">
129-
var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
130-
document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
131-
</script>
132-
<script type="text/javascript">
133-
try {
134-
var pageTracker = _gat._getTracker("UA-45098414-1");
135-
pageTracker._trackPageview();
136-
} catch(err) {}
40+
<h2>HTML &amp; CSS</h2>
41+
<ul>
42+
<li><a href="html/lesson1/tutorial.html">Lesson 1 - Introducing HTML</a></li>
43+
<li><a href="html/lesson2/tutorial.html">Lesson 2 - Introducing CSS</a></li>
44+
<li><a href="html/lesson3/tutorial.html">Lesson 3 - Beyond the basics</a></li>
45+
<li><a href="html/lesson4/tutorial.html">Lesson 4 - CSS, layouts and formatting</a></li>
46+
<li><a href="html/lesson5/tutorial.html">Lesson 5 - Dive into HTML5 &amp; CSS3</a></li>
47+
<li><a href="html/lesson6/tutorial.html">Lesson 6 - Advanced HTML5</a></li>
48+
<li><a href="html/lesson7/tutorial.html">Lesson 7 - Media queries and responsive design</a></li>
49+
</ul>
50+
51+
<h2>JavaScript</h2>
52+
<ul>
53+
<li><a href="js/lesson1/tutorial.html">Lesson 1 - Introduction to JavaScript</a></li>
54+
<li><a href="js/lesson2/tutorial.html">Lesson 2 - Expressions, Loops and Arrays</a></li>
55+
<li><a href="js/lesson3/tutorial.html">Lesson 3 - Introduction to jQuery</a></li>
56+
<li><a href="js/lesson4/tutorial.html">Lesson 4 - HTTP Requests, AJAX and APIs</a></li>
57+
<li><a href="js/lesson5/tutorial.html">Lesson 5 - HTTP Requests, AJAX and APIs (part 2)</a></li>
58+
<li><a href="js/lesson6/tutorial.html">Lesson 6 - Drawing in Canvas</a></li>
59+
<li><a href="js/lesson7/tutorial.html">Lesson 7 - Introduction to Testing</a></li>
60+
<li><a href="js/lesson8/tutorial.html">Lesson 8 - Building your own app</a></li>
61+
</ul>
62+
63+
<h2>Ruby</h2>
64+
<p class="lead">If you are just getting started with Ruby, we recommend using <a href="http://nitrous.io">nitrous.io</a>, as setting up your local environment can be time consuming.</p>
65+
66+
<ul>
67+
<li><a href="ruby/lesson1/tutorial.html">Lesson 1 - Introduction to Ruby</a></li>
68+
<li><a href="ruby/lesson2/tutorial.html">Lesson 2 - Ruby Basics</a></li>
69+
<li><a href="ruby/lesson3/tutorial.html">Lesson 3 - Ruby Basics (part 2)</a></li>
70+
<li><a href="ruby/lesson4/tutorial.html">Lesson 4 - Object Oriented Ruby and Inheritance</a></li>
71+
<li><a href="ruby/lesson5/tutorial.html">Lesson 5 - Object Oriented Ruby and Inheritance (part 2)</a></li>
72+
</ul>
73+
74+
<h2>Python</h2>
75+
<ul>
76+
<li><a href="python/lesson0/tutorial.html">Installing Python</a></li>
77+
<li><a href="python/lesson1/tutorial.html">Lesson 1 - Strings, Integers and Floats</a></li>
78+
<li><a href="python/lesson2/tutorial.html">Lesson 2 - Playing with variables</a></li>
79+
<li><a href="python/lesson3/tutorial.html">Lesson 3 - Lists, Tuples and Dictionaries</a></li>
80+
<li><a href="python/lesson4/tutorial.html">Lesson 4 - Fun with Functions</a></li>
81+
</ul>
82+
83+
<h3>Other Recommended Python Resources</h3>
84+
<ul>
85+
<li><a href="http://pymbook.readthedocs.io/en/latest/">Python For You and Me</li>
86+
<li><a href="https://learnpythonthehardway.org/book/">Learn Python The Hard Way</li>
87+
</ul>
88+
89+
<h2>Android</h2>
90+
<ul>
91+
<li><a href="android/introduction/tutorial.html">Lesson 1 -
92+
Introduction to Android Development with Cookie
93+
Clicker</a></li>
94+
</ul>
95+
96+
<h2>PHP</h2>
97+
<p class="lead">If you are just getting started quickly and easily with PHP, we recommend using <a href="https://docs.c9.io/docs/getting-started">cloud9Ide</a>, as setting up your local environment can be time consuming.</p>
98+
99+
<ul>
100+
<li><a href="php/lesson1/tutorial.html">Lesson 1 - Introduction to PHP</a></li>
101+
</ul>
102+
103+
<h2>Command Line</h2>
104+
<ul>
105+
<li><a href="command-line/introduction/tutorial.html">Lesson 1 - Introduction to the command line</a></li>
106+
</ul>
107+
108+
<h2>Version Control</h2>
109+
<ul>
110+
<li><a href="version-control/introduction/tutorial.html">Introduction to version control</a></li>
111+
<li><a href="version-control/command-line/tutorial.html">Introduction to the git command line</a></li>
112+
</ul>
113+
114+
<h2>Other Useful Resources</h2>
115+
<p>The following resources can be helpful to continue learning. They all have content related to the topics listed above.</p>
116+
<ul>
117+
<li><a href="https://www.codewars.com/">Codewars</a></li>
118+
<li><a href="https://www.codecademy.com/">Codecademy</a></li>
119+
</ul>
120+
121+
</section>
122+
</div>
123+
<script src="javascripts/scale.fix.js"></script>
124+
<script type="text/javascript">
125+
var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
126+
document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
127+
</script>
128+
<script type="text/javascript">
129+
try {
130+
var pageTracker = _gat._getTracker("UA-45098414-1");
131+
pageTracker._trackPageview();
132+
} catch(err) {}
137133
</script>
138134

139135
</body>

‎stylesheets/styles.css‎

Lines changed: 20 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
@import url(https://fonts.googleapis.com/css?family=Lato:300italic,700italic,300,700);
22

33
body {
4-
padding: 50px;
4+
padding: 25px;
55
font: 14px/1.5 Lato, "Helvetica Neue", Helvetica, Arial, sans-serif;
66
color: #777;
77
font-weight: 300;
@@ -50,6 +50,11 @@ a small {
5050
margin: 0 auto;
5151
}
5252

53+
.logo {
54+
width: 125px;
55+
margin-bottom: 20px;
56+
}
57+
5358
blockquote {
5459
border-left: 1px solid #e5e5e5;
5560
margin: 0;
@@ -65,7 +70,7 @@ code, pre {
6570

6671
pre {
6772
padding: 8px 15px;
68-
background: #f8f8f8;
73+
background: #f8f8f8;
6974
border-radius: 5px;
7075
border: 1px solid #e5e5e5;
7176
overflow-x: auto;
@@ -104,17 +109,17 @@ header {
104109
header ul {
105110
list-style: none;
106111
height: 40px;
107-
112+
108113
padding: 0;
109-
114+
110115
background: #eee;
111116
background: -moz-linear-gradient(top, #f8f8f8 0%, #dddddd 100%);
112117
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f8f8f8), color-stop(100%,#dddddd));
113118
background: -webkit-linear-gradient(top, #f8f8f8 0%,#dddddd 100%);
114119
background: -o-linear-gradient(top, #f8f8f8 0%,#dddddd 100%);
115120
background: -ms-linear-gradient(top, #f8f8f8 0%,#dddddd 100%);
116121
background: linear-gradient(top, #f8f8f8 0%,#dddddd 100%);
117-
122+
118123
border-radius: 5px;
119124
border: 1px solid #d2d2d2;
120125
box-shadow: inset #fff 0 1px 0, inset rgba(0,0,0,0.03) 0 -1px 0;
@@ -184,33 +189,33 @@ footer {
184189
}
185190

186191
@media print, screen and (max-width: 960px) {
187-
192+
188193
div.wrapper {
189194
width: auto;
190195
margin: 0;
191196
}
192-
197+
193198
header, section, footer {
194199
float: none;
195200
position: static;
196201
width: auto;
197202
}
198-
203+
199204
header {
200205
padding-right: 320px;
201206
}
202-
207+
203208
section {
204209
border: 1px solid #e5e5e5;
205210
border-width: 1px 0;
206211
padding: 20px 0;
207212
margin: 0 0 20px;
208213
}
209-
214+
210215
header a small {
211216
display: inline;
212217
}
213-
218+
214219
header ul {
215220
position: absolute;
216221
right: 50px;
@@ -222,15 +227,15 @@ footer {
222227
body {
223228
word-wrap: break-word;
224229
}
225-
230+
226231
header {
227232
padding: 0;
228233
}
229-
234+
230235
header ul, header p.view {
231236
position: static;
232237
}
233-
238+
234239
pre, code {
235240
word-wrap: normal;
236241
}
@@ -240,7 +245,7 @@ footer {
240245
body {
241246
padding: 15px;
242247
}
243-
248+
244249
header ul {
245250
display: none;
246251
}

0 commit comments

Comments
 (0)