Merge pull request #716 from basecamp/hide-focus-rings-on-cards

Hide focus ring on new card titles and step inputs
This commit is contained in:
Andy Smith
2025-07-07 13:25:38 -05:00
committed by GitHub
3 changed files with 5 additions and 5 deletions
+1 -1
View File
@@ -13,7 +13,7 @@
<%= form_with model: card, url: collection_card_path(card.collection, card), id: "card_form", class: "card__content", data: { controller: "autoresize auto-save" } do |form| %>
<h1 class="card__title autoresize__wrapper" data-autoresize-target="wrapper" data-autoresize-clone-value="">
<%= form.text_area :title, placeholder: "Name it…",
class: "input input--textarea full-width borderless txt-align-start autoresize__textarea",
class: "input input--textarea full-width borderless txt-align-start autoresize__textarea hide-focus-ring",
autofocus: card.title.blank? || params[:focus_on_title], rows: 1,
data: { autoresize_target: "textarea", action: "input->autoresize#resize auto-save#change blur->auto-save#submit keydown.enter->auto-save#submit:prevent keydown.ctrl+enter->auto-save#submit:prevent" } %>
</h1>
@@ -4,7 +4,7 @@
<div class="step">
<input type="checkbox" class="step__checkbox" disabled>
<%= form_with model: [card, Step.new], url: card_steps_path(card) do |form| %>
<%= form.text_field :content, class: "input step__content", placeholder: "Add a step…", required: true, autocomplete: "off" %>
<%= form.text_field :content, class: "input step__content hide-focus-ring", placeholder: "Add a step…", required: true, autocomplete: "off" %>
<% end %>
</div>
</ol>
</ol>
+2 -2
View File
@@ -2,7 +2,7 @@
<div class="flex align-center gap-half">
<%= form_with model: [@card, @step], class: "step", data: { controller: "form" } do |form| %>
<%= form.check_box :completed, { class: "step__checkbox", checked: @step.completed?, disabled: true } %>
<%= form.text_field :content, class: "input step__content step__content--edit", placeholder: "Name this step…", required: true, autofocus: true, autocomplete: "off",
<%= form.text_field :content, class: "input step__content step__content--edit hide-focus-ring", placeholder: "Name this step…", required: true, autofocus: true, autocomplete: "off",
data: { action: "keydown.esc->form#cancel focus->form#select" } %>
<%= form.button type: "submit", class: "btn btn--positive txt-xx-small" do %>
<%= icon_tag "check" %>
@@ -15,4 +15,4 @@
<span class="for-screen-reader">Delete this step</span>
<% end %>
</div>
<% end %>
<% end %>