beginning of the end, we introduced javascript (FIXME FOR ROEL)

themes/varia/templates/article.html

@@ -27,18 +27,20 @@
 	<div class="article-info">
 		<div class="featured-image u-photo">
             {% if article.featured_image %}
-            {% set thumb_size ='/thumb'%}
-            <a href="{{ article.featured_image }}">
-            {% if article.featured_image.endswith('.gif') %}
-                {% set thumb_size =''%}
-            {% endif %}
-            <img src="{{ article.featured_image | replace('images','images'+thumb_size) }}">
-            </a>
+	            {% set thumb_size ='/thumb'%}
+	            <a href="{{ article.featured_image }}">
+	            {% if article.featured_image.endswith('.gif') %}
+	                {% set thumb_size =''%}
+	            {% endif %}
+	            <img src="{{ article.featured_image | replace('images','images'+thumb_size) }}">
+	            </a>
             {% endif %}
 		</div>
 		<div class="event-details">
 			{% if article.event_start %}
-			<div>{{ article.event_start }}</div>
+				<div>{{ article.event_start }}</div>
+			{% else %}
+				<div>Published: {{ article.date }}</div>
 			{% endif %}
 		</div>
 		<div class="post-info">
@@ -53,15 +55,23 @@
 			</div>
 			{% endif %}
 			{% if article.translations %}
-				<div class="article-translation">
+				<span class="article-translation">
 				{% for translation in article.translations %}
 					{% if translation.lang == 'nl' %}<a href="{{ translation.url }}">Lees dit artikel in het Nederlands</a>
 					{% endif %}
 					{% if translation.lang == 'en' %}<a href="{{ translation.url }}">Read this article in English</a>
 					{% endif %}
 				{% endfor %}
-				</div>
+				</span>
 			{% endif %}
+			{% if article.tags %}
+	            <span class="tags">
+	                relating to {% for tag in article.tags %}
+	                <span itemprop="keywords">
+	                    <a href="/{{ tag.url }}" rel="tag">{{ tag }}</a>
+	                </span> {% endfor %}
+	            </span>
+            {% endif %}
 		</div>
 	</div>
 <div class="entry-content-container">
@@ -71,4 +81,15 @@
 	</div><!-- /.entry-content -->
 </div><!-- /.entry-content-container -->
 </section>
+<script type="text/javascript">
+	var footnotes = document.querySelectorAll('[id^="fnref-"]');
+	for(var i in footnotes){
+		if(i < footnotes.length){
+			console.log(footnotes[i]);
+			var id = footnotes[i].id.replace('fnref-','fn-');
+		footnotes[i].innerHTML = footnotes[i].innerHTML + '<span>['+ parseInt(Number(i)+1) + '] '+ document.getElementById(id).innerHTML +'</span>';
+		}
+	}
+	document.getElementsByClassName('footnote')[0].remove();
+</script>
 {% endblock %}