Browse Source

Break into templates, vars, and add I18N (english)

master
Vanja Cosic 2 years ago
parent
commit
3832e0c919
7 changed files with 248 additions and 169 deletions
  1. 2
    0
      .gitignore
  2. 7
    0
      _data/events.yml
  3. 9
    0
      _data/links.yml
  4. 39
    0
      _data/strings.yml
  5. 183
    0
      _layouts/base.html
  6. 4
    169
      index.html
  7. 4
    0
      index_en.html

+ 2
- 0
.gitignore View File

@@ -1 +1,3 @@
1 1
 *.sw*
2
+_site
3
+.jekyll-metadata

+ 7
- 0
_data/events.yml View File

@@ -0,0 +1,7 @@
1
+- title: "Søndag d. 27. november 2016"
2
+  text: "Cryptohagen løber af stablen igen! Vi sidder i <strong>Mellemrummet</strong>! Kom og drik god fairtradekaffe med os og lær at sikre dit privatliv på det vilde web!"
3
+  time: "13:00-17:00"
4
+  current: true
5
+- title: "Søndag d. 29. januar 2017"
6
+  text: "Vi hopper rask henover decembers travlhed og ses igen i det nye år. Vi sidder også i 2017 i <strong>Mellemrummet</strong>. Kom og drik god fairtradekaffe med os og lær at sikre dit privatliv på det vilde web!"
7
+  time: "13:00-17:00"

+ 9
- 0
_data/links.yml View File

@@ -0,0 +1,9 @@
1
+- name: "Prism Break"
2
+  url: "https://prism-break.org/en/"
3
+  desc: "Collection of privacy protecting alternatives to popular software"
4
+- name: "EFF"
5
+  url: "https://www.eff.org"
6
+  desc: "Electronic Frontier Foundation"
7
+- name: "EFF's Cert Bot"
8
+  url: "https://www.eff.org"
9
+  desc: "Electronic Frontier Foundation"

+ 39
- 0
_data/strings.yml View File

@@ -0,0 +1,39 @@
1
+title_da: "Cryptohagen - Lær kryptering i København"
2
+title_en: "Cryptohagen - Learn to encrypt in Copenhagen"
3
+
4
+menu_tagline_da: "Lær kryptering i København"
5
+menu_tagline_en: "Learn to encrypt in Copenhagen"
6
+
7
+menu_item_1_da: "Hvem"
8
+menu_item_1_en: "Who"
9
+menu_item_2_da: "Hvornår"
10
+menu_item_2_en: "When"
11
+menu_item_3_da: "Hvor"
12
+menu_item_3_en: "Where"
13
+
14
+section_who_title_da: "Hvem er det?"
15
+section_who_title_en: "Who is it?"
16
+
17
+section_who_da:
18
+    - "Cryptohagen er uformelle og hyggelige søndage (hver sidste i måneden), hvor du kan lære at kryptere, og dermed sikre, din kommunikation på internettet."
19
+    - "Alle er velkomne, uanset erfaringsniveau eller tekniske kundskaber. Har du brug for hjælp til at komme i gang med at kryptere dine emails? Så er Cryptohagen stedet, du kan lære det. Eller måske ved du alt om GnuPG, eller hvordan man får OTR til at virke over IRC? Så skal du også være velkommen til at dukke op og hjælpe andre i gang."
20
+    - "Hvem ved, måske er det dig, der i næste måned sidder og hjælper nye i gang med de ting, du selv lærte på Cryptohagen :-)"
21
+    - "Det eneste, du skal have med er godt humør og din bærbare."
22
+
23
+section_who_en:
24
+    - "Cryptohagen are informal and cozy Sundays (the last one every month), where you can learn to encrypt and secure your communication on the internet."
25
+    - "Everyone is welcome, regardless of your experience and level of expertise. Do you need help getting started with encrypting your emails? Then Cryptohagen is the place to learn it. Or maybe you know everything about GnuPG, or do you know how to get OTR to work over IRC? Then feel free to show up and help others get started."
26
+    - "Who knows, maybe you will be the one to help others get started next month with something you learned at Cryptohagen :-)"
27
+    - "All you need to bring is your good mood and your laptop."
28
+
29
+section_events_title_da: "Næste gang:"
30
+section_events_title_en: "Next time:"
31
+
32
+section_events_time_da: "Tidspunkt:"
33
+section_events_time_en: "Time:"
34
+
35
+section_where_title_da: "Her er vi:"
36
+section_where_title_en: "We are here:"
37
+
38
+section_where_address_da: "Adresse"
39
+section_where_address_en: "Address"

+ 183
- 0
_layouts/base.html View File

@@ -0,0 +1,183 @@
1
+{% assign title = 'title_' | append: page.language %}
2
+
3
+{% assign menu_tagline = 'menu_tagline_' | append: page.language %}
4
+{% assign menu_item_1 = 'menu_item_1_' | append: page.language %}
5
+{% assign menu_item_2 = 'menu_item_2_' | append: page.language %}
6
+{% assign menu_item_3 = 'menu_item_3_' | append: page.language %}
7
+
8
+{% assign section_who_title = 'section_who_title_' | append: page.language %}
9
+{% assign section_who = 'section_who_' | append: page.language %}
10
+
11
+{% assign section_events_title = 'section_events_title_' | append: page.language %}
12
+{% assign section_events_time = 'section_events_time_' | append: page.language %}
13
+
14
+{% assign section_where_title = 'section_where_title_' | append: page.language %}
15
+{% assign section_where_address = 'section_where_address_' | append: page.language %}
16
+
17
+<!DOCTYPE html>
18
+<html>
19
+  <head>
20
+    <meta charset="utf-8">
21
+    <title>{{ site.data.strings[title] }}</title>
22
+    <link rel="stylesheet" href="css/cryptohagen.min.css" />
23
+  </head>
24
+  <body>
25
+
26
+    <nav class="navbar navbar-static-top navbar-fixed-top cryptohagen-navbar">
27
+      <div class="navbar-brand pull-xs-right">
28
+        {{ site.data.strings[menu_tagline] }}
29
+      </div>
30
+      <a class="navbar-brand" href="/">
31
+        Cryptohagen
32
+      </a>
33
+      <ul class="nav navbar-nav">
34
+        <li class="nav-item active">
35
+          <a class="nav-link" href="#">{{ site.data.strings[menu_item_1] }}</a>
36
+        </li>
37
+        <li class="nav-item active">
38
+          <a class="nav-link" href="#when">{{ site.data.strings[menu_item_2] }}</a>
39
+        </li>
40
+        <li class="nav-item">
41
+          <a class="nav-link" href="#where">{{ site.data.strings[menu_item_3] }}</a>
42
+        </li>
43
+        <li class="nav-item">
44
+          <a class="nav-link" href="#links">Links</a>
45
+        </li>
46
+        <li>
47
+            {% if page.language == 'da' %}
48
+                <a href="index_en.html" alt="English">
49
+                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 60 30" width="24" height="12" style="margin: 13px 0 0 13px;">
50
+                    <clipPath id="t">
51
+                    	<path d="M30,15 h30 v15 z v15 h-30 z h-30 v-15 z v-15 h30 z"/>
52
+                    </clipPath>
53
+                    <path d="M0,0 v30 h60 v-30 z" fill="#00247d"/>
54
+                    <path d="M0,0 L60,30 M60,0 L0,30" stroke="#fff" stroke-width="6"/>
55
+                    <path d="M0,0 L60,30 M60,0 L0,30" clip-path="url(#t)" stroke="#cf142b" stroke-width="4"/>
56
+                    <path d="M30,0 v30 M0,15 h60" stroke="#fff" stroke-width="10"/>
57
+                    <path d="M30,0 v30 M0,15 h60" stroke="#cf142b" stroke-width="6"/>
58
+                    </svg>
59
+                </a>
60
+            {% else %}
61
+                <a href="index.html" alt="Danish">
62
+                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="18" viewBox="1 1 37 28" style="margin: 10px 0 0 13px;">
63
+                        <rect width="40" height="30" fill="#C60C30"/>
64
+                        <g stroke="#fff" stroke-width="4"><line x1="15" y1="0" x2="15" y2="30"/><line x1="0" y1="15" x2="40" y2="15"/></g>
65
+                    </svg>
66
+                </a>
67
+            {% endif %}
68
+
69
+        </li>
70
+      </ul>
71
+    </nav>
72
+
73
+    <section id="intro">
74
+      <div class="container">
75
+        <div class="row">
76
+          <div class="col-md-8">
77
+            <h1>{{ site.data.strings[section_who_title] }}</h1>
78
+            <hr>
79
+            {% for paragraph in site.data.strings[section_who] %}
80
+                <p>{{ paragraph }}</p>
81
+            {% endfor %}
82
+            </div>
83
+          </div>
84
+      </div>
85
+    </section>
86
+
87
+    <section id="when">
88
+        <div class="container">
89
+        <h1>{{ site.data.strings[section_events_title] }}</h1>
90
+        <hr>
91
+
92
+        <div class="card-columns">
93
+
94
+            {% for event in site.data.events %}
95
+            <div class="card card-inverse {% if event.current %}card-primary{% else %}card-info{% endif %}">
96
+              <div class="card-block">
97
+                <h4 class="card-title">{{ event.title }}</h4>
98
+                <p class="card-text">
99
+                  {{ event.text }}
100
+                </p>
101
+                <p class="card-text">
102
+                  <strong>{{ site.data.strings[section_events_time] }}</strong><br />
103
+                  {{ event.time }}
104
+                </p>
105
+              </div>
106
+            </div>
107
+            {% endfor %}
108
+
109
+        </div>
110
+      </div>
111
+    </section>
112
+
113
+    <section id="where">
114
+        <div class="container">
115
+
116
+          <h1>{{ site.data.strings[section_where_title] }}</h1>
117
+          <hr>
118
+
119
+          <div id="Map" style="height:250px"></div>
120
+          <script src="http://www.openlayers.org/api/OpenLayers.js"></script>
121
+
122
+          <script>
123
+              var lat            = 55.6886382;
124
+              var lon            = 12.5618443;
125
+              var zoom           = 18;
126
+
127
+              var fromProjection = new OpenLayers.Projection("EPSG:4326");   // Transform from WGS 1984
128
+              var toProjection   = new OpenLayers.Projection("EPSG:900913"); // to Spherical Mercator Projection
129
+              var position       = new OpenLayers.LonLat(lon, lat).transform( fromProjection, toProjection);
130
+
131
+              map = new OpenLayers.Map("Map");
132
+              var mapnik         = new OpenLayers.Layer.OSM();
133
+              map.addLayer(mapnik);
134
+
135
+              var markers = new OpenLayers.Layer.Markers( "Markers" );
136
+              map.addLayer(markers);
137
+              markers.addMarker(new OpenLayers.Marker(position));
138
+
139
+              map.setCenter(position, zoom);
140
+          </script>
141
+
142
+            <p>
143
+            <address>
144
+              <strong>{{ site.data.strings[section_where_address] }}</strong><br />
145
+                <a href="https://www.ms.dk/mellemrummet">Mellemrummet</a><br />
146
+                Ravnsborggade 11<br />
147
+                2200 København Nørrebro
148
+            </address>
149
+          </p>
150
+
151
+        </div>
152
+
153
+    </section>
154
+
155
+    <section id="links">
156
+      <div class="container">
157
+
158
+        <h1>Links:</h1>
159
+        <hr>
160
+
161
+        <ul>
162
+        {% for link in site.data.links %}
163
+            <li>
164
+                <a href="{{ link.url }}">{{ link.name }}</a>
165
+                {% if link.desc %}: {{ link.desc}}{% endif %}
166
+            </li>
167
+        {% endfor %}
168
+        </ul>
169
+
170
+      </div>
171
+    </section>
172
+
173
+    <footer>
174
+      <div class="container">
175
+        <a href="https://github.com/cryptohagen/cryptohagen.github.io" target="_blank">
176
+            Add stuff or improve this stack-less website on Github
177
+        </a>
178
+      </div>
179
+    </footer>
180
+
181
+    <script src="js/bootstrap.min.js"></script>
182
+  </body>
183
+</html>

+ 4
- 169
index.html View File

@@ -1,169 +1,4 @@
1
-<!DOCTYPE html>
2
-<html>
3
-  <head>
4
-    <meta charset="utf-8">
5
-    <title>Cryptohagen - Lær kryptering i København</title>
6
-    <link rel="stylesheet" href="css/cryptohagen.min.css" />
7
-  </head>
8
-  <body>
9
-
10
-    <nav class="navbar navbar-static-top navbar-fixed-top cryptohagen-navbar">
11
-      <div class="navbar-brand pull-xs-right">
12
-        Lær kryptering i København!      
13
-      </div>
14
-      <a class="navbar-brand" href="/">
15
-        Cryptohagen
16
-      </a>
17
-      <ul class="nav navbar-nav">
18
-        <li class="nav-item active">
19
-          <a class="nav-link" href="#">Hvem</a>
20
-        </li>
21
-        <li class="nav-item active">
22
-          <a class="nav-link" href="#when">Hvornår</a>
23
-        </li>
24
-        <li class="nav-item">
25
-          <a class="nav-link" href="#where">Hvor</a>
26
-        </li>
27
-        <li class="nav-item">
28
-          <a class="nav-link" href="#links">Links</a>
29
-        </li>
30
-      </ul>
31
-    </nav>
32
-    
33
-    <section id="intro">
34
-      <div class="container">
35
-        <div class="row">
36
-          <div class="col-md-8">
37
-            <h1>Hvem er det for?</h1>
38
-            <hr>
39
-            <p>
40
-              Cryptohagen er uformelle og hyggelige søndage (hver sidste i måneden), hvor du kan lære at kryptere, og dermed sikre, din kommunikation på internettet.
41
-            </p>
42
-              <p>
43
-                Alle er velkomne, uanset erfaringsniveau eller tekniske kundskaber. Har du brug for hjælp til at komme i gang med at kryptere dine emails? Så er Cryptohagen stedet, du kan lære det. Eller måske ved du alt om GnuPG, eller hvordan man får OTR til at virke over IRC? Så skal du også være velkommen til at dukke op og hjælpe andre i gang.
44
-              </p>
45
-              <p>
46
-                Hvem ved, måske er det dig, der i næste måned sidder og hjælper nye i gang med de ting, du selv lærte på Cryptohagen :-)
47
-              </p>
48
-              <p>Det eneste, du skal have med er godt humør og din bærbare.</p>
49
-            </div>
50
-          </div>
51
-      </div>
52
-    </section>
53
-    <section id="when">
54
-     
55
-      <div class="container">
56
-        <h1>Næste gang!</h1>
57
-        <hr>
58
-      
59
-        <div class="card-columns">
60
-
61
-          <div class="card card-inverse card-primary">
62
-            <div class="card-block">
63
-              <h4 class="card-title">Søndag d. 27. november 2016</h4>
64
-              <p class="card-text">
65
-                Cryptohagen løber af stablen igen! 
66
-                Vi sidder i <strong>Mellemrummet</strong>! 
67
-                Kom og drik god fairtradekaffe med os og lær at sikre dit privatliv på det vilde web!
68
-              </p>
69
-              <p class="card-text">
70
-                <strong>Tidspunkt</strong><br />
71
-                13:00-17:00
72
-              </p>
73
-            </div>
74
-          </div>
75
-
76
-          <div class="card card-inverse card-info">
77
-            <div class="card-block">
78
-              <h4 class="card-title">Søndag d. 29. januar 2017</h4>
79
-              <p class="card-text">
80
-                Vi hopper rask henover decembers travlhed og ses igen i det nye år.
81
-                Vi sidder også i 2017 i <strong>Mellemrummet</strong>.
82
-                Kom og drik god fairtradekaffe med os og lær at sikre dit privatliv på det vilde web!
83
-              </p>
84
-              <p class="card-text">
85
-                <strong>Tidspunkt</strong><br />
86
-                13:00-17:00
87
-              </p>
88
-            </div>
89
-          </div>
90
-
91
-        </div>
92
-      </div>
93
-    </section>
94
-
95
-    <section id="where">
96
-      <div class="container">
97
-      
98
-        <h1>Her er vi!</h1>
99
-        <hr>
100
-      
101
-        <div id="Map" style="height:250px"></div>
102
-        <script src="http://www.openlayers.org/api/OpenLayers.js"></script>
103
-
104
-        <script>
105
-            var lat            = 55.6886382;
106
-            var lon            = 12.5618443;
107
-            var zoom           = 18;
108
-
109
-            var fromProjection = new OpenLayers.Projection("EPSG:4326");   // Transform from WGS 1984
110
-            var toProjection   = new OpenLayers.Projection("EPSG:900913"); // to Spherical Mercator Projection
111
-            var position       = new OpenLayers.LonLat(lon, lat).transform( fromProjection, toProjection);
112
-
113
-            map = new OpenLayers.Map("Map");
114
-            var mapnik         = new OpenLayers.Layer.OSM();
115
-            map.addLayer(mapnik);
116
-
117
-            var markers = new OpenLayers.Layer.Markers( "Markers" );
118
-            map.addLayer(markers);
119
-            markers.addMarker(new OpenLayers.Marker(position));
120
-
121
-            map.setCenter(position, zoom);
122
-        </script>
123
-
124
-          <p>
125
-          <address>
126
-            <strong>Adresse</strong> <br />
127
-              <a href="https://www.ms.dk/mellemrummet">Mellemrummet</a><br />
128
-              Ravnsborggade 11<br />
129
-              2200 København Nørrebro
130
-          </address>
131
-        </p>
132
-
133
-      </div>
134
-    </section>
135
-
136
-    <section id="links">
137
-      <div class="container">
138
-      
139
-        <h1>Links!</h1>
140
-        <hr>
141
-
142
-        <ul>
143
-          <li>
144
-            <a href="https://prism-break.org/en/" target="_blank">Prism Break</a>: Nice samling af privatlivssikrede alternativer til populær (men problematisk) software
145
-          </li>
146
-          <li>
147
-            <a href="https://www.eff.org" target="_blank">Electronic Frontier Foundation (EFF)</a>
148
-          </li>
149
-          <li>
150
-            <a href="https://certbot.eff.org/" target="_blank">EFF's Cert Bot</a> - Nem vejledning til at få Let's Encrypt installeret på alle slags HTTP servere og operativsystemer.
151
-          </li>
152
-        </ul>
153
-
154
-      </div>
155
-    </section>
156
-
157
-
158
-<footer>
159
-
160
-  <div class="container">
161
-    <a href="https://github.com/cryptohagen/cryptohagen.github.io" target="_blank">Add stuff or improve this stack-less website on Github</a>
162
-  </div>
163
-
164
-</footer>
165
-
166
-<script src="js/bootstrap.min.js"></script>
167
-
168
-  </body>
169
-</html>
1
+---
2
+layout: base
3
+language: da
4
+---

+ 4
- 0
index_en.html View File

@@ -0,0 +1,4 @@
1
+---
2
+layout: base
3
+language: en
4
+---

Loading…
Cancel
Save