show external links

app/styles/app.css

@@ -82,6 +82,21 @@ blockquote p:last-child {
   margin-bottom: 0;
 }
 
+header a[href^="http://"]:after,
+header a[href^="https://"]:after,
+footer p a[href^="http://"]:after,
+footer p a[href^="https://"]:after,
+.blog a[href^="http://"]:after,
+.blog a[href^="https://"]:after {
+  content: "";
+  background: url(/assets/external-link.svg);
+  background-size:  18px 18px;
+  background-repeat: no-repeat;
+  background-position: center center;
+  margin-left: 0.2em; /* spacing*/
+  padding-right: 1em; /* sizing */
+}
+
 /*
   TODO: these h2 styles have to move up to h1 styles because of the markdown rendering
   TODO: move the title to not an h1, then move these styles to h1

app/templates/application.gjs

@@ -29,8 +29,12 @@ class MyRouteComponent extends Component {
 
     <footer>
       <div class="socials">
-        <IconButton @icon="github" @href="https://github.com/EndangeredMassa" @title="link to github.com for EndangeredMassa" />
-        <IconButton @icon="mastodon" @href="https://social.massalabs.com/@sean" @title="link to social.massalabs.com (mastodon instance) for @sean" />
+        <IconButton @icon="github"
+          @href="https://github.com/EndangeredMassa"
+          @title="link to github.com for EndangeredMassa" />
+        <IconButton @icon="mastodon"
+          @href="https://social.massalabs.com/@sean"
+          @title="link to social.massalabs.com (mastodon instance) for @sean" />
       </div>
       <p>
         Thanks to <a href="https://kevquirk.com">Kev Quirk</a>

app/templates/blog.gjs

@@ -0,0 +1,9 @@
+import RouteTemplate from 'ember-route-template';
+
+export default RouteTemplate(
+<template>
+  <div class="blog">
+    {{outlet}}
+  </div>
+</template>
+);