Migrate project repository settings to container queries
What does this MR do and why?
Note: some styles are not migrated yet
The targeted page contains many tables that are not yet updated to use container queries. These will not be resolved until https://gitlab.com/gitlab-org/gitlab-services/design.gitlab.com/-/issues/2983+ is resolved.
Migrate project settings to container queries
Files checked during this migration:
/app/assets/javascripts/deploy_keys/components/action_btn.vue
/app/assets/javascripts/deploy_keys/components/app.vue
/app/assets/javascripts/deploy_keys/components/confirm_modal.vue
/app/assets/javascripts/deploy_keys/components/key.vue
/app/assets/javascripts/deploy_keys/components/keys_panel.vue
/app/assets/javascripts/deploy_keys/index.js
/app/assets/javascripts/deploy_tokens/components/new_deploy_token.vue
/app/assets/javascripts/deploy_tokens/components/revoke_button.vue
/app/assets/javascripts/deploy_tokens/index.js
/app/assets/javascripts/deploy_tokens/init_revoke_button.js
/app/assets/javascripts/mirrors/mirror_repos.js
/app/assets/javascripts/mirrors/ssh_mirror.js
/app/assets/javascripts/pages/projects/settings/branch_rules/index.js
/app/assets/javascripts/pages/projects/settings/repository/show/index.js
/app/assets/javascripts/persistent_user_callouts.js
/app/assets/javascripts/projects/settings/branch_rules/components/view/index.vue
/app/assets/javascripts/projects/settings/branch_rules/mount_branch_rules.js
/app/assets/javascripts/projects/settings/components/default_branch_selector.vue
/app/assets/javascripts/projects/settings/mount_default_branch_selector.js
/app/assets/javascripts/projects/settings/repository/branch_rules/app.vue
/app/assets/javascripts/projects/settings/repository/branch_rules/mount_branch_rules.js
/app/assets/javascripts/projects/settings/repository/maintenance/mount_repository_maintenance.js
/app/assets/javascripts/protected_branches/protected_branch_create.js
/app/assets/javascripts/protected_branches/protected_branch_edit.js
/app/assets/javascripts/protected_tags/protected_tag_create.js
/app/assets/javascripts/protected_tags/protected_tag_edit.vue
/app/views/projects/branch_defaults/_branch_names_fields.html.haml
/app/views/projects/branch_defaults/_default_branch_fields.html.haml
/app/views/projects/branch_defaults/_show.html.haml
/app/views/projects/branch_rules/_show.html.haml
/app/views/projects/mirrors/_authentication_method.html.haml
/app/views/projects/mirrors/_branch_filter.html.haml
/app/views/projects/mirrors/_disabled_mirror_badge.html.haml
/app/views/projects/mirrors/_instructions.html.haml
/app/views/projects/mirrors/_mirror_repos_form.html.haml
/app/views/projects/mirrors/_mirror_repos_list.html.haml
/app/views/projects/mirrors/_mirror_repos_push.html.haml
/app/views/projects/mirrors/_mirror_repos.html.haml
/app/views/projects/mirrors/_ssh_host_keys.html.haml
/app/views/projects/protected_tags/_create_protected_tag.html.haml
/app/views/projects/protected_tags/_index.html.haml
/app/views/projects/protected_tags/shared/_create_protected_tag.html.haml
/app/views/projects/protected_tags/shared/_dropdown.html.haml
/app/views/projects/settings/_branch_rules_callout.html.haml
/app/views/projects/settings/repository/_protected_branches.html.haml
/app/views/projects/settings/repository/show.html.haml
/app/views/protected_branches/_index.html.haml
/app/views/shared/_remote_mirror_update_button.html.haml
/app/views/shared/deploy_keys/_index.html.haml
/app/views/shared/deploy_tokens/_index.html.haml
/app/views/shared/deploy_tokens/_table.html.haml
/ee/app/assets/javascripts/deploy_tokens/components/new_deploy_token.vue
/ee/app/assets/javascripts/pages/projects/settings/repository/show/ee_mirror_repos.js
/ee/app/assets/javascripts/pages/projects/settings/repository/show/index.js
/ee/app/assets/javascripts/projects/settings/branch_rules/components/view/index.vue
/ee/app/assets/javascripts/projects/settings/branch_rules/mount_branch_rules.js
/ee/app/views/projects/branch_defaults/_branch_names_help.html.haml
/ee/app/views/projects/mirrors/_branch_name_regex.html.haml
/ee/app/views/projects/mirrors/_mirror_branches_setting_badge.html.haml
/ee/app/views/projects/mirrors/_table_pull_row.html.haml
/ee/app/views/projects/push_rules/_index.html.haml
/ee/app/views/projects/settings/repository/_protected_branches.html.haml
/ee/app/views/protected_branches/ee/_branches_list.html.haml
/ee/app/views/protected_branches/ee/_create_protected_branch.html.haml
/ee/app/views/protected_branches/ee/_index.html.haml
/ee/app/views/protected_branches/ee/_protected_branch_access_summary.html.haml
/ee/app/views/protected_branches/ee/_protected_branch.html.haml
/ee/app/views/shared/promotions/_promote_repository_features.html.haml
/ee/app/views/shared/promotions/_promotion_link_project.html.haml
/ee/app/views/shared/push_rules/_commit_committer_check_setting.html.haml
/ee/app/views/shared/push_rules/_commit_committer_name_check_setting.html.haml
/ee/app/views/shared/push_rules/_form.html.haml
/ee/app/views/shared/push_rules/_reject_commits_not_dco_signed_setting.haml
/ee/app/views/shared/push_rules/_reject_unsigned_commits_setting.html.haml
References
Screenshots or screen recordings
Due to the outstanding table styles necessary to support stacked tables with container queries, there are not yet any significantly noticeable changes in appearance or behavior with these changes.
How to set up and validate locally
- Check out this branch
- Visit the "Repository settings" page for a project (e.g., http://gdk.test:3000/flightjs/Flight/-/settings/repository)
MR acceptance checklist
Evaluate this MR against the MR acceptance checklist. It helps you analyze changes to reduce risks in quality, performance, reliability, security, and maintainability.
Related to #559660
Edited by Chad Lavimoniere