Size the header's back and ⋯ buttons to the heading
The default IconButton draws its icon at label size, slight beside a
heading. The header's icon buttons take the large size, and their icon
grows inside that square to sit level with the title.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01RTqTY5gmGmtR4d3kBWGZTX
change
commit c26277df3b19cbdc78f649a99bdd6522f3c9cbf6
author Claude <noreply@anthropic.com>
date
parent 28253e93
diff --git a/lib/rank_king/views/layout.rb b/lib/rank_king/views/layout.rb
index 4084aea..60c3b6e 100644
--- a/lib/rank_king/views/layout.rb
+++ b/lib/rank_king/views/layout.rb
@@ -69,7 +69,7 @@ module RankKing
       def view_template(&block)
         header do
           if @back
-            a(href: @back, class: "icon-button", aria_label: @back_label,
+            a(href: @back, class: "icon-button", data_size: "lg", aria_label: @back_label,
               style: "--gl-icon: var(--gl-icon-chevron-left)")
           end
           h1(class: @size) { @title }
diff --git a/lib/rank_king/views/list/show.rb b/lib/rank_king/views/list/show.rb
index aca116e..5b57ff7 100644
--- a/lib/rank_king/views/list/show.rb
+++ b/lib/rank_king/views/list/show.rb
@@ -37,7 +37,7 @@ module RankKing
         def render_menu
           source = @list.source
 
-          button(class: "icon-button", popovertarget: "list-actions", aria_label: "List actions",
+          button(class: "icon-button", data_size: "lg", popovertarget: "list-actions", aria_label: "List actions",
                  style: "--gl-icon: var(--rk-icon-more)")
           nav(id: "list-actions", popover: true, aria_label: "List actions") do
             ul(class: "card") do
diff --git a/public/css/app.css b/public/css/app.css
index 4ae083a..e5c8867 100644
--- a/public/css/app.css
+++ b/public/css/app.css
@@ -66,6 +66,11 @@ main > header {
 
 main > header h1 { flex: 1; min-width: 0; }
 
+/* The header's icon buttons sit beside a heading, not a label: even at
+   the large size an icon at 1em looks slight next to it, so the icon
+   grows inside the same square. */
+main > header .icon-button { --gl-icon-style-size: 1.35em; }
+
 section {
   display: flex;
   flex-direction: column;