diff --git a/app/assets/stylesheets/admin.scss b/app/assets/stylesheets/admin.scss index 18cefcfb6..29bf4ac6e 100644 --- a/app/assets/stylesheets/admin.scss +++ b/app/assets/stylesheets/admin.scss @@ -168,6 +168,10 @@ $table-header: #ecf1f6; font-weight: bold; } + .radio { + @include radio-or-checkbox-and-label-alignment; + } + select { height: $input-height; } @@ -587,112 +591,6 @@ table { } } -.legislation-draft-versions-form { - - .control { - cursor: pointer; - margin-bottom: 1rem; - - small { - color: $text-medium; - display: block; - margin-top: -1rem; - - @include breakpoint(medium) { - display: inline-block; - margin-left: 0.25rem; - margin-top: 0; - } - } - } - - .fullscreen-container { - background: #ccdbe6; - text-align: center; - - .markdown-editor-header, - .markdown-editor-buttons { - display: none; - } - - span { - font-size: $small-font-size; - text-decoration: none; - } - - .icon-expand { - line-height: 0; - margin-left: 0.25rem; - text-decoration: none; - vertical-align: sub; - } - } - - .markdown-preview { - border: 1px solid #cacaca; - font-family: $font-family-serif; - margin-bottom: 2rem; - - h1, - h2, - h3, - h4, - h5, - h6 { - font-family: $font-family-serif !important; - font-size: 1rem; - line-height: 1.625rem; - margin-bottom: 0; - } - - p { - font-size: 1rem; - line-height: 1.625rem; - } - } - - .fullscreen { - - .markdown-area, - .markdown-preview { - display: block; - } - - .column { - padding: 0; - } - - .fullscreen-container { - background: $admin-color; - margin-bottom: 0; - padding: 0.5rem 1rem; - text-align: left; - } - - .legislation-draft-version-body { - border-radius: 0; - - @include breakpoint(medium) { - padding-left: 2rem; - padding-right: 2rem; - } - - &:focus { - box-shadow: inset 0 1px 2px rgba(34, 34, 34, 0.1); - } - } - - .markdown-preview { - border: 0; - padding: 1rem; - - @include breakpoint(medium) { - padding: 1rem 2rem; - } - } - } -} - // 10. Budgets // ----------------- diff --git a/app/assets/stylesheets/admin/dashboard/actions/form.scss b/app/assets/stylesheets/admin/dashboard/actions/form.scss new file mode 100644 index 000000000..aac8f43a1 --- /dev/null +++ b/app/assets/stylesheets/admin/dashboard/actions/form.scss @@ -0,0 +1,11 @@ +.dashboard-action-form { + .collection-radio-buttons { + column-gap: $line-height; + display: flex; + flex-wrap: wrap; + } + + .radio-and-label { + @include radio-or-checkbox-and-label-alignment; + } +} diff --git a/app/assets/stylesheets/admin/legislation/draft_versions/form.scss b/app/assets/stylesheets/admin/legislation/draft_versions/form.scss new file mode 100644 index 000000000..7764ccbf7 --- /dev/null +++ b/app/assets/stylesheets/admin/legislation/draft_versions/form.scss @@ -0,0 +1,96 @@ +.legislation-draft-versions-form { + + .fullscreen-container { + background: #ccdbe6; + text-align: center; + + .markdown-editor-header, + .markdown-editor-buttons { + display: none; + } + + span { + font-size: $small-font-size; + text-decoration: none; + } + + .icon-expand { + line-height: 0; + margin-left: 0.25rem; + text-decoration: none; + vertical-align: sub; + } + } + + .markdown-preview { + border: 1px solid #cacaca; + font-family: $font-family-serif; + margin-bottom: 2rem; + + h1, + h2, + h3, + h4, + h5, + h6 { + font-family: $font-family-serif !important; + font-size: 1rem; + line-height: 1.625rem; + margin-bottom: 0; + } + + p { + font-size: 1rem; + line-height: 1.625rem; + } + } + + .fullscreen { + + .markdown-area, + .markdown-preview { + display: block; + } + + .column { + padding: 0; + } + + .fullscreen-container { + background: $admin-color; + margin-bottom: 0; + padding: 0.5rem 1rem; + text-align: left; + } + + .legislation-draft-version-body { + border-radius: 0; + + @include breakpoint(medium) { + padding-left: 2rem; + padding-right: 2rem; + } + + &:focus { + box-shadow: inset 0 1px 2px rgba(34, 34, 34, 0.1); + } + } + + .markdown-preview { + border: 0; + padding: 1rem; + + @include breakpoint(medium) { + padding: 1rem 2rem; + } + } + } + + .radio-and-label { + @include radio-or-checkbox-and-label-alignment; + + span { + margin-left: 1ch; + } + } +} diff --git a/app/assets/stylesheets/admin/locales/form.scss b/app/assets/stylesheets/admin/locales/form.scss index ec965cfd2..00eab79db 100644 --- a/app/assets/stylesheets/admin/locales/form.scss +++ b/app/assets/stylesheets/admin/locales/form.scss @@ -1,6 +1,6 @@ .admin .locales-form { label { - display: table; + @include radio-or-checkbox-and-label-alignment; } select { diff --git a/app/assets/stylesheets/admin/site_customization/pages/form.scss b/app/assets/stylesheets/admin/site_customization/pages/form.scss new file mode 100644 index 000000000..0788cd01d --- /dev/null +++ b/app/assets/stylesheets/admin/site_customization/pages/form.scss @@ -0,0 +1,5 @@ +.site-customization-pages-form { + .radio-and-label { + @include radio-or-checkbox-and-label-alignment; + } +} diff --git a/app/assets/stylesheets/admin/tenants/form.scss b/app/assets/stylesheets/admin/tenants/form.scss index eed01d51f..7b7f52025 100644 --- a/app/assets/stylesheets/admin/tenants/form.scss +++ b/app/assets/stylesheets/admin/tenants/form.scss @@ -5,7 +5,7 @@ } .radio-and-label { - display: flex; + @include radio-or-checkbox-and-label-alignment; margin-bottom: calc($line-height / 3); &:last-of-type { diff --git a/app/assets/stylesheets/layout.scss b/app/assets/stylesheets/layout.scss index c6ff179c9..b3eae06c4 100644 --- a/app/assets/stylesheets/layout.scss +++ b/app/assets/stylesheets/layout.scss @@ -909,7 +909,6 @@ form { } [type="radio"] { - height: $line-height !important; vertical-align: top; + label { diff --git a/app/assets/stylesheets/mixins/forms.scss b/app/assets/stylesheets/mixins/forms.scss index df105c36d..683d19783 100644 --- a/app/assets/stylesheets/mixins/forms.scss +++ b/app/assets/stylesheets/mixins/forms.scss @@ -199,3 +199,9 @@ text-transform: uppercase; } } + +@mixin radio-or-checkbox-and-label-alignment { + align-items: baseline; + display: flex; + max-width: max-content; +} diff --git a/app/components/admin/dashboard/actions/form_component.html.erb b/app/components/admin/dashboard/actions/form_component.html.erb new file mode 100644 index 000000000..51eedf7c6 --- /dev/null +++ b/app/components/admin/dashboard/actions/form_component.html.erb @@ -0,0 +1,82 @@ +
+ <%= form_for dashboard_action, url: { action: url_action } do |f| %> + <%= render "shared/errors" %> + +
+
+ <%= attribute_name(:action_type) %> +
+ <% ::Dashboard::Action.action_types.keys.each do |action_type_value| %> + + <%= f.radio_button :action_type, action_type_value %> + + <% end %> +
+
+ +
+ <%= f.check_box :active %> +
+ +
+ <%= f.check_box :request_to_administrators %> +
+ +
+ +
+
+ <%= f.text_field :title %> + +
+ <%= f.text_field :short_description %> +
+ + <%= f.text_area :description, class: "html-area" %> +
+
+ +
+
+ <%= f.check_box :published_proposal %> +

<%= t("admin.dashboard.actions.form.published_proposal_help_text") %>

+
+
+ +
+
+ <%= f.number_field :day_offset, step: 1, + min: 0, + hint: t("admin.dashboard.actions.form.help_text") %> +
+ +
+ <%= f.number_field :required_supports, step: 1, + min: 0, + hint: t("admin.dashboard.actions.form.help_text") %> +
+ +
+ <%= f.number_field :order, step: 1, + min: 0, + hint: t("admin.dashboard.actions.form.help_text") %> +
+
+ + <% if feature?(:allow_attached_documents) %> +
+ <%= render Documents::NestedComponent.new(f) %> +
+ <% end %> + +
+ <%= render "links/nested_links", linkable: dashboard_action, f: f %> +
+ +
+
+ <%= f.submit(class: "button expanded", value: t("admin.dashboard.actions.form.submit_button")) %> +
+
+ <% end %> +
diff --git a/app/components/admin/dashboard/actions/form_component.rb b/app/components/admin/dashboard/actions/form_component.rb new file mode 100644 index 000000000..18033ba63 --- /dev/null +++ b/app/components/admin/dashboard/actions/form_component.rb @@ -0,0 +1,14 @@ +class Admin::Dashboard::Actions::FormComponent < ApplicationComponent + attr_reader :dashboard_action, :url_action + + def initialize(dashboard_action, url_action:) + @dashboard_action = dashboard_action + @url_action = url_action + end + + private + + def attribute_name(attribute) + Dashboard::Action.human_attribute_name(attribute) + end +end diff --git a/app/views/admin/legislation/draft_versions/_form.html.erb b/app/components/admin/legislation/draft_versions/form_component.html.erb similarity index 66% rename from app/views/admin/legislation/draft_versions/_form.html.erb rename to app/components/admin/legislation/draft_versions/form_component.html.erb index b3f6286a9..8c928ba55 100644 --- a/app/views/admin/legislation/draft_versions/_form.html.erb +++ b/app/components/admin/legislation/draft_versions/form_component.html.erb @@ -1,12 +1,7 @@ -<%= render "shared/globalize_locales", resource: @draft_version %> +<%= render "shared/globalize_locales", resource: draft_version %> -<%= translatable_form_for [:admin, @process, @draft_version], url: url, - html: { - data: { - markdown_changes_message: I18n.t("admin.legislation.draft_versions.edit.markdown_changes_message") - } - } do |f| %> - <%= render "shared/errors", resource: @draft_version %> +<%= translatable_form_for [:admin, process, draft_version], form_attributes do |f| %> + <%= render "shared/errors", resource: draft_version %>
<%= f.translatable_fields do |translations_form| %> @@ -35,12 +30,12 @@
<%= sanitize(t("admin.legislation.draft_versions.form.title", - draft_version_title: @draft_version.title, - process_title: @process.title)) %> + draft_version_title: draft_version.title, + process_title: process.title)) %>
- <%= f.submit(class: "button", value: t("admin.legislation.draft_versions.#{admin_submit_action(@draft_version)}.submit_button")) %> + <%= f.submit(class: "button", value: t("admin.legislation.draft_versions.#{admin_submit_action(draft_version)}.submit_button")) %>
<%= link_to "#", class: "fullscreen-toggle" do %> @@ -65,14 +60,15 @@
-
- <%= f.label :status %> +
+ <%= attribute_name(:status) %> <% ::Legislation::DraftVersion::VALID_STATUSES.each do |status| %> - <%= f.radio_button :status, status %> - <%= t("admin.legislation.draft_versions.form.hints.status.#{status}") %> -
+ + <%= f.radio_button :status, status %> + <%= t("admin.legislation.draft_versions.form.hints.status.#{status}") %> + <% end %> -
+
<%= f.check_box :final_version %> @@ -80,7 +76,7 @@
- <%= f.submit(class: "button success expanded", value: t("admin.legislation.draft_versions.#{admin_submit_action(@draft_version)}.submit_button")) %> + <%= f.submit(class: "button success expanded", value: submit_button_text) %>
<% end %> diff --git a/app/components/admin/legislation/draft_versions/form_component.rb b/app/components/admin/legislation/draft_versions/form_component.rb new file mode 100644 index 000000000..007295478 --- /dev/null +++ b/app/components/admin/legislation/draft_versions/form_component.rb @@ -0,0 +1,39 @@ +class Admin::Legislation::DraftVersions::FormComponent < ApplicationComponent + include TranslatableFormHelper + include GlobalizeHelper + attr_reader :draft_version, :url + use_helpers :admin_submit_action + + def initialize(draft_version, url:) + @draft_version = draft_version + @url = url + end + + private + + def attribute_name(attribute) + Legislation::DraftVersion.human_attribute_name(attribute) + end + + def process + draft_version.process + end + + def form_attributes + { + url: url, + html: { + data: { markdown_changes_message: markdown_changes_message }, + class: "legislation-draft-versions-form" + } + } + end + + def markdown_changes_message + I18n.t("admin.legislation.draft_versions.edit.markdown_changes_message") + end + + def submit_button_text + t("admin.legislation.draft_versions.#{admin_submit_action(draft_version)}.submit_button") + end +end diff --git a/app/components/admin/site_customization/pages/edit_component.html.erb b/app/components/admin/site_customization/pages/edit_component.html.erb index f408bd9ef..81564f946 100644 --- a/app/components/admin/site_customization/pages/edit_component.html.erb +++ b/app/components/admin/site_customization/pages/edit_component.html.erb @@ -11,4 +11,4 @@ ) %> <% end %> -<%= render "form" %> +<%= render Admin::SiteCustomization::Pages::FormComponent.new(page) %> diff --git a/app/views/admin/site_customization/pages/_form.html.erb b/app/components/admin/site_customization/pages/form_component.html.erb similarity index 71% rename from app/views/admin/site_customization/pages/_form.html.erb rename to app/components/admin/site_customization/pages/form_component.html.erb index 36e65c54e..141ed75b0 100644 --- a/app/views/admin/site_customization/pages/_form.html.erb +++ b/app/components/admin/site_customization/pages/form_component.html.erb @@ -1,7 +1,7 @@ -<%= render "shared/globalize_locales", resource: @page %> +<%= render "shared/globalize_locales", resource: page %> -<%= translatable_form_for [:admin, @page], html: { class: "edit_page" } do |f| %> - <%= render "shared/errors", resource: @page %> +<%= translatable_form_for [:admin, page], html: { class: "site-customization-pages-form" } do |f| %> + <%= render "shared/errors", resource: page %>
@@ -10,11 +10,14 @@

<%= t("admin.site_customization.pages.form.options") %>

- <%= f.label :status %> - <% ::SiteCustomization::Page::VALID_STATUSES.each do |status| %> - <%= f.radio_button :status, status %> -
- <% end %> +
+ <%= attribute_name(:status) %> + <% ::SiteCustomization::Page::VALID_STATUSES.each do |status| %> + + <%= f.radio_button :status, status %> + + <% end %> +
<%= f.check_box :more_info_flag, class: "small" %> <%= f.check_box :print_content_flag %> diff --git a/app/components/admin/site_customization/pages/form_component.rb b/app/components/admin/site_customization/pages/form_component.rb new file mode 100644 index 000000000..b4f705107 --- /dev/null +++ b/app/components/admin/site_customization/pages/form_component.rb @@ -0,0 +1,15 @@ +class Admin::SiteCustomization::Pages::FormComponent < ApplicationComponent + include TranslatableFormHelper + include GlobalizeHelper + attr_reader :page + + def initialize(page) + @page = page + end + + private + + def attribute_name(attribute) + SiteCustomization::Page.human_attribute_name(attribute) + end +end diff --git a/app/components/admin/site_customization/pages/new_component.html.erb b/app/components/admin/site_customization/pages/new_component.html.erb index aee470c74..593b67142 100644 --- a/app/components/admin/site_customization/pages/new_component.html.erb +++ b/app/components/admin/site_customization/pages/new_component.html.erb @@ -3,4 +3,4 @@ <%= header %> -<%= render "form" %> +<%= render Admin::SiteCustomization::Pages::FormComponent.new(page) %> diff --git a/app/views/admin/dashboard/actions/_form.html.erb b/app/views/admin/dashboard/actions/_form.html.erb deleted file mode 100644 index a3a4301ea..000000000 --- a/app/views/admin/dashboard/actions/_form.html.erb +++ /dev/null @@ -1,76 +0,0 @@ -<%= render "shared/errors" %> - -
-
- <%= f.label :action_type %> - <% ::Dashboard::Action.action_types.keys.each do |action_type_value| %> - - <%= f.radio_button :action_type, action_type_value %> - - <% end %> -
- -
- <%= f.check_box :active %> -
- -
- <%= f.check_box :request_to_administrators %> -
- -
- -
-
- <%= f.text_field :title %> - -
- <%= f.text_field :short_description %> -
- - <%= f.text_area :description, class: "html-area" %> -
-
- -
-
- <%= f.check_box :published_proposal %> -

<%= t("admin.dashboard.actions.form.published_proposal_help_text") %>

-
-
- -
-
- <%= f.number_field :day_offset, step: 1, - min: 0, - hint: t("admin.dashboard.actions.form.help_text") %> -
- -
- <%= f.number_field :required_supports, step: 1, - min: 0, - hint: t("admin.dashboard.actions.form.help_text") %> -
- -
- <%= f.number_field :order, step: 1, - min: 0, - hint: t("admin.dashboard.actions.form.help_text") %> -
-
- -<% if feature?(:allow_attached_documents) %> -
- <%= render Documents::NestedComponent.new(f) %> -
-<% end %> - -
- <%= render "links/nested_links", linkable: dashboard_action, f: f %> -
- -
-
- <%= f.submit(class: "button expanded", value: t("admin.dashboard.actions.form.submit_button")) %> -
-
diff --git a/app/views/admin/dashboard/actions/edit.html.erb b/app/views/admin/dashboard/actions/edit.html.erb index 9ab97a45d..bb10835b5 100644 --- a/app/views/admin/dashboard/actions/edit.html.erb +++ b/app/views/admin/dashboard/actions/edit.html.erb @@ -3,8 +3,4 @@

<%= t("admin.dashboard.actions.edit.editing") %>

-
- <%= form_for dashboard_action, url: { action: "update" } do |f| %> - <%= render "form", f: f %> - <% end %> -
+<%= render Admin::Dashboard::Actions::FormComponent.new(dashboard_action, url_action: "update") %> diff --git a/app/views/admin/dashboard/actions/new.html.erb b/app/views/admin/dashboard/actions/new.html.erb index 67e8e54ad..e8b158f2c 100644 --- a/app/views/admin/dashboard/actions/new.html.erb +++ b/app/views/admin/dashboard/actions/new.html.erb @@ -3,8 +3,4 @@

<%= t("admin.dashboard.actions.new.creating") %>

-
- <%= form_for dashboard_action, url: { action: "create" } do |f| %> - <%= render "form", f: f %> - <% end %> -
+<%= render Admin::Dashboard::Actions::FormComponent.new(dashboard_action, url_action: "create") %> diff --git a/app/views/admin/legislation/draft_versions/edit.html.erb b/app/views/admin/legislation/draft_versions/edit.html.erb index 1d9d84e3b..ecedc339e 100644 --- a/app/views/admin/legislation/draft_versions/edit.html.erb +++ b/app/views/admin/legislation/draft_versions/edit.html.erb @@ -2,7 +2,7 @@ <%= t("admin.header.title") %> - <%= t("admin.menu.legislation") %> - <%= @process.title %> - <%= t("admin.legislation.draft_versions.index.title") %> - <%= @draft_version.title %> <% end %> -
+
<%= back_link_to admin_legislation_process_draft_versions_path(@process), t("admin.legislation.draft_versions.edit.back") %> @@ -24,6 +24,9 @@
- <%= render "form", url: admin_legislation_process_draft_version_path(@process, @draft_version) %> + <%= render Admin::Legislation::DraftVersions::FormComponent.new( + @draft_version, + url: admin_legislation_process_draft_version_path(@process, @draft_version) + ) %>
diff --git a/app/views/admin/legislation/draft_versions/new.html.erb b/app/views/admin/legislation/draft_versions/new.html.erb index fd3498afa..42f489c89 100644 --- a/app/views/admin/legislation/draft_versions/new.html.erb +++ b/app/views/admin/legislation/draft_versions/new.html.erb @@ -2,7 +2,7 @@ <%= t("admin.header.title") %> - <%= t("admin.menu.legislation") %> - <%= @process.title %> - <%= t("admin.legislation.draft_versions.index.title") %> - <%= t("admin.legislation.draft_versions.new.title") %> <% end %> -
+
<%= back_link_to admin_legislation_process_draft_versions_path(@process), t("admin.legislation.draft_versions.new.back") %> @@ -13,6 +13,9 @@

<%= t("admin.legislation.draft_versions.new.title") %>

- <%= render "form", url: admin_legislation_process_draft_versions_path(@process) %> + <%= render Admin::Legislation::DraftVersions::FormComponent.new( + @draft_version, + url: admin_legislation_process_draft_versions_path(@process) + ) %>