adding colors! and a favicon :) and renamed section 3

content/Section 1 - Digital Infrapunctures/3-question-1.md

@@ -3,6 +3,7 @@ Slug: 03-s1-question-1
 Date: 2020-11-01 12:02
 Summary: A video contribution by Deb Verhoeven.
 
+
 <video controls>
 	<source src="videos/deb-verhoeven-q1.mp4" type="video/mp4">
 </video>

content/Section 3 - Bots/bots-and-infrastructures.md

@@ -1,28 +0,0 @@
-Title: Introduction: Darius Kazemi
-Slug: xx-s3-bots-and-infrastructures
-Date: 2020-11-01 12:10
-Summary: How do bots relate to digital infrastructures?
-
-Darius Kazemi is a computer programmer and artist, whose work engages with bot making and self-hosting social networks. He organised the Bot Summit[^summit] in 2013, 2014 and 2016.
-
-In 2016, Kazemi made staywokebot[^staywoke] in conversation with Black Lives Matter activists DeRay Mckesson and Samuel Sinyangwe. The bot sent out messages to its Twitter followers to uplift activists' morale and provide joyful interactions. Kazemi has also worked on private bots for activists that take over some of the repetitive or distressing work. They attempt to mitigate the harm and exhaustion that activists are exposed to on communication platforms such as Twitter by acting as a type of prosthesis.
-
-Kazemi is also behind the Run Your Own Social[^runsocial] site, where he wrote a guide on setting up a self-hosted social media.
-
-How do bots relate to computational infrastructures? Let's take two examples of communication platforms that employ different network topologies and economic models: Twitter (centralised) and Mastodon (decentralised, federated)[^mastodon]. As opposed to Twitter, Mastodon is a free and open source self-hosted networking service. Anyone can become a node in the network by installing the software and thus federate with other servers. The nodes, or user bases, are referred to as "instances" which have community-determined norms, often described through Codes of Conduct.
-
-Both microblogging platforms Twitter and Mastodon have a significant amount of bot agents. Kazemi has made bots for both of these communication infrastructures.
-
-We will introduce his work through the following questions:
-
-* Can you talk about your process of making bots?
-* What types of bots are there?
-* How do bots relate to digital infrastructures?
-* How do bots operate differently in centralised or decentralised networks?
-* Can you give some examples of bots that you made?
-
-# Footnotes
-[^staywoke]: StayWokeBot <https://twitter.com/StayWokeBot/>
-[^runsocial]: Run Your Own Social <https://runyourown.social/>
-[^summit]: Recordings from the Bot Summit of 2016 <http://tinysubversions.com/botsummit/2016/>
-[^mastodon]: Mastodon <https://joinmastodon.org/>

content/pages/about.md

@@ -14,27 +14,7 @@ This module is made using Pelican[^pelican] and served as a *static website*: a
 
 The sources of this module can be found on <https://git.vvvvvvaria.org/mb/bots-as-digital-infrapunctures>.
 
-<!-- # Colophon
-
-Title: *Bots as Digital Infrapunctures*
-
-Authors: Cristina Cochior, Manetta Berends (Varia)
-
-Contributors: Deb Verhoeven, Seda Gürses, Andreas Hepp
-
-Editor: Dr. Karin van Es (Utrecht University)
-
-Producer: Fabian van Sluijs (Creative Coding Utrecht, CCU)
-
-Commissioned by: the focus area *Governing the Digital Society* at Utrecht University
-
-Tools: , Gitea
-
-Hosted by:
-
-License:
-
-With many thanks to:  -->
+Fonts: XXX
 
 <br>
 <br>

content/pages/start.md

@@ -9,9 +9,9 @@ This module combines theoretical and practical work, bringing the fields of digi
 
 # Goals
 
-The goal of this online module is to foster what Karin van Es terms *tool criticism thinking* (e.g. the skills and practices for critically engaging with the norms and values of our computational tools and infrastructures). The module consists of readings, videos and exercises that help you analyze and reflect on how infrastructural agency, impact or power is shaped, structured and performed.
+The goal of this online module is to foster what Karin van Es, Maranke Wieringa and Mirko Tobias Schäfer term *tool criticism thinking*[^toolcriticism] (e.g. the skills and practices for critically engaging with the norms and values of our computational tools and infrastructures). The module consists of readings, videos and exercises that help you analyze and reflect on how infrastructural agency, impact or power is shaped, structured and performed.
 
-By the end of the module you will have:
+By the end of the module you will have: 
 
 - identified some of the norms and values of a digital communication infrastructures
 - signalled a particular tension (or rather hurt) that emerges from these norms and values
@@ -25,3 +25,5 @@ You will need approximately 4 hours to go through this whole module.
 # Footnotes
 
 [^prototype]: Galey, Alan & Ruecker, Stan. (2010). How a Prototype Argues. LLC. 25. 405-424. 10.1093/llc/fqq021. <https://www.researchgate.net/publication/220675438_How_a_Prototype_Argues>
+
+[^toolcriticism]: Es, Karin & Wieringa, Maranke & Schäfer, Mirko Tobias. (2018). Tool Criticism: From Digital Methods to Digital Methodology. 24-27. 10.1145/3240431.3240436. <http://mtschaefer.net/media/uploads/docs/Van-Es_Wieringa_Schafer_Tool-Criticism_publish.pdf>

pelicanconf.py

@@ -21,7 +21,7 @@ TRANSLATION_FEED_ATOM = None
 AUTHOR_FEED_ATOM = None
 AUTHOR_FEED_RSS = None
 
-STATIC_PATHS = [ 'extra/favicon.ico', 'images', 'attachments', 'bot-example', 'videos' ]
+STATIC_PATHS = [ 'images', 'attachments', 'bot-example', 'videos' ]
 
 THEME = 'themes/default'
 THEME_STATIC_DIR = 'theme'
@@ -34,3 +34,5 @@ TEMPLATE_PAGES = { 'home.html': 'index.html' }
 
 # Uncomment following line if you want document-relative URLs when developing
 RELATIVE_URLS = True
+
+CATEGORIES_SAVE_AS = 'roadmap.html'

themes/default/static/css/fonts.css

@@ -14,6 +14,15 @@
 	font-weight: bold;
 }
 
+/* Autopia */
+@font-face{
+	font-family: 'Autopia';
+	src: 
+		url('../fonts/Autopia-Bold.ttf') format('truetype');
+	font-style: normal;
+	font-weight: bold;
+}
+
 /* Syne Italic */
 @font-face{
 	font-family: 'Syne';

themes/default/static/css/main.css

@@ -2,12 +2,14 @@
 
 body{
 	margin:2em auto;
+	min-width: 1080px; 
 	max-width: 950px;
 	font-family: 'Basker';
 	font-size: 14pt;
 	line-height: 1.7;
 	letter-spacing: 0.25pt;
 	color: rgba(40,40,40,1);
+	background-color: #d0bba0;
 }
 h1, h2, h3, h4, h5, h6{
 	font-family: 'Belgika-reg';
@@ -19,12 +21,13 @@ header#banner{
 }
 	header#banner h1{
 		font-family: 'Syne';
-		font-size: 90px;
+		font-size: 110px;
 		line-height:1.25;
 		margin: 1em 0;
 	}
 	header#banner h1 a{
 		text-decoration: none;
+		color: darkgoldenrod !important; 
 	}
 nav#menu{
 	width: calc(100% + 20em);
@@ -46,8 +49,7 @@ nav#menu{
 		vertical-align: middle;
 	}
 	nav#menu li.active{
-		background-color: yellow;
-		/*color: white;*/
+		background-color: #95d1e6; 
 	}
 	nav#menu li.pagelink{
 		height: 1.5em;
@@ -65,7 +67,7 @@ article{
 	border-top: 1px solid;
 }
 	article:first-child{
-		background-color: yellow;
+		background-color: #95d1e6; 
 		padding-bottom: 3em;
 		margin-bottom: -3em;
 	}
@@ -73,16 +75,18 @@ article{
 article button {
 	width: auto;
 	top:1em;
-	margin:1.5em 0;
-	padding:1em 1.5em;
+	margin:1.5em auto;
+	padding:1.5em 3em;
 	background-color: rgba(40,40,40,1);
 	border:1px solid rgba(40,40,40,1);
 	border-radius: 0.5em;
 }
 	article a button{
-		font-family: monospace;
+		font-family: 'Belgika-reg';
 		text-decoration: none !important;
 		color: white !important;
+		font-size: 16px;
+		letter-spacing: 0.1em;
 	}
 	article a button:hover{
 		cursor: pointer;
@@ -120,12 +124,13 @@ ul.navprevnext{
 		width: calc(50% - 9em);
 		height: 175px;
 		top:0;
-		background-color: yellow;
-		border-radius: 1em;
+		background-color: #95d1e6; 
+		border-radius: 1em; 
 		padding:1em 3em;
 		font-size: 13pt;
 		line-height: 1.4;
 		list-style: none;
+		border:1px solid black; 
 	}
 	ul.navprevnext a{
 		text-decoration: none;
@@ -154,7 +159,6 @@ ul.navprevnext{
 	ul.navprevnext li.done{
 		float: right;
 		right: -9.5em;
-		/*text-align: right;*/
 	}
 	/* you finished this section */
 	ul.navprevnext li.done{
@@ -209,7 +213,7 @@ blockquote{
 }
 pre, 
 code{
-	color: magenta;
+	color: purple;
 }
 
 .lastupdate{

themes/default/templates/base.html

@@ -10,7 +10,7 @@
 </head>
 
 <body id="index" class="home">
-	
+
 	<header id="banner" class="body">
 		<h1><a href="{{ SITEURL }}/">{{ SITENAME }}{% if SITESUBTITLE %} <strong>{{ SITESUBTITLE }}</strong>{% endif %}</a></h1>
 	</header>
@@ -27,8 +27,8 @@
 		{% endfor %}
 	{% endif %}
 		<br>
-		<a href="{{ SITEURL }}/pages/about.html"><li class="pagelink">About this Module</li></a>
-		<a href="{{ SITEURL }}/categories.html"><li class="pagelink">Overview</li></a>
+		<a href="{{ SITEURL }}/pages/about.html"><li class="pagelink {% if 'about' in output_file %}active{% endif %}">About this Module</li></a>
+		<a href="{{ SITEURL }}/roadmap.html"><li class="pagelink {% if 'roadmap' in output_file %}active{% endif %}">Roadmap</li></a>
 	</ul></nav>
 
 	<section id="content">

themes/default/templates/categories.html

@@ -1,6 +1,6 @@
 {% extends "base.html" %}
 
-{% block title %}{{ SITENAME }} - Categories{% endblock %}
+{% block title %}{{ SITENAME }} - Overview{% endblock %}
 
 {% block content %}