diff --git a/app/components/settings/project_life_cycle_step_definitions/row_component.html.erb b/app/components/settings/project_life_cycle_step_definitions/row_component.html.erb index 83b6773ae6de..2c02f43f8f10 100644 --- a/app/components/settings/project_life_cycle_step_definitions/row_component.html.erb +++ b/app/components/settings/project_life_cycle_step_definitions/row_component.html.erb @@ -29,7 +29,7 @@ See COPYRIGHT and LICENSE files for more details. <%= flex_layout(align_items: :center, justify_content: :space_between) do |row_container| - row_container.with_column(flex_layout: true) do |title_container| + row_container.with_column(flex_layout: true, classes: "gap-2") do |title_container| title_container.with_column do render(Primer::Beta::Link.new( classes: 'filter-target-visible-text', @@ -39,10 +39,10 @@ See COPYRIGHT and LICENSE files for more details. definition.name end end - title_container.with_column(ml: 2) do + title_container.with_column do render(Projects::LifeCycleTypeComponent.new(definition)) end - title_container.with_column(ml: 2) do + title_container.with_column do render(Primer::Beta::Text.new) { t("project.count", count: definition.project_count) } end end diff --git a/frontend/src/global_styles/openproject/_gap.scss b/frontend/src/global_styles/openproject/_gap.scss new file mode 100644 index 000000000000..9925956de44e --- /dev/null +++ b/frontend/src/global_styles/openproject/_gap.scss @@ -0,0 +1,44 @@ +//-- copyright +// OpenProject is an open source project management software. +// Copyright (C) the OpenProject GmbH +// +// This program is free software; you can redistribute it and/or +// modify it under the terms of the GNU General Public License version 3. +// +// OpenProject is a fork of ChiliProject, which is a fork of Redmine. The copyright follows: +// Copyright (C) 2006-2013 Jean-Philippe Lang +// Copyright (C) 2010-2013 the ChiliProject Team +// +// This program is free software; you can redistribute it and/or +// modify it under the terms of the GNU General Public License +// as published by the Free Software Foundation; either version 2 +// of the License, or (at your option) any later version. +// +// This program is distributed in the hope that it will be useful, +// but WITHOUT ANY WARRANTY; without even the implied warranty of +// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the +// GNU General Public License for more details. +// +// You should have received a copy of the GNU General Public License +// along with this program; if not, write to the Free Software +// Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. +// +// See COPYRIGHT and LICENSE files for more details. +//++ + +// copied from https://github.com/primer/css/blob/main/src/support/variables/layout.scss +$spacer-map-rem: ( + 0: 0, + 1: var(--base-size-4, 4px), + 2: var(--base-size-8, 8px), + 3: var(--base-size-16, 16px), + 4: var(--base-size-24, 24px), + 5: var(--base-size-32, 32px), + 6: var(--base-size-40, 40px), +) !default; + +@each $scale, $size in $spacer-map-rem { + .gap-#{$scale} { gap: $size !important; } + .row-gap-#{$scale} { row-gap: $size !important; } + .column-gap-#{$scale} { column-gap: $size !important; } +} diff --git a/frontend/src/global_styles/openproject/_index.sass b/frontend/src/global_styles/openproject/_index.sass index 85db8b17cf31..c689b5d4bcf3 100644 --- a/frontend/src/global_styles/openproject/_index.sass +++ b/frontend/src/global_styles/openproject/_index.sass @@ -7,6 +7,7 @@ @import generic @import base @import forms +@import gap @import mixins @import onboarding