Use relative urls everywhere.

Author: m-ou-se

src/blogs.rs

@@ -111,6 +111,10 @@ impl Blog {
         &self.prefix
     }
 
+    pub(crate) fn path_back_to_root(&self) -> PathBuf {
+        self.prefix.components().map(|_| Path::new("../")).collect()
+    }
+
     pub(crate) fn posts(&self) -> &[Post] {
         &self.posts
     }

src/main.rs

@@ -120,7 +120,7 @@ impl<'a> Generator<'a> {
             .map(|other_blog| {
                 json!({
                     "link_text": other_blog.link_text(),
-                    "url": PathBuf::from("/").join(other_blog.prefix()).join("index.html"),
+                    "url": other_blog.prefix().join("index.html"),
                 })
             })
             .collect();
@@ -130,6 +130,7 @@ impl<'a> Generator<'a> {
             "parent": "layout",
             "blog": blog,
             "other_blogs": other_blogs,
+            "root": blog.path_back_to_root(),
         });
         self.render_template(blog.prefix().join("index.html"), "index", data)?;
         Ok(())
@@ -152,6 +153,7 @@ impl<'a> Generator<'a> {
             "parent": "layout",
             "blog": blog,
             "post": post,
+            "root": blog.path_back_to_root().join("../../../"),
         });
 
         self.render_template(path.join(filename), &post.layout, data)?;

src/styles/fonts.scss

@@ -70,7 +70,7 @@ $format-names: (
 @function urls($filename, $range, $extensions) {
   $urls: ();
   @each $extension in $extensions {
-    $url: url('/fonts/#{$extension}/#{$filename}.#{$range}.#{$extension}');
+    $url: url('../fonts/#{$extension}/#{$filename}.#{$range}.#{$extension}');
     $format: format(map-get($format-names, $extension));
 
     $urls: append($urls, $url $format, comma);

templates/footer.hbs

@@ -22,15 +22,15 @@
       <div class="four columns mt3 mt0-l">
         <h4>Social</h4>
         <div class="flex flex-row flex-wrap">
-          <a href="https://twitter.com/rustlang" target="_blank" rel="noopener" alt="twitter link"><img src="/images/twitter.svg" alt="twitter logo" title="Twitter"/></a>
-          <a href="https://www.youtube.com/channel/UCaYhcUwRBNscFNUKTjgPFiA" target="_blank" rel="noopener" alt="youtube link"><img style="padding-top: 6px; padding-bottom:6px" src="/images/youtube.svg" alt="youtube logo" title="YouTube"/></a>
-          <a href="https://discord.gg/rust-lang" target="_blank" rel="noopener" alt="discord link"><img src="/images/discord.svg" alt="discord logo" title="Discord"/></a>
-          <a href="https://github.com/rust-lang" target="_blank" rel="noopener" alt="github link"><img src="/images/github.svg" alt="github logo" title="GitHub"/></a>
+          <a href="https://twitter.com/rustlang" target="_blank" rel="noopener" alt="twitter link"><img src="{{root}}images/twitter.svg" alt="twitter logo" title="Twitter"/></a>
+          <a href="https://www.youtube.com/channel/UCaYhcUwRBNscFNUKTjgPFiA" target="_blank" rel="noopener" alt="youtube link"><img style="padding-top: 6px; padding-bottom:6px" src="{{root}}images/youtube.svg" alt="youtube logo" title="YouTube"/></a>
+          <a href="https://discord.gg/rust-lang" target="_blank" rel="noopener" alt="discord link"><img src="{{root}}images/discord.svg" alt="discord logo" title="Discord"/></a>
+          <a href="https://github.com/rust-lang" target="_blank" rel="noopener" alt="github link"><img src="{{root}}images/github.svg" alt="github logo" title="GitHub"/></a>
         </div>
         <h4 class="mt4 mb3">RSS</h4>
         <ul>
-          <li><a href="/feed.xml">Main Blog</a></li>
-          <li><a href="/inside-rust/feed.xml">"Inside Rust" Blog</a></li>
+          <li><a href="{{root}}feed.xml">Main Blog</a></li>
+          <li><a href="{{root}}inside-rust/feed.xml">"Inside Rust" Blog</a></li>
         </ul>
       </div>
 
@@ -43,4 +43,4 @@
 </footer>
 
 <!-- scripts -->
-<script src="/scripts/highlight.js"></script>
+<script src="{{root}}scripts/highlight.js"></script>

templates/headers.hbs

@@ -14,18 +14,18 @@
 <meta property="og:locale" content="en_US" />
 
 <!-- styles -->
-<link rel="stylesheet" href="/styles/vendor.css"/>
-<link rel="stylesheet" href="/styles/fonts.css"/>
-<link rel="stylesheet" href="/styles/app.css"/>
-<link rel="stylesheet" href="/styles/highlight.css"/>
+<link rel="stylesheet" href="{{root}}styles/vendor.css"/>
+<link rel="stylesheet" href="{{root}}styles/fonts.css"/>
+<link rel="stylesheet" href="{{root}}styles/app.css"/>
+<link rel="stylesheet" href="{{root}}styles/highlight.css"/>
 
 <!-- favicon -->
-<link rel="apple-touch-icon" sizes="180x180" href="/images/apple-touch-icon.png">
-<link rel="icon" type="image/png" sizes="16x16" href="/images/favicon-16x16.png">
-<link rel="icon" type="image/png" sizes="32x32" href="/images/favicon-32x32.png">
-<link rel="icon" type="image/svg+xml" href="/images/favicon.svg">
-<link rel="manifest" href="/images/site.webmanifest">
-<link rel="mask-icon" href="/images/safari-pinned-tab.svg" color="#5bbad5">
+<link rel="apple-touch-icon" sizes="180x180" href="{{root}}images/apple-touch-icon.png">
+<link rel="icon" type="image/png" sizes="16x16" href="{{root}}images/favicon-16x16.png">
+<link rel="icon" type="image/png" sizes="32x32" href="{{root}}images/favicon-32x32.png">
+<link rel="icon" type="image/svg+xml" href="{{root}}images/favicon.svg">
+<link rel="manifest" href="{{root}}images/site.webmanifest">
+<link rel="mask-icon" href="{{root}}images/safari-pinned-tab.svg" color="#5bbad5">
 <meta name="msapplication-TileColor" content="#00aba9">
 <meta name="theme-color" content="#ffffff">
 

templates/index.hbs

@@ -10,7 +10,7 @@
       <p>
       <b>See also:</b>
       {{#each other_blogs}}
-              <a href="{{url}}">{{link_text}}</a>
+              <a href="{{../root}}{{url}}">{{link_text}}</a>
       {{/each}}
       </p>
     </div>
@@ -28,7 +28,7 @@
       </tr>{{/if}}
       <tr>
         <td class="tr o-60 pr4 pr5-l bn">{{month_name month}}&nbsp;{{day}}</td>
-        <td class="bn"><a href="/{{../blog.prefix}}{{url}}">{{title}}</a></td>
+        <td class="bn"><a href="{{url}}">{{title}}</a></td>
       </tr>
     {{/each}}
     </table>

templates/nav.hbs

@@ -1,7 +1,7 @@
 <nav class="flex flex-row justify-center justify-end-l items-center flex-wrap ph2 pl3-ns pr4-ns">
   <div class="brand flex-auto w-100 w-auto-l self-start tc tl-l">
-    <a href="/{{blog.prefix}}">
-      <img class="v-mid ml0-l" alt="Rust Logo" src="/images/rust-logo-blk.svg">
+    <a href="{{root}}{{blog.prefix}}">
+      <img class="v-mid ml0-l" alt="Rust Logo" src="{{root}}images/rust-logo-blk.svg">
       <span class="dib ml1 ml0-l">{{blog.title}}</span>
     </a>
   </div>