Remove several usages of `.gl-xs-w-full` utility
What does this MR do and why?
Remove several usages of .gl-xs-w-full
utility
This removes some usages of the desktop-first
.gl-xs-w-full
utility. We are replacing them with mobile-first utils
combinations. Some necessary utils were not yet part of GitLab UI, those
have been added to a temporary stylesheet that will be migrated to
GitLab UI in a follow-up.
Screenshots or screen recordings
Note: Only some screenshots and repro steps are provided. In some cases, I wasn't sure how to actually access the affected views. Considering that the fix is essentially the same in all cases, I did not put much effort into smoke-testing every single area so that I can move quickly towards getting rid of the (to-be) deprecated CSS util.
How to set up and validate locally
-
app/assets/javascripts/issues/list/components/issues_list_app.vue
- Enable the
issues_list_drawer
feature flag:echo "Feature.enable(:issues_list_drawer) | rails c"
. - Navigate to a project's issues list and click on some issue.
- Enable the
-
app/views/clusters/clusters/new_cluster_docs.html.haml
- Navigate to
:project > Operate > Kubernetes Clusters > Create a cluster
.
- Navigate to
-
app/views/invites/decline.html.haml
- N/A
-
app/views/layouts/devise.html.haml
- Access the sign-in form.
-
ee/app/assets/javascripts/analytics/analytics_dashboards/components/analytics_visualization_designer.vue
- N/A
-
ee/app/assets/javascripts/analytics/repository_analytics/components/download_test_coverage.vue
- Navigate to a project's Repo Analytics. This URL should work: http://gdk.test:3000/groups/flightjs/-/analytics/repository_analytics.
-
ee/app/assets/javascripts/analytics/repository_analytics/components/test_coverage_table.vue
- Same as above.
-
ee/app/assets/javascripts/escalation_policies/components/add_edit_escalation_policy_form.vue
- Create an escalation policy. This URL should work: http://gdk.test:3000/flightjs/Flight/-/escalation_policies.
-
ee/app/assets/javascripts/oncall_schedules/components/rotations/components/add_edit_rotation_form.vue
- Create an on-call schedule, then add a rotation to it. Try this URL: http://gdk.test:3000/flightjs/Flight/-/oncall_schedules.
-
ee/app/assets/javascripts/trials/components/trial_create_lead_form.vue
- N/A
-
ee/app/assets/javascripts/usage_quotas/seats/components/remove_billable_member_modal.vue
- Navigate to
Admin Area > Settings > Usage Quotas
and click onRemove user
.
- Navigate to
-
ee/app/assets/javascripts/vue_shared/components/customizable_dashboard/customizable_dashboard.vue
- N/A
-
ee/app/assets/javascripts/vue_shared/components/customizable_dashboard/filters/date_range_filter.vue
- N/A
-
ee/app/views/registrations/groups/new.html.haml
- N/A
MR acceptance checklist
This checklist encourages us to confirm any changes have been analyzed to reduce risks in quality, performance, reliability, security, and maintainability.
-
I have evaluated the MR acceptance checklist for this MR.