render extra person profile tabs after about instead of at the end

Author: rsmithlal

app/views/better_together/people/show.html.erb

@@ -52,10 +52,10 @@
         <%# Initialize the active tab state with accessible attributes %>
         <%= content_tag :div, id: 'profileTabs', class: 'nav nav-tabs card-header-tabs', role: 'tablist', aria_label: 'Profile Sections' do %>
           <%= link_to t('globals.tabs.about'), '#about', class: 'nav-link active', id: 'about-tab', data: { bs_toggle: 'tab', bs_target: '#about' }, role: 'tab', aria_controls: 'about', aria_selected: 'true', tabindex: '0' %>
+          <%= render partial: 'better_together/people/extra_person_tabs', locals: { person: @person } %>
           <%= link_to BetterTogether::Platform.model_name.human.pluralize, '#platforms', class: 'nav-link', id: 'platforms-tab', data: { bs_toggle: 'tab', bs_target: '#platforms' }, role: 'tab', aria_controls: 'platforms', aria_selected: 'false', tabindex: '-1' if @person.person_platform_memberships.exists? %>
           <%= link_to BetterTogether::Community.model_name.human.pluralize, '#communities', class: 'nav-link', id: 'communities-tab', data: { bs_toggle: 'tab', bs_target: '#communities' }, role: 'tab', aria_controls: 'communities', aria_selected: 'false', tabindex: '-1' if @person.person_community_memberships.exists? %>
           <%= link_to BetterTogether::ResourcePermission.model_name.human.pluralize, '#permissions', class: 'nav-link', id: 'permissions-tab', data: { bs_toggle: 'tab', bs_target: '#permissions' }, role: 'tab', aria_controls: 'permissions', aria_selected: 'false', tabindex: '-1' if @person.resource_permissions.exists? && (current_person == @person || current_person.permitted_to?('manage_platform')) %>
-          <%= render partial: 'better_together/people/extra_person_tabs', locals: { person: @person } %>
         <% end %>
       </div>
 
@@ -65,7 +65,7 @@
         <section id="about" class="row collapse show" aria-labelledby="about-tab" aria-expanded="true">
           <div class="col-md-12">
             <!-- Name Section -->
-            <h2 class="card-title text-center mb-3">
+            <h2 class="card-title profile-name text-center mb-3">
               <%= @person.name %>
             </h2>
             <!-- Divider Line -->
@@ -82,6 +82,8 @@
           </div>
         </section>
 
+        <%= render partial: 'better_together/people/extra_person_tab_contents', locals: { person: @person } %>
+
         <% if @person.person_platform_memberships.exists? %>
           <div id="platforms" class="row row-cols-1 row-cols-md-2 row-cols-lg-3 row-cols-xl-4 collapse" aria-labelledby="platforms-tab" aria-expanded="true">
             <%= render partial: 'better_together/person_platform_memberships/person_platform_membership', collection: @person.person_platform_memberships %>
@@ -96,20 +98,18 @@
 
         <% if @person.role_resource_permissions.exists? %>
           <div id="permissions" class="row row-cols-1 row-cols-md-2 row-cols-lg-3 row-cols-xl-4 collapse" aria-labelledby="permissions-tab" aria-expanded="false">
-            <% @person.role_resource_permissions.each do |role_resource_permission| %>
-              <div class="col role-resource-permission-column">
-                <div class="card shadow-sm border-0 my-3">
+            <% @person.role_resource_permissions.order(role_id: :asc).each do |role_resource_permission| %>
+              <div class="col mb-3 role-resource-permission-column">
+                <div class="card shadow-sm border-0 my-3 h-100">
                   <div class="card-body">
-                    <h5 class="card-title"><%= role_resource_permission.resource_permission.identifier %></h5>
+                    <h6 class="card-title"><%= role_resource_permission.resource_permission.identifier %></h6>
                     <p class="card-text">Role: <%= role_resource_permission.role.name %></p>
                   </div>
                 </div>
               </div>
             <% end %>
           </div>
         <% end %>
-
-        <%= render partial: 'better_together/people/extra_person_tab_contents', locals: { person: @person } %>
       </div>
     </section>
   </div>