Highlight external links in menu bar

Author: klieret

static/css/layout.css

@@ -89,6 +89,13 @@ nav {
     margin-right: 1rem;
 }
 
+.nav-links .external-link li::after {
+    content: "↗";
+    font-size: 0.7em;
+    vertical-align: super;
+    margin-left: 0.1em;
+}
+
 .icon-btn {
     display: inline-flex;
     align-items: center;

templates/_topnav.html

@@ -5,10 +5,10 @@
     <div class="nav-right">
         <ul class="nav-links">
             <a href="/arenas/"><li>Arenas</li></a>
-            <a href="https://arxiv.org/pdf/2511.00839.pdf"><li>Paper</li></a>
+            <a href="https://arxiv.org/pdf/2511.00839.pdf" class="external-link"><li>Paper</li></a>
             <a href="/insights/"><li>Insights</li></a>
-            <a href="https://viewer.codeclash.ai"><li>Trajectories</li></a>
-            <a href=""><li>Docs</li></a>
+            <a href="https://viewer.codeclash.ai" class="external-link"><li>Trajectories</li></a>
+            <a href="" class="external-link"><li>Docs</li></a>
             <a href="/team/"><li>Team</li></a>
         </ul>
         <a href="https://github.com/codeclash-ai/codeclash" class="icon-btn" aria-label="GitHub" title="Check out our code on GitHub" target="_blank" rel="noopener noreferrer">