1 files changed, 42 insertions, 30 deletions
diff --git a/app/views/admin/groups/_form.html.haml b/app/views/admin/groups/_form.html.haml
index 43a8d56d584..7bcc97914e5 100644
--- a/app/views/admin/groups/_form.html.haml
+++ b/app/views/admin/groups/_form.html.haml
@@ -1,40 +1,52 @@
 = gitlab_ui_form_for [:admin, @group] do |f|
   = form_errors(@group, pajamas_alert: true)
-  = render 'shared/group_form', f: f
-  = render 'shared/group_form_description', f: f
-
-  = render 'shared/admin/admin_note_form', f: f
-
-  = render_if_exists 'shared/old_repository_size_limit_setting', form: f, type: :group
-  = render_if_exists 'admin/namespace_plan', f: f
-
-  .form-group.row.group-description-holder
-    .col-sm-2.col-form-label
-      = f.label :avatar, _("Group avatar")
-    .col-sm-10
-      = render 'shared/choose_avatar_button', f: f
-
-  = render 'shared/old_visibility_level', f: f, visibility_level: visibility_level, can_change_visibility_level: can_change_group_visibility_level?(@group), form_model: @group, with_label: false
-
-  .form-group.row
-    .offset-sm-2.col-sm-10
-      = render 'shared/allow_request_access', form: f
-
-  = render 'groups/group_admin_settings', f: f
-
-  = render_if_exists 'namespaces/shared_runners_minutes_settings', group: @group, form: f
+  .gl-border-b.gl-mb-6
+    .row
+      .col-lg-4
+        %h4.gl-mt-0
+          = _('Naming, visibility')
+        %p
+          = _('Update your group name, description, avatar, and visibility.')
+          = link_to _('Learn more about groups.'), help_page_path('user/group/index')
+      .col-lg-8
+        = render 'shared/group_form', f: f
+        = render 'shared/group_form_description', f: f
+        .form-group.gl-form-group{ role: 'group' }
+          = f.label :avatar, _("Group avatar"), class: 'gl-display-block col-form-label'
+          = render 'shared/choose_avatar_button', f: f
+        = render 'shared/old_visibility_level', f: f, visibility_level: visibility_level, can_change_visibility_level: can_change_group_visibility_level?(@group), form_model: @group, with_label: false
+
+  .gl-border-b.gl-pb-3.gl-mb-6
+    .row
+      .col-lg-4
+        %h4.gl-mt-0
+          = _('Permissions and group features')
+        %p
+          = _('Configure advanced permissions, Large File Storage, two-factor authentication, and CI/CD settings.')
+      .col-lg-8
+        = render_if_exists 'shared/old_repository_size_limit_setting', form: f, type: :group
+        = render_if_exists 'admin/namespace_plan', f: f
+        .form-group.gl-form-group{ role: 'group' }
+          = render 'shared/allow_request_access', form: f
+        = render 'groups/group_admin_settings', f: f
+        = render_if_exists 'namespaces/shared_runners_minutes_settings', group: @group, form: f
+  .gl-mb-3
+    .row
+      .col-lg-4
+        %h4.gl-mt-0
+          = _('Admin notes')
+      .col-lg-8
+        = render 'shared/admin/admin_note_form', f: f
 
   - if @group.new_record?
-    .form-group.row
-      .offset-sm-2.col-sm-10
-        = render Pajamas::AlertComponent.new(dismissible: false) do |c|
-          = c.body do
-            = render 'shared/group_tips'
-    .form-actions
+    = render Pajamas::AlertComponent.new(dismissible: false) do |c|
+      = c.body do
+        = render 'shared/group_tips'
+    .gl-mt-5
       = f.submit _('Create group'), class: "gl-button btn btn-confirm"
       = link_to  _('Cancel'), admin_groups_path, class: "gl-button btn btn-default btn-cancel"
 
   - else
-    .form-actions
+    .gl-mt-5
       = f.submit _('Save changes'), class: "gl-button btn btn-confirm", data: { qa_selector: 'save_changes_button' }
       = link_to  _('Cancel'), admin_group_path(@group), class: "gl-button btn btn-cancel"