fix(links): make all links relative (#6)

I'm working on a simple buildkite pipeline that will build a blog and 
"deploy" the static files to s3 and allow for validation (and eventually 
integ testing?) - but I was running into issues given that I'm relying 
on a sub-path for my s3 path.

So, for my temp build, I'm planning on making a dynamic config file that 
will have something like this:

```yml
baseurl: "/developer-blog/18/_site"
```

But when I did that, I realized many of the exisiting links and elements 
in the theme were hard-coded to assume the blog was exposed at a root 
path.

_includes/favicons.html

@@ -1,19 +1,19 @@
-<link rel="apple-touch-icon" sizes="57x57" href="/assets/images/favicon/apple-icon-57x57.png">
-<link rel="apple-touch-icon" sizes="60x60" href="/assets/images/favicon/apple-icon-60x60.png">
-<link rel="apple-touch-icon" sizes="72x72" href="/assets/images/favicon/apple-icon-72x72.png">
-<link rel="apple-touch-icon" sizes="76x76" href="/assets/images/favicon/apple-icon-76x76.png">
-<link rel="apple-touch-icon" sizes="114x114" href="/assets/images/favicon/apple-icon-114x114.png">
-<link rel="apple-touch-icon" sizes="120x120" href="/assets/images/favicon/apple-icon-120x120.png">
-<link rel="apple-touch-icon" sizes="144x144" href="/assets/images/favicon/apple-icon-144x144.png">
-<link rel="apple-touch-icon" sizes="152x152" href="/assets/images/favicon/apple-icon-152x152.png">
-<link rel="apple-touch-icon" sizes="180x180" href="/assets/images/favicon/apple-icon-180x180.png">
-<link rel="icon" type="image/png" sizes="192x192"  href="/assets/images/favicon/android-icon-192x192.png">
-<link rel="icon" type="image/png" sizes="32x32" href="/assets/images/favicon/favicon-32x32.png">
-<link rel="icon" type="image/png" sizes="96x96" href="/assets/images/favicon/favicon-96x96.png">
-<link rel="icon" type="image/png" sizes="16x16" href="/assets/images/favicon/favicon-16x16.png">
+<link rel="apple-touch-icon" sizes="57x57" href="{{ "/assets/images/favicon/apple-icon-57x57.png" | relative_url }}">
+<link rel="apple-touch-icon" sizes="60x60" href="{{ "/assets/images/favicon/apple-icon-60x60.png" | relative_url }}">
+<link rel="apple-touch-icon" sizes="72x72" href="{{ "/assets/images/favicon/apple-icon-72x72.png" | relative_url }}">
+<link rel="apple-touch-icon" sizes="76x76" href="{{ "/assets/images/favicon/apple-icon-76x76.png" | relative_url }}">
+<link rel="apple-touch-icon" sizes="114x114" href="{{ "/assets/images/favicon/apple-icon-114x114.png" | relative_url }}">
+<link rel="apple-touch-icon" sizes="120x120" href="{{ "/assets/images/favicon/apple-icon-120x120.png" | relative_url }}">
+<link rel="apple-touch-icon" sizes="144x144" href="{{ "/assets/images/favicon/apple-icon-144x144.png" | relative_url }}">
+<link rel="apple-touch-icon" sizes="152x152" href="{{ "/assets/images/favicon/apple-icon-152x152.png" | relative_url }}">
+<link rel="apple-touch-icon" sizes="180x180" href="{{ "/assets/images/favicon/apple-icon-180x180.png" | relative_url }}">
+<link rel="icon" type="image/png" sizes="192x192"  href="{{ "/assets/images/favicon/android-icon-192x192.png" | relative_url }}">
+<link rel="icon" type="image/png" sizes="32x32" href="{{ "/assets/images/favicon/favicon-32x32.png" | relative_url }}">
+<link rel="icon" type="image/png" sizes="96x96" href="{{ "/assets/images/favicon/favicon-96x96.png" | relative_url }}">
+<link rel="icon" type="image/png" sizes="16x16" href="{{ "/assets/images/favicon/favicon-16x16.png" | relative_url }}">
 
-<link rel="manifest" href="/assets/images/favicon/manifest.json">
+<link rel="manifest" href="{{ "/assets/images/favicon/manifest.json" | relative_url }}"">
 
 <meta name="msapplication-TileColor" content="#B72822">
-<meta name="msapplication-TileImage" content="/assets/images/favicon/ms-icon-144x144.png">
+<meta name="msapplication-TileImage" content="/assets/images/favicon/ms-icon-144x144.png" | relative_url }}">
 <meta name="theme-color" content="#B72822">

_includes/footer.html

@@ -5,7 +5,7 @@
           {% for page in site.pages %}
             {% if page.title %}
             <li>
-                <a href="{{ page.url | prepend: site.baseurl }}">{{ page.title }}</a>
+                <a href="{{ page.url | relative_url }}">{{ page.title }}</a>
             </li>
             {% endif %}
           {% endfor %}
@@ -14,7 +14,7 @@
         </nav >
         <nav>
           <ul class="site-social-links inline">
-              <li><a target="_blank" title="RSS Feed" href="/feed.xml"><ion-icon name="logo-rss"></ion-icon></a></li>
+              <li><a target="_blank" title="RSS Feed" href="{{ "/feed.xml" | relative_url }}"><ion-icon name="logo-rss"></ion-icon></a></li>
               {% if site.guardian.social_links.email_subscription_url %}
               <li><a target="_blank" title="Email Subscription" href="{{ site.guardian.social_links.email_subscription_url }}"><ion-icon name="mail"></ion-icon></a></li>
               {% endif %}

_includes/head.html

@@ -7,7 +7,7 @@
   <meta name="description" content="{% if page.excerpt %}{{ page.excerpt | strip_html | strip_newlines | truncate: 160 }}{% else %}{{ site.description }}{% endif %}">
 
   {% include favicons.html %}
-  <link rel="stylesheet" href="/assets/css/app.css">
-  <link rel="canonical" href="{{ page.url | replace:'index.html','' | prepend: site.baseurl | prepend: site.url }}">
-  <link rel="alternate" type="application/rss+xml" title="{{ site.title }}" href="{{ "/feed.xml" | prepend: site.baseurl | prepend: site.url }}" />
+  <link rel="stylesheet" href="{{ "/assets/css/app.css" | relative_url }}">
+  <link rel="canonical" href="{{ page.url | replace:'index.html','' | relative_url | prepend: site.url }}">
+  <link rel="alternate" type="application/rss+xml" title="{{ site.title }}" href="{{ "/feed.xml" | relative_url }}" />
 </head>

_includes/header.html

@@ -1,7 +1,7 @@
 <header class="site-header" role="banner">
   <div class="wrapper">
     <div class="logo">
-      <a href="/">
+      <a href="{{ "/" | relative_url }}">
         <img width="400" alt="{{ site.title }} Logo" src="{{ site.guardian.style.logo_url }}">
       </a>
     </div>

index.html

@@ -6,7 +6,7 @@
       {% for post in site.posts %}
         <article>
           <h1>
-            <a href="{{ post.url | prepend: site.baseurl }}">{{ post.title }}</a>
+            <a href="{{ post.url | relative_url }}">{{ post.title }}</a>
           </h1>
 
           <p class="posts-excerpt">