Fix focus on form submit button

This commit is contained in:
cryptogopher 2023-04-11 00:38:16 +02:00
parent 3cb63a302c
commit b54fcebf8c
2 changed files with 22 additions and 28 deletions

View File

@ -87,14 +87,16 @@ input[type=submit] {
.application-menu a.active,
.application-menu a:hover,
.application-menu a:hover:focus-visible,
input[type=submit]:hover {
input[type=submit]:hover,
input[type=submit]:hover:focus-visible {
background-color: #009ade;
border-color: #009ade;
color: white;
cursor: pointer;
fill: white;
}
.application-menu a:focus-visible {
.application-menu a:focus-visible,
input[type=submit]:focus-visible {
background-color: #f3f3f3;
}
.application-menu a.active:focus-visible {
@ -148,35 +150,22 @@ input[type=submit]:hover {
opacity: 1;
}
form {
form table {
border-spacing: 0.8rem;
margin: 0 auto;
display: table;
border-spacing: 0.8em;
}
.form-row {
display: table-row;
}
.form-label, .form-field {
display: table-cell;
vertical-align: middle;
}
.form-label {
form tr td:first-child {
font-size: 0.9em;
padding-right: 0.25em;
text-align: right;
}
.form-label.required {
form td.required {
font-weight: bold;
}
.form-label.error {
form td.error {
color: #ff1f5b;
}
.form-actions {
caption-side: bottom;
display: table-caption;
}
form input[type=submit] {
display: block;
float: none;
font-size: 0.9em;
margin: 0 auto;

View File

@ -3,27 +3,32 @@ module ApplicationHelper
(field_helpers - [:label]).each do |selector|
class_eval <<-RUBY_EVAL, __FILE__, __LINE__ + 1
def #{selector}(method, options = {})
@template.content_tag :div, class: "form-row" do
@template.content_tag :tr do
label_text = label(method, options.delete(:label))
label_class = ["form-label"]
label_class << "required" if options[:required]
label_class << "error" if @object&.errors[method].present?
label_class = @template.class_names(required: options[:required],
error: @object&.errors[method].present?)
@template.content_tag(:div, label_text, class: label_class) +
@template.content_tag(:div, super, class: "form-field")
@template.content_tag(:td, label_text, class: label_class) +
@template.content_tag(:td, super)
end
end
RUBY_EVAL
end
def submit(value, options = {})
@template.content_tag :div, super, class: "form-actions"
@template.content_tag :tr do
@template.content_tag :td, super, colspan: 2
end
end
def table_form_for(&block)
@template.content_tag(:table) { yield(self) }
end
end
def tabular_form_for(record, options = {}, &block)
options.merge! builder: TabularFormBuilder
form_for(record, **options, &block)
form_for(record, **options, &-> (f) { f.table_form_for(&block) })
end
def image_link_to(name, image = nil, options = nil, html_options = nil)