diff --git a/app/components/work_package_relations_tab/index_component.rb b/app/components/work_package_relations_tab/index_component.rb index f96171becfb1..083455043601 100644 --- a/app/components/work_package_relations_tab/index_component.rb +++ b/app/components/work_package_relations_tab/index_component.rb @@ -61,7 +61,7 @@ def render_relation_group(title:, relation_type:, items:, &_block) end items.each do |item| - border_box.with_row(py: 3, test_selector: row_test_selector(item)) do + border_box.with_row(test_selector: row_test_selector(item)) do yield(item) end end diff --git a/app/components/work_package_relations_tab/index_component.sass b/app/components/work_package_relations_tab/index_component.sass index 853f0f9a520f..32a1e670cced 100644 --- a/app/components/work_package_relations_tab/index_component.sass +++ b/app/components/work_package_relations_tab/index_component.sass @@ -1,5 +1,5 @@ // We reference an ID as one is required to be specified for the action menu list. // It can't be nested inside the BEM model as it's placed as a #top-layer element. #new-relation-action-menu-list - max-height: 380px + max-height: 450px max-width: 280px diff --git a/app/components/work_package_relations_tab/relation_component.html.erb b/app/components/work_package_relations_tab/relation_component.html.erb index 2c2dc4acf5dd..12788bdb76d0 100644 --- a/app/components/work_package_relations_tab/relation_component.html.erb +++ b/app/components/work_package_relations_tab/relation_component.html.erb @@ -1,21 +1,12 @@ <%= flex_layout do |flex| - flex.with_row do - render(WorkPackages::InfoLineComponent.new(work_package: related_work_package)) - end - - flex.with_row(flex_layout: true, justify_content: :space_between, align_items: :flex_start) do |subject_line_row| - subject_line_row.with_column(py: 2) do - render(Primer::Beta::Link.new(href: work_package_path(related_work_package), - color: :default, - underline: false, - font_size: :normal, - font_weight: :bold, - target: "_blank")) { related_work_package.subject } + flex.with_row(flex_layout: true, justify_content: :space_between, align_items: :center) do |row| + row.with_column do + render(WorkPackages::InfoLineComponent.new(work_package: related_work_package)) end if should_render_action_menu? - subject_line_row.with_column do + row.with_column do render(Primer::Alpha::ActionMenu.new(test_selector: action_menu_test_selector)) do |menu| menu.with_show_button(icon: "kebab-horizontal", "aria-label": I18n.t(:label_relation_actions), @@ -52,16 +43,23 @@ flex_layout do |flex| end end + flex.with_row(mb: 2) do + render(Primer::Beta::Link.new(href: work_package_path(related_work_package), + color: :default, + underline: false, + font_size: :normal, + font_weight: :bold, + target: "_blank")) { related_work_package.subject } + end + if should_display_description? - flex.with_row(flex_layout: true, mb: 2) do |description_row| - description_row.with_column do - render(Primer::Beta::Text.new(font_size: :small, color: :muted)) { format_text(relation, :description) } - end + flex.with_row(mb: 2) do + render(Primer::Beta::Text.new(font_size: :small, color: :muted)) { format_text(relation, :description) } end end if should_display_start_and_end_dates? - flex.with_row(flex_layout: true, align_items: :center) do |start_and_end_dates_row| + flex.with_row(flex_layout: true, align_items: :center, mb: 2) do |start_and_end_dates_row| start_and_end_dates_row.with_column(mr: 1) do icon = if follows? :calendar