Merge branch 'ps-fix-new-project-margin' into 'master'

Fix top margin in "new project"

See merge request gitlab-org/gitlab!47109

app/assets/stylesheets/utilities.scss

@@ -122,3 +122,10 @@
     margin-left: $gl-spacing-scale-3;
   }
 }
+
+// This is used to help prevent issues with margin collapsing.
+// See https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Box_Model/Mastering_margin_collapsing.
+.gl-force-block-formatting-context::after {
+  content: '';
+  display: flex;
+}

app/views/layouts/_page.html.haml

@@ -4,7 +4,7 @@
   .content-wrapper{ class: "#{@content_wrapper_class}" }
     .mobile-overlay
     = yield :group_invite_members_banner
-    .alert-wrapper
+    .alert-wrapper.gl-force-block-formatting-context
       = render 'shared/outdated_browser'
       = render_if_exists "layouts/header/licensed_user_count_threshold"
       = render_if_exists "layouts/header/token_expiry_notification"

app/views/projects/new.html.haml

@@ -4,7 +4,7 @@
 - header_title  _("Projects"), dashboard_projects_path
 - active_tab = local_assigns.fetch(:active_tab, 'blank')
 
-.project-edit-container.gl-mt-3
+.project-edit-container.gl-mt-5
   .project-edit-errors
     = render 'projects/errors'
 

changelogs/unreleased/ps-fix-new-project-margin.yml

+---
+title: Fix top margin in new project page
+merge_request: 47109
+author:
+type: fixed