feat: add anchor links to file headings

Amolith and Crush created 3 weeks ago

Fixes: bug-dddb40e
Co-Authored-By: Crush <[e-mail]>

Change summary

pkg/web/static/overrides.css  | 10 ++++++++++
pkg/web/templates/commit.html |  1 +
2 files changed, 11 insertions(+)

Detailed changes

pkg/web/static/overrides.css

@@ -88,6 +88,16 @@ pre.chroma {
   background: var(--pico-code-background-color);
 }
 
+section[aria-labelledby="diff-heading"] article h4 .secondary {
+  opacity: 0;
+  transition: opacity 0.2s ease-in-out;
+}
+
+section[aria-labelledby="diff-heading"] article h4:hover .secondary,
+section[aria-labelledby="diff-heading"] article h4:focus-within .secondary {
+  opacity: 1;
+}
+
 :root {
   --pico-font-family-sans-serif: "Atkinson Hyperlegible Next","Atkinson Hyperlegible",system-ui,"Segoe UI",Roboto,Oxygen,Ubuntu,Cantarell,Helvetica,Arial,"Helvetica Neue",sans-serif,var(--pico-font-family-emoji);
   --pico-font-family-monospace: "0xProto","JetBrains Mono",ui-monospace,SFMono-Regular,"SF Mono",Menlo,Consolas,"Liberation Mono",monospace,var(--pico-font-family-emoji);

pkg/web/templates/commit.html

@@ -52,6 +52,7 @@
       {{else}}
         <a href="/{{$.Repo.Name}}/blob/{{$.Commit.ID}}/{{.Name}}">{{.Name}}</a>
       {{end}}
+      <small><a href="#file-{{.Name}}" class="secondary" title="Link to heading for {{.Name}}">🔗</a></small>
     </h4>
     <pre aria-label="Diff for {{.Name}}"><code>{{range .Sections}}{{range .Lines}}{{if eq .Type 2}}<ins>{{.Content}}</ins>{{else if eq .Type 3}}<del>{{.Content}}</del>{{else}}{{.Content}}{{end}}
 {{end}}{{end}}</code></pre>