Skip to content

Convert `members.scss` into page specific bundle

📖 What does this MR do?

Related to #239850 (closed)

As part of an effort to reduce the size of our CSS bundle this MR converts members.scss into page specific bundle so it is only loaded on the pages that need it.

See description in &3694 for documentation on how to create a page specific CSS bundle.

Style check

I manually checked all styles to ensure they are only used on the pages that we added add_page_specific_style 'page_bundles/members' to.

To keep changes as small as possible all unused styles will be removed in a follow-up MR

Style Templates
.project-members-title unused
.invite-users-form app/views/shared/members/_invite_member.html.haml#L8 ->app/views/projects/project_members/index.html.haml#L44
.member app/views/shared/members/_member.html.haml#L14 -> app/views/admin/groups/show.html.haml#L133 and app/views/admin/projects/show.html.haml#L188
.member-form-control
.member-search-btn unused
.members-ldap ee/app/views/shared/members/ee/_ldap_tag.html.haml#L4 -> app/views/shared/members/_member.html.haml#L64 -> app/views/admin/groups/show.html.haml#L133 and app/views/admin/projects/show.html.haml#L188
.alert-member-ldap unused
.btn-ldap-override unused
.flex-project-members-panel unused
.card .card-header .badge.badge-pill
.content-list.members-list
.members-table app/assets/javascripts/members/components/table/members_table.vue#L99 -> app/views/groups/group_members/index.html.haml#L65 and app/views/projects/project_members/index.html.haml#L78
.card-mobile app/views/shared/members/_requests.html.haml#L9 -> app/views/admin/groups/show.html.haml#L122 and app/views/admin/projects/show.html.haml#L197

📷 Screenshots

View Before After
Project members Screen_Shot_2021-03-10_at_2.15.07_PM Screen_Shot_2021-03-10_at_1.58.25_PM
Group members Screen_Shot_2021-03-10_at_2.15.24_PM Screen_Shot_2021-03-10_at_1.58.36_PM
Admin project Screen_Shot_2021-03-10_at_2.16.51_PM Screen_Shot_2021-03-10_at_1.59.06_PM
Admin group Screen_Shot_2021-03-10_at_2.15.42_PM Screen_Shot_2021-03-10_at_1.59.22_PM

🚦 Does this MR meet the acceptance criteria?

Conformity

Availability and Testing

Security

If this MR contains changes to processing or storing of credentials or tokens, authorization and authentication methods and other items described in the security review guidelines:

  • [-] Label as security and @ mention @gitlab-com/gl-security/appsec
  • [-] The MR includes necessary changes to maintain consistency between UI, API, email, or other methods
  • [-] Security reports checked/validated by a reviewer from the AppSec team
Edited by Peter Hegman

Merge request reports

Loading