Skip to content

Commit 9b64f90

Browse files
author
Markus Bertling
committed
first draft of materials page
1 parent 9c90bad commit 9b64f90

File tree

121 files changed

+3348
-0
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

121 files changed

+3348
-0
lines changed

‎.gitignore

+11
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
.bundle
2+
.DS_Store
3+
.idea
4+
.jekyll-metadata
5+
.sass-cache
6+
_site/
7+
bower_components/
8+
css/
9+
js/
10+
node_modules/
11+
vendor/

‎.nojekyll

Whitespace-only changes.

‎.travis.yml

+13
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
language: ruby
2+
rvm:
3+
- 2.2
4+
install:
5+
- gem install bundler
6+
- bundle install
7+
- nvm install 6 && nvm use 6
8+
- npm install
9+
- bower install
10+
script:
11+
- grunt build
12+
after_success:
13+
- bash deploy.sh

‎Gemfile

+5
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
source 'https://rubygems.org'
2+
3+
gem 'jekyll', '~> 3.2.1'
4+
gem 'pygments.rb', '~> 0.6.3'
5+
gem 'kramdown', '~> 1.12.0'

‎Gemfile.lock

+50
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,50 @@
1+
GEM
2+
remote: https://rubygems.org/
3+
specs:
4+
colorator (1.1.0)
5+
ffi (1.9.14)
6+
forwardable-extended (2.6.0)
7+
jekyll (3.2.1)
8+
colorator (~> 1.0)
9+
jekyll-sass-converter (~> 1.0)
10+
jekyll-watch (~> 1.1)
11+
kramdown (~> 1.3)
12+
liquid (~> 3.0)
13+
mercenary (~> 0.3.3)
14+
pathutil (~> 0.9)
15+
rouge (~> 1.7)
16+
safe_yaml (~> 1.0)
17+
jekyll-sass-converter (1.4.0)
18+
sass (~> 3.4)
19+
jekyll-watch (1.5.0)
20+
listen (~> 3.0, < 3.1)
21+
kramdown (1.12.0)
22+
liquid (3.0.6)
23+
listen (3.0.8)
24+
rb-fsevent (~> 0.9, >= 0.9.4)
25+
rb-inotify (~> 0.9, >= 0.9.7)
26+
mercenary (0.3.6)
27+
pathutil (0.14.0)
28+
forwardable-extended (~> 2.6)
29+
posix-spawn (0.3.11)
30+
pygments.rb (0.6.3)
31+
posix-spawn (~> 0.3.6)
32+
yajl-ruby (~> 1.2.0)
33+
rb-fsevent (0.9.7)
34+
rb-inotify (0.9.7)
35+
ffi (>= 0.5.0)
36+
rouge (1.11.1)
37+
safe_yaml (1.0.4)
38+
sass (3.4.22)
39+
yajl-ruby (1.2.1)
40+
41+
PLATFORMS
42+
ruby
43+
44+
DEPENDENCIES
45+
jekyll (~> 3.2.1)
46+
kramdown (~> 1.12.0)
47+
pygments.rb (~> 0.6.3)
48+
49+
BUNDLED WITH
50+
1.13.1

‎_config.yml

+31
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,31 @@
1+
2+
3+
# Site settings
4+
title: CSSclasses Materials
5+
email: [email protected]
6+
description: "CSSclasses is for beginners and experts alike: Using CSS as a simple and low-barrier entry language, we empower people to understand their browser and to learn how to experiment with code. Workshop and hackathon in one event."
7+
baseurl: "" # the subpath of your site, e.g. /blog/
8+
url: "http://cssclass.es"
9+
twitter_username: CSSclasses
10+
github_username: CSSclasses
11+
12+
# Build settings
13+
markdown: kramdown
14+
highlighter: pygments
15+
permalink: none
16+
17+
include:
18+
- .nojekyll
19+
- "js/cssclasses.min.js"
20+
- "js/cssclasses.min.js.map"
21+
22+
exclude:
23+
- "_sass/"
24+
- "bower.json"
25+
- "bower_components/"
26+
- "Gemfile"
27+
- "Gemfile.lock"
28+
- "gruntfile.js"
29+
- "node_modules/"
30+
- "package.json"
31+
- "README.md"

‎_includes/footer.html

+10
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
<footer class="page-footer l-width-full">
2+
<div class="l-width-content">
3+
<ul class="list-simple">
4+
<li class="list-simple__el--is-horizontal"><a class="page-footer__a" href="mailto:[email protected]">[email protected]</a></li>
5+
<li class="list-simple__el--is-horizontal"><a class="icon-only icon-twitter" href="https://twitter.com/cssclasses" target="blank">Twitter</a></li>
6+
<li class="list-simple__el--is-horizontal"><a class="icon-only icon-github" href="https://github.com/cssconf/CSSclasses" target="_blank">GitHub</a></li>
7+
</ul>
8+
<p class="page-footer__p">Made with <3 from the community, for the community.<br>We protect you with our <a class="page-footer__a" href="/code-of-conduct/">Code of Conduct.</a></p>
9+
</div>
10+
</footer>

‎_includes/head.html

+69
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,69 @@
1+
<head>
2+
<meta charset="utf-8">
3+
<meta http-equiv="X-UA-Compatible" content="IE=edge">
4+
<meta name="viewport" content="width=device-width, initial-scale=1">
5+
6+
<title>{{ site.title }}{% if page.title %} – {{ page.title }}{% endif %}</title>
7+
<meta name="description" content="{% if page.excerpt %}{{ page.excerpt | strip_html | strip_newlines | truncate: 160 }}{% else %}{{ site.description }}{% endif %}">
8+
9+
<link rel="stylesheet" href="{{ site.baseurl }}/css/style.css">
10+
<link rel="canonical" href="{{ page.url | replace:'index.html','' | prepend: site.baseurl | prepend: site.url }}">
11+
<link rel="alternate" type="application/rss+xml" title="{{ site.title }}" href="{{ "/feed.xml" | prepend: site.baseurl | prepend: site.url }}" />
12+
13+
<meta property="og:title" content="{{ site.title }}">
14+
<meta property="og:url" content="{{ site.url }}">
15+
<meta property="og:description" content="{{ site.description }}">
16+
<meta property="og:image" content="{{ site.url }}/icons/favicon-200x200.png">
17+
<link rel="apple-touch-icon" sizes="57x57" href="{{ site.baseurl }}/icons/apple-touch-icon-57x57.png?v=lkkaaLQvvl">
18+
<link rel="apple-touch-icon" sizes="60x60" href="{{ site.baseurl }}/icons/apple-touch-icon-60x60.png?v=lkkaaLQvvl">
19+
<link rel="apple-touch-icon" sizes="72x72" href="{{ site.baseurl }}/icons/apple-touch-icon-72x72.png?v=lkkaaLQvvl">
20+
<link rel="apple-touch-icon" sizes="76x76" href="{{ site.baseurl }}/icons/apple-touch-icon-76x76.png?v=lkkaaLQvvl">
21+
<link rel="apple-touch-icon" sizes="114x114" href="{{ site.baseurl }}/icons/apple-touch-icon-114x114.png?v=lkkaaLQvvl">
22+
<link rel="apple-touch-icon" sizes="120x120" href="{{ site.baseurl }}/icons/apple-touch-icon-120x120.png?v=lkkaaLQvvl">
23+
<link rel="apple-touch-icon" sizes="144x144" href="{{ site.baseurl }}/icons/apple-touch-icon-144x144.png?v=lkkaaLQvvl">
24+
<link rel="apple-touch-icon" sizes="152x152" href="{{ site.baseurl }}/icons/apple-touch-icon-152x152.png?v=lkkaaLQvvl">
25+
<link rel="apple-touch-icon" sizes="180x180" href="{{ site.baseurl }}/icons/apple-touch-icon-180x180.png?v=lkkaaLQvvl">
26+
<link rel="icon" type="image/png" href="{{ site.baseurl }}/icons/favicon-32x32.png?v=lkkaaLQvvl" sizes="32x32">
27+
<link rel="icon" type="image/png" href="{{ site.baseurl }}/icons/favicon-194x194.png?v=lkkaaLQvvl" sizes="194x194">
28+
<link rel="icon" type="image/png" href="{{ site.baseurl }}/icons/favicon-96x96.png?v=lkkaaLQvvl" sizes="96x96">
29+
<link rel="icon" type="image/png" href="{{ site.baseurl }}/icons/android-chrome-192x192.png?v=lkkaaLQvvl" sizes="192x192">
30+
<link rel="icon" type="image/png" href="{{ site.baseurl }}/icons/favicon-16x16.png?v=lkkaaLQvvl" sizes="16x16">
31+
<link rel="manifest" href="{{ site.baseurl }}/manifest.json?v=lkkaaLQvvl">
32+
<link rel="shortcut icon" href="{{ site.baseurl }}/icons/favicon.ico?v=lkkaaLQvvl">
33+
<meta name="msapplication-TileColor" content="#3d3e3e">
34+
<meta name="msapplication-TileImage" content="/icons/mstile-144x144.png?v=lkkaaLQvvl">
35+
<meta name="theme-color" content="#ffffff">
36+
37+
<script>
38+
(function(){
39+
function addFont() {
40+
var style = document.createElement('style');
41+
style.rel = 'stylesheet';
42+
document.head.appendChild(style);
43+
style.textContent = localStorage.fonts;
44+
}
45+
try {
46+
if (localStorage.fonts) {
47+
addFont();
48+
} else {
49+
var request = new XMLHttpRequest();
50+
request.open('GET', '/css/fonts/fonts.css', true);
51+
52+
request.onload = function() {
53+
if (request.status >= 200 && request.status < 400) {
54+
localStorage.fonts = request.responseText;
55+
addFont();
56+
}
57+
};
58+
request.send();
59+
}
60+
} catch(ex) {
61+
}
62+
}());
63+
</script>
64+
{% if site.env == 'production' %}
65+
<script src="{{ site.baseurl }}/js/cssclasses.min.js" defer></script>
66+
{% else %}
67+
<script src="{{ site.baseurl }}/js/cssclasses.js" defer></script>
68+
{% endif %}
69+
</head>

‎_includes/header-subpage.html

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
<header class="l-width-full page-header subpage-header">
2+
<a class="page-header__logo-a subpage-header__logo-a" href="/"><svg class="page-header__logo subpage-header__logo" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 669.7 451.4"><path d="M635.8 405.8s-.6-.2-1.6-.6c-1-.4-2.7-.9-4.8-1.6-4.3-1.4-10.7-3.2-19-5.4s-18.4-4.4-30.1-6.7c-11.7-2.3-25-4.3-39.6-6.3-3.6-.5-7.4-.9-11.2-1.4-3.8-.4-7.7-.8-11.6-1.2l-6-.6c-2-.2-4-.3-6.1-.5-4.1-.3-8.2-.7-12.4-1-4.2-.2-8.5-.5-12.8-.7-2.2-.1-4.3-.3-6.5-.4-2.2-.1-4.4-.2-6.6-.2-4.4-.2-8.9-.3-13.4-.5-4.5-.1-9.1-.1-13.7-.2-2.3 0-4.6-.1-6.9-.1h-7c-4.7 0-9.4.1-14.1.1-4.7.1-9.5.3-14.3.4-2.4.1-4.8.1-7.2.2l-3.6.1-3.6.2c-4.8.3-9.7.5-14.6.8-2.4.1-4.9.3-7.3.4-2.4.2-4.9.4-7.3.6l-14.7 1.2-3.7.3-3.7.4-7.3.8-14.7 1.5c-4.9.5-9.8 1.2-14.6 1.8-4.9.6-9.7 1.2-14.6 1.8l-14.4 2.1c-4.8.7-9.6 1.4-14.3 2.1l-14.1 2.4c-4.7.8-9.3 1.6-14 2.4-2.3.4-4.6.8-6.9 1.3-2.3.5-4.6.9-6.8 1.4l-13.5 2.7c-2.2.4-4.4.9-6.6 1.3-2.2.5-4.4 1-6.6 1.4-8.7 1.9-17.2 3.8-25.5 5.6-8.2 2-16.2 4-24 5.8-3.9 1-7.7 1.8-11.4 2.8-3.7 1-7.4 2-10.9 3-7.1 1.9-14 3.8-20.5 5.5-6.5 1.8-12.6 3.7-18.4 5.3-5.8 1.7-11.2 3.3-16.2 4.7-2.5.7-4.9 1.5-7.2 2.2-2.3.7-4.4 1.4-6.5 2.1-16.5 5.2-25.9 8.1-25.9 8.1h-.1c-1.3.4-2.6-.3-3-1.6-.4-1.2.3-2.5 1.5-2.9 0 0 9.3-3.3 25.7-9.2 2-.7 4.2-1.5 6.5-2.3 2.3-.8 4.6-1.6 7.1-2.4 5-1.6 10.3-3.4 16.1-5.3 5.8-1.9 11.8-3.9 18.3-5.9 6.5-1.9 13.3-4 20.5-6.1 3.6-1.1 7.2-2.1 10.9-3.2s7.5-2.1 11.4-3.1c7.8-2.1 15.8-4.2 24-6.5 8.3-2 16.8-4.1 25.5-6.2 2.2-.5 4.4-1.1 6.6-1.6 2.2-.5 4.4-1 6.7-1.4 4.5-1 9-1.9 13.5-2.9l6.9-1.5c2.3-.5 4.6-1 6.9-1.4 4.6-.9 9.3-1.8 14-2.7 4.7-.9 9.5-1.8 14.2-2.7l14.4-2.4c4.8-.8 9.7-1.6 14.5-2.4 4.9-.7 9.8-1.4 14.7-2 4.9-.7 9.8-1.4 14.7-2 4.9-.6 9.9-1.1 14.8-1.7l7.4-.8 3.7-.4 3.7-.3c5-.4 9.9-.8 14.8-1.3 2.5-.2 4.9-.4 7.4-.6 2.5-.2 4.9-.3 7.4-.5l14.7-.9 3.7-.2 3.7-.1c2.4-.1 4.9-.2 7.3-.3 4.9-.2 9.7-.4 14.5-.5 4.8-.1 9.6-.1 14.3-.2 2.4 0 4.7-.1 7.1-.1 2.4 0 4.7 0 7 .1 4.7 0 9.3.1 13.9.1 4.6.1 9.1.3 13.6.5 2.2.1 4.5.2 6.7.2 2.2.1 4.4.3 6.6.4 4.4.3 8.7.5 13 .8 4.3.3 8.5.7 12.6 1 2.1.2 4.1.3 6.2.5 2 .2 4.1.4 6.1.6 4 .4 8 .8 11.8 1.3 3.9.5 7.7 1 11.4 1.5 14.8 2 28.4 4.2 40.3 6.7 11.9 2.4 22.3 4.8 30.8 7.1s15.1 4.3 19.6 5.8c2.3.8 4 1.4 5.2 1.8 1.2.4 1.8.7 1.8.7 3 1.1 4.6 4.5 3.4 7.5-1.1 3-4.4 4.5-7.4 3.5l-.3.1zm-233-258.3c3.1-17.5-7-34.8-21.2-44.7-15.2-10.5-55.8-14.9-53.2-38.6 1.9-17.2 25.4-31.3 42.2-28.1 16.6 3.1 3 10.4-1.5 16.7-11.6 16.3 14.8 27.4 27.2 23.4 20-6.5 34.9-35.6 17.6-53-12.9-12.8-35.6-14.3-52.2-12.1-47.1 6.3-126.2 69.4-52.6 104.6 15.5 7.4 35 18.9 38.4 37.5 3.5 18.8-13.6 38.1-30.3 42.5-15.7 4.2-35.7-12.2-33.5-26 1-6.5 22.4-30.1 1.3-30.7-34.5-1.1-47.9 45.2-24.6 66.6 12.7 11.6 31.3 16.6 48.7 14.9 9-.8 17.8-3.6 26.4-5.9 31.9-8.3 61.4-34.1 67.3-67.1zm-34.4 44.7c27 21.4 78.9 21.4 109 9.9 31-11.8 58.9-28.3 66.5-63.5 3.8-17.7-5.4-35.2-19.1-45.7-14.7-11.2-55.3-17.7-51.5-41.2 2.8-17.1 27.1-30 43.8-26 16.5 4 2.5 10.6-2.3 16.7-12.5 15.8 13.7 28 26.2 24.7 20.3-5.4 36.9-33.8 20.3-52C548.9 1.6 526.1-1.1 509.4.3c-47.4 3.9-130.3 63-58.1 101.9 15.2 8.2 34 20.8 36.7 39.4 2.7 18.5-17.4 33.2-32.9 36.7-25.7 5.8-53.1 3.8-70.9-18.1m-139 4.1c-11.1 10.5-25.2 18-39.8 23.2-.8 1.2-1.5 2.2-1.9 2.7-11.7 14.3-19.8 32.7-27.4 49.9 2.5-.7 5.1-1.4 7.5-2.2 27.5-9.2 86-39.2 88.4-70.2.2-2.7-.9-6.1-1.7-8.5-5.4-15.6-18.6-1-25.1 5.1zm18.1-127c-9.5-7.8-25.5-14.1-37.8-14.5-31.2-1.1-58.7 8.3-85 23.6-30.7 17.7-58.2 44.4-72 77.3-11.7 27.8-12 55.4 1.2 82.7 9.5 19.5 31.9 32.2 53.4 36.1 5.5-14.9 11.3-29.2 18.1-43.6-7.7-.9-14.5-3.1-18.7-7.5-13.3-14-9.6-42.4-3.5-58.6 13.3-35 52.7-72.2 87.8-83.5 10.5-3.4 31.6-3.7 31.5 11.6 0 4.2-2.2 8.5-4.9 12-4.2 5.4-11.7 8.2-8.7 15.1 1.6 3.6 7.2 5.9 10.6 6.8 16.3 4.6 38.2-5.7 41.6-24 2-11.4-5-26.4-13.6-33.5zm-150.9 287c-15 14.8-29.4 29-49.6 36.3-13 4.7-28.5 1.7-28-15.1.6-17.3 9.2-34.3 20.9-46.5 7.5-7.8 35.2-14 23.1 5.5-3 4.8 8.4 11 18 4.9 6.7-4.3 8.1-8.5 9.8-13 10.7-27.3-29-34.9-46.9-28.4C26 280.3 3.5 311.4.3 346.7-2.3 374 13.5 407.4 46 399.4c29.1-7.2 48.5-30.9 67.8-52.1 6.2-6.8 12.7-14.1 18.9-21.2.1-.1-12.2-9.7-20.3-1.8zm277.5-97.2c-12.2-7.8-29.5-7-42.2-.4-14.4 7.6-22.8 25.5-14.3 41.3 5.6 10.4 14.9 18.1 19.8 28.9 9 19.9-21.9 30.7-23.9 11.2-.5-5.4-1.9-8.3-4.6-8.9-27.8-5.9-16.5 36.4-2.2 44.3 24 13.2 72-7.6 64.7-40.5-3.8-17.1-18-28.4-27.8-42.2-3.8-5.3-5.9-13.8.3-18.1 5.7-4.1 11.2-3.8 15.2-2.5 3.9 1.3 7.3 4.9 6.1 10.3-1.2 5 11.4 8.2 15.9 4.5 9.8-7.7.5-23.1-7-27.9zm80.1-5.9c-12-8.1-29.1-7.8-42.3-1.6-15.7 7.3-23 24.9-15.6 40.8 5 10.6 14.5 18.5 19 29.5 8.4 20.1-22.9 30.1-24.3 10.5-.4-5.4-1.7-8.3-4.4-9-27.6-6.7-17.7 35.9-3.5 44.2 23.6 13.8 72.5-5.4 66.1-38.6-3.3-17.3-17.2-28.9-26.7-43-3.7-5.4-5.5-13.9.8-18.1 5.9-3.9 11.4-3.5 15.3-2.1 3.9 1.4 7.2 5.1 5.8 10.5-1.3 5 11.2 8.5 15.9 5 10.1-7.4 1.2-23.1-6.1-28.1zm194.6 24c-5 3.2-17.3-1.2-15.6-6.1 1.8-5.2-1.4-9.2-5.1-10.9-3.9-1.7-9.4-2.4-15.6 1-6.6 3.7-5.4 12.3-2 18 8.6 14.7 21.8 27.3 23.9 44.8 4.2 33.8-46.6 49.1-69.2 33.9-4-2.7-7.5-8.3-9.7-14.7-15 10.6-30.2 18.5-48.8 22.2-17.2 3.4-43.4 1.2-50.7-18.1-8.4-22.2-.1-52.3 14.4-69.8 18.7-22.6 70.7-52.8 96.9-24.6 21.3 23-12.7 48.2-31.1 53.6-14.9 4.3-33.1-1.5-42.4-.1-7.6 1.1-4.9 23.6 5.5 27.6 18.1 7 37.4-1.7 54.1-10.5 1.6-7.8 7.1-12.9 18.1-9.4 2.7.8 3.8 3.9 3.8 9.3.1 19.6 32.2 11.9 25.2-8.8-3.9-11.3-12.9-19.8-17.1-30.7-6.4-16.5 2.2-33.5 18.5-39.7 13.7-5.2 30.9-4.4 42.5 4.5 7 5.4 14.9 21.7 4.4 28.5zm-134.4 13.4c7.6-.4 16.8-2.4 23.4-6.1 5.4-3 13.8-11.8 8.2-18.3-2.2-2.5-9.9-1.5-17.8 1.5-10.2 3.9-21.9 13-26.8 22.6-1.3 2.6 12.1.3 13 .3zM128.8 373.9c12.4 4.8 28.4-3.5 36.9-11.9 9.8-9.7 19.6-20.8 28.3-32.1 0 0 1.1 9.9 4.2 16.3 2.6 5.5 7 10.2 12.3 13.4 5.2 3.1 11.8 3.3 17.7 2.3 12.5-2.1 25.7-11.3 34.4-20.1 4.1 2.6 3.7 8.6 9.7 11.5 5.9 2.9 12.9 1.7 19.1.1 12.7-3.2 26.4-12.9 34.9-22.8-4.6-10.9-6.9-16.3-11.5-27.2 0 0-5.5 18.1-13.6 19-11.6 1.3-8.9-11.8-6.1-18.6 3.3-7.8 15.2-18 .2-18.8-25.8-1.4-32.2 36.8-54.5 42.4-8.6 2.2-16.8-4.9-17-15.6-.2-18.5 15.1-39.9 30.8-50 11.8-7.6 23.8-8.7 29-4.3 3.5 3 6.5 5.9 4.7 10.1-.9 2.2 1.6 4.5 5.6 4.4 13-.3 22-11.5 19.9-24.7-2.7-17-27.1-18.8-40.1-16.8-28.5 4.4-55.7 27-72 50.4-10.1 14.5-18.8 30.3-29.8 44.3-7 8.8-13.3 12.1-17.8 10.3m8.8-154.9c-24.1 30.9-35.9 73.6-45.4 110.9-5.2 20.3-19.2 76.9 10.3 85.4 14.3 4.1 28.2-5.2 38-13.1 10.6-8.7 19.6-22 28.1-33.9-8.8-1.9-13.2-2.8-22.1-4.6-11.4 20-25.8 7.2-24.8-10.1 2.2-15.2 4.2-31.1 8.3-45.5 8.2-28.6 21.7-61.5 40.9-84.7 1.8-2.2 4.5-7 1-8.9-11.1-6.3-25.9-7.7-34.3 4.5z"/></svg></a>
3+
</header>

‎_includes/navigation.html

+13
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
<nav class="navigation">
2+
<ul class="navigation__list">
3+
{% for post in site.posts reversed %}
4+
{% assign current = nil %}
5+
{% if page.url == post.url %}
6+
{% assign current = 'current' %}
7+
{% endif %}
8+
<li class="navigation__list-item {{ current }}">
9+
<a class="navigation__link" href="{{ post.url }}">{{ post.title }}</a>
10+
</li>
11+
{% endfor %}
12+
</ul>
13+
</nav>

‎_includes/pagination.html

+6
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
{% if page.previous.url %}
2+
<a class="pagination__link pagination__link--prev" href="{{page.previous.url}}">&laquo; {{page.previous.title}}</a>
3+
{% endif %}
4+
{% if page.next.url %}
5+
<a class="pagination__link pagination__link--next" href="{{page.next.url}}">{{page.next.title}} &raquo;</a>
6+
{% endif %}

‎_layouts/default.html

+21
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
<!DOCTYPE html>
2+
<html>
3+
{% include head.html %}
4+
<body>
5+
<div class="l-container-content">
6+
{% include header-subpage.html %}
7+
<main class="l-width-content l--has-pt l--has-pb main-content">
8+
<aside class="l-container-aside">
9+
{% include navigation.html %}
10+
</aside>
11+
<section class="l-container-inner-content">
12+
{{ content }}
13+
</section>
14+
</main>
15+
<nav class="l-width-content l--has-pb pagination">
16+
{% include pagination.html %}
17+
</nav>
18+
{% include footer.html %}
19+
</div>
20+
</body>
21+
</html>

‎_plugins/environment_variables.rb

+14
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
# Plugin to add environment variables to the `site` object in Liquid templates
2+
3+
module Jekyll
4+
5+
class EnvironmentVariablesGenerator < Generator
6+
7+
def generate(site)
8+
site.config['env'] = ENV['JEKYLL_ENV'] || 'development'
9+
# Add other environment variables to `site.config` here...
10+
end
11+
12+
end
13+
14+
end

‎_posts/2015-01-01-introduction.markdown

+8
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
---
2+
layout: default
3+
title: "Introduction"
4+
---
5+
6+
# Learning Materials
7+
8+
These are the learning materials for the CSSclasses beginners workshop. In this workshop, you’ll learn the very basics of creating a website. We’ll walk through every step together, and our coaches will assist you if you run into any problems or have questions. At the end of the workshop, you’ll find tips and links on how to educate yourself further, and ideas and suggestions on what to experiment with.

‎_posts/2015-01-02-first-steps.markdown

+43
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
---
2+
layout: default
3+
title: "First Steps"
4+
---
5+
6+
## The Basics
7+
* [How to create a file called index.html](#how-to-create-a-file-called-indexhtml)
8+
* [How to open it in the browser](#how-to-open-indexhtml-in-your-browser)
9+
* [Edit, Save and Refresh workflow](#edit-save-and-refresh-workflow)
10+
11+
### How to create a file called index.html
12+
Now it's time for you to create your first website! Open your text editor and create a new file. In your text editor (e.g. Sublime Text), click the `File` menu and then click `New File`.
13+
14+
<figure>
15+
<img src="{{site.baseurl}}/assets/images/new-file.png" alt="Image of Sublime Texts file menu - New file selected.">
16+
<figcaption>
17+
<p>Click the "File" menu and then click "New File".</p>
18+
</figcaption>
19+
</figure>
20+
21+
Now type "Hello World!" or any other sentence you always wanted to read in your favorite browser.
22+
23+
<figure>
24+
<img src="{{site.baseurl}}/assets/images/hello-world.png" alt="Image of Sublime Text with open file - Text: Hello World!.">
25+
<figcaption>
26+
<p>Now type "Hello World!" or any other sentence.</p>
27+
</figcaption>
28+
</figure>
29+
30+
Now click `File -> Save as…` and navigate to a folder you know how to find on your computer. It could be a good idea for now to just create a folder on your desktop or in your home folder called "cssclasses" and save your file in it. As a filename choose "index.html" and click `save`.
31+
32+
<figure>
33+
<img src="{{site.baseurl}}/assets/images/save-as.png" alt="OS X Save as file dialog window.">
34+
<figcaption>
35+
<p>Now click File -> Save as…</p>
36+
</figcaption>
37+
</figure>
38+
39+
### How to open index.html in your browser
40+
So now you have an HTML file, sort of. To open it in your browser, use Windows Explorer, your Linux file manager or Finder on Mac to find your index.html file where you just saved it. By just double-clicking it, your system’s default browser should open this file and show your sentence on the screen. Hooray!
41+
42+
### Edit, Save and Refresh workflow
43+
Leave this browser window open and go back to your text editor. Edit your index.html by adding a second sentence. For example, you might edit your text to look like this: "Hello world! How are you?". Click "File -> Save" again (or use the keyboard shortcut to save some time: CMD + S). Now go back to your browser. No change showing? Sad face? You’ll have to click the "Refresh" button (or use the shortcut: CMD + R) in your browser to see the change on screen. All there? Great! Now let’s make this a real website.

0 commit comments

Comments
 (0)