Make a list's first axis from a lone "+ Axis" slot
The labelled field, hint and button were far heavier than the moment
needs. The same dashed slot settings uses now stands where the axis
tabs will be, and Enter makes the first axis.
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01RTqTY5gmGmtR4d3kBWGZTX
diff --git a/lib/rank_king/views/list/show.rb b/lib/rank_king/views/list/show.rb
index 30cb01d..aca116e 100644
--- a/lib/rank_king/views/list/show.rb
+++ b/lib/rank_king/views/list/show.rb
@@ -48,18 +48,14 @@ module RankKing
dialog(id: "sync-dialog") { render source.form(csrf: @csrf) }
end
- # Nothing to compare on yet, so the first axis is made here.
+ # Nothing to compare on yet. The "+ Axis" slot stands where the
+ # axis tabs will, and Enter makes the first one.
def render_items
action = "/lists/#{@list.id}/axes"
- form(method: "post", action: action) do
+ form(method: "post", action: action, data_first_axis: true) do
input(type: "hidden", name: "_csrf", value: @csrf.call(action))
- label(class: "field") do
- plain "First axis"
- input(type: "text", name: "name", required: true, placeholder: "Taste")
- small { "What to rank these items on." }
- end
- footer do
- button(type: "submit", data_variant: "primary") { "Add axis" }
+ span(class: "tag", data_dashed: true) do
+ input(type: "text", name: "name", required: true, placeholder: "+ Axis", aria_label: "New axis")
end
end
diff --git a/public/css/app.css b/public/css/app.css
index d1cde6e..4ae083a 100644
--- a/public/css/app.css
+++ b/public/css/app.css
@@ -137,6 +137,9 @@ textarea {
line-height: 1;
}
+/* A list's first axis is made from a lone slot where the tabs will be. */
+form[data-first-axis] { align-items: flex-start; }
+
/* -------------------- */
/* List actions menu */
/* -------------------- */
diff --git a/test/test_web.rb b/test/test_web.rb
index f753fda..cbbf488 100644
--- a/test/test_web.rb
+++ b/test/test_web.rb
@@ -255,7 +255,7 @@ class TestWeb < Minitest::Test
get "/lists/#{list.id}"
assert_includes last_response.body, %(action="/lists/#{list.id}/axes")
- assert_includes last_response.body, "First axis"
+ assert_includes last_response.body, 'aria-label="New axis"'
end
def test_add_axis_from_the_list