diff --git a/app/assets/stylesheets/_misc_legacy.sass b/app/assets/stylesheets/_misc_legacy.sass index e9509cb7a0..389a186000 100644 --- a/app/assets/stylesheets/_misc_legacy.sass +++ b/app/assets/stylesheets/_misc_legacy.sass @@ -230,15 +230,6 @@ div text-align: right white-space: nowrap -form .attributes - margin-bottom: 8px - overflow: auto - p - padding-top: 1px - padding-bottom: 2px - select - min-width: 50% - ul.projects margin: 0 padding-left: 1em diff --git a/app/assets/stylesheets/content/_forms.md b/app/assets/stylesheets/content/_forms.md index 563c252202..20114f3ea2 100644 --- a/app/assets/stylesheets/content/_forms.md +++ b/app/assets/stylesheets/content/_forms.md @@ -73,6 +73,9 @@
+ + Add 5 +
Any number from 1 to 10! @@ -387,6 +390,78 @@ ``` +## Forms: Column layout + +``` +@full-width + +
+
+
+
+ +
+
+ +
+
+
+ Write anything you like. +
+
+
+ +
+
+ +
+
+
+ Request new email +
+
+
+ +
+
+ +
+ + Add 5 + +
+
+ Any number from 1 to 10! +
+
+
+
+
+ +
+
+ +
+
+
+ Write more about anything. +
+
+
+
+
+ +
+
+
+ This field has no label, which means you really can write what you like. +
+
+
+
+
+``` + # Forms: Attachment fieldsets ``` @@ -434,7 +509,7 @@
-``` + # Forms: Text fields diff --git a/app/assets/stylesheets/content/_forms.sass b/app/assets/stylesheets/content/_forms.sass index 1c21d37054..913adcd668 100644 --- a/app/assets/stylesheets/content/_forms.sass +++ b/app/assets/stylesheets/content/_forms.sass @@ -42,6 +42,8 @@ $form--field-types: (text-field, text-area, select, check-box, range-field, sear text-align: left font-weight: normal vertical-align: middle + text-overflow: ellipsis + overflow: hidden // A general CSS class to be applied to forms using the above defined form style. // We can't define this on form itself as this would break a lot of existing forms. @@ -274,6 +276,11 @@ fieldset.form--fieldset @include grid-size(shrink) max-width: none +.form--field-inline-action + @include grid-content(shrink) + padding: 0 0 0 0.2rem + line-height: 2rem + %form--field-after-container @include grid-content(10, 2) padding: 0 @@ -413,6 +420,16 @@ fieldset.form--fieldset width: 1rem text-align: center +.form--column + @include grid-block + @include grid-orient(vertical) + + &:nth-last-of-type(n+2) + padding-right: $block-padding + + .form--field + flex-basis: auto + .inline-label > .form-label.-transparent margin-bottom: 0 diff --git a/app/helpers/work_packages_helper.rb b/app/helpers/work_packages_helper.rb index fb7a7bfed9..6a9724cc59 100644 --- a/app/helpers/work_packages_helper.rb +++ b/app/helpers/work_packages_helper.rb @@ -565,22 +565,29 @@ module WorkPackagesHelper return if locals[:project].categories.empty? category_field = work_package_form_field do - field = form.select(:category_id, - (locals[:project].categories.map { |c| [c.name, c.id] }), - include_blank: true) - - if authorize_for('categories', 'new') - - field += prompt_to_remote(icon_wrapper('icon icon-add icon4', - I18n.t(:label_work_package_category_new)), - I18n.t(:label_work_package_category_new), - 'category[name]', - project_categories_path(locals[:project]), - class: 'no-decoration-on-hover grid-block', - title: I18n.t(:label_work_package_category_new)) + label = form.label(:category_id) + + field = content_tag(:span, class: 'form--field-container') do + field = form.select(:category_id, + (locals[:project].categories.map { |c| [c.name, c.id] }), + include_blank: true, + no_label: true) + + if authorize_for('categories', 'new') + + field += prompt_to_remote(icon_wrapper('icon icon-add icon4', + I18n.t(:label_work_package_category_new)), + I18n.t(:label_work_package_category_new), + 'category[name]', + project_categories_path(locals[:project]), + class: 'no-decoration-on-hover form--field-inline-action', + title: I18n.t(:label_work_package_category_new)) + end + + field end - field + label + field end WorkPackageAttribute.new(:category, category_field) @@ -590,22 +597,29 @@ module WorkPackagesHelper return if work_package.assignable_versions.empty? version_field = work_package_form_field do - field = form.select(:fixed_version_id, - version_options_for_select(work_package.assignable_versions, - work_package.fixed_version), - include_blank: true) - - if authorize_for('versions', 'new') - field += prompt_to_remote(icon_wrapper('icon icon-add icon4', - I18n.t(:label_version_new)), - l(:label_version_new), - 'version[name]', - project_versions_path(locals[:project]), - class: 'no-decoration-on-hover grid-block', - title: l(:label_version_new)) + label = form.label(:fixed_version_id) + + field = content_tag(:span, class: 'form--field-container') do + field = form.select(:fixed_version_id, + version_options_for_select(work_package.assignable_versions, + work_package.fixed_version), + include_blank: true, + no_label: true) + + if authorize_for('versions', 'new') + field += prompt_to_remote(icon_wrapper('icon icon-add icon4', + I18n.t(:label_version_new)), + l(:label_version_new), + 'version[name]', + project_versions_path(locals[:project]), + class: 'no-decoration-on-hover form--field-inline-action', + title: l(:label_version_new)) + end + + field end - field + label + field end WorkPackageAttribute.new(:fixed_version, version_field) diff --git a/app/views/work_packages/_two_column_attributes.html.erb b/app/views/work_packages/_two_column_attributes.html.erb index 8d224686d3..0b6a4b987f 100644 --- a/app/views/work_packages/_two_column_attributes.html.erb +++ b/app/views/work_packages/_two_column_attributes.html.erb @@ -29,12 +29,12 @@ See doc/COPYRIGHT.rdoc for more details. <% left_attributes, right_attributes = attributes.in_groups(2, false) %>
-
+
<% left_attributes.each do |attribute| %> <%= attribute.field %> <% end %>
-
+
<% right_attributes.each do |attribute| %> <%= attribute.field %> <% end %> diff --git a/spec/helpers/work_packages_helper_spec.rb b/spec/helpers/work_packages_helper_spec.rb index bcd6a2ce96..fefb69363a 100644 --- a/spec/helpers/work_packages_helper_spec.rb +++ b/spec/helpers/work_packages_helper_spec.rb @@ -32,7 +32,12 @@ describe WorkPackagesHelper, type: :helper do let(:stub_work_package) { FactoryGirl.build_stubbed(:work_package) } let(:stub_project) { FactoryGirl.build_stubbed(:project) } let(:stub_type) { FactoryGirl.build_stubbed(:type) } - let(:form) { double('form', select: '').as_null_object } + let(:label_placeholder) { ''.html_safe } + let(:form) do + double('form', + select: '', + label: label_placeholder).as_null_object + end let(:stub_user) { FactoryGirl.build_stubbed(:user) } def inside_form(&_block) @@ -273,12 +278,15 @@ describe WorkPackagesHelper, type: :helper do expect(form).to receive(:select).with(:category_id, [[stub_category.name, stub_category.id]], - include_blank: true).and_return(select) + include_blank: true, + no_label: true).and_return(select) expect(helper.work_package_form_category_attribute(form, stub_work_package, project: stub_project).field) - .to eq("
category html
") + .to be_html_eql("
#{label_placeholder} + category html +
") end it 'should add an additional remote link to create new categories if allowed' do