Render source metadata as '↗ Original recipe' link next to title

- When recipe has a source: field in YAML metadata, shows a link
  to the right of the recipe title
- Link opens in new tab with ↗ icon and 'Original recipe' text
- Hidden when no source is present
- Title row uses flexbox: title on left, source link on right

src/Roux/Html.hs

@@ -337,7 +337,12 @@ renderRecipe recipe = do
     case course of
         Just c -> H.p ! A.class_ "roux-course" $ H.toHtml c
         Nothing -> pure ()
-    H.h1 $ H.toHtml (titleText recipe)
+    H.div ! A.style "display: flex; justify-content: space-between; align-items: baseline; gap: 1rem;" $ do
+        H.h1 $ H.toHtml (titleText recipe)
+        case metaSource meta of
+            Just url -> H.a ! A.href (H.toValue url) ! A.target "_blank" ! A.rel "noopener noreferrer" ! A.style "white-space: nowrap; font-size: 0.8rem; flex-shrink: 0;" $ do
+                "↗ Original recipe"
+            Nothing -> pure ()
     case desc of
         Just d -> H.p ! A.class_ "roux-desc" $ H.toHtml d
         Nothing -> pure ()