Migrate `gl-reset-line-height` to Tailwind

What does this MR do and why?

Migrate gl-reset-line-height to Tailwind

Migrates the gl-reset-line-height CSS util to its Tailwind equivalent configured as gl-leading-reset.

MR acceptance checklist

Please evaluate this MR against the MR acceptance checklist. It helps you analyze changes to reduce risks in quality, performance, reliability, security, and maintainability.

Screenshots or screen recordings

Before	After

CSS-in-Js diff

diff --git a/config/helpers/tailwind/css_in_js.js b/config/helpers/tailwind/css_in_js.js
index f4f758ebfdeb..6be3eed8d832 100644
--- a/config/helpers/tailwind/css_in_js.js
+++ b/config/helpers/tailwind/css_in_js.js
@@ -1,5 +1,5 @@
 /**
- * The following 574 definitions need to be migrated to Tailwind.
+ * The following 573 definitions need to be migrated to Tailwind.
  * Let's do this! 🚀
  */
 module.exports = {
@@ -726,7 +726,6 @@ module.exports = {
   '.line-height-32': { 'line-height': '2rem' },
   '.line-height-36': { 'line-height': '2.25rem' },
   '.line-height-42': { 'line-height': '2.625rem' },
-  '.reset-line-height': { 'line-height': 'inherit' },
   '.vertical-align-top': { 'vertical-align': 'top' },
   '.vertical-align-bottom': { 'vertical-align': 'bottom' },
   '.vertical-align-text-bottom': { 'vertical-align': 'text-bottom' },

Related to #456618 (closed)

changed milestone to %17.1

added automation:ml devopsmanage frontend groupdesign system maintenancerefactor sectioncore platform typemaintenance workflowin dev labels

assigned to @pgascouvaillancourt

changed the description

added pipelinetier-1 label

@lorenzvanherwaarden since you are working on #456642 (closed), would you mind reviewing this one please? As part of #456642 (closed), I suppose we might want to extend the default preset with more values, or even override it altogether if none of Tailwind's defaults are relevant to us

requested review from @lorenzvanherwaarden

added backend label

	1 Warning
	The master pipeline status page reported failures in rspec-ee system pg14 3/14 If these jobs fail in your merge request with the same errors, then they are not caused by your changes. Please check for any on-going incidents in the incident issue tracker or in the #master-broken Slack channel.

	1 Message
	This merge request includes changes to Vue files that have both CE and EE versions.

Vue <template> in CE and EE

Some Vue files in CE have a counterpart in EE. (For example, path/to/file.vue and ee/path/to/file.vue.)

When run in the context of CE, the <template> of the CE Vue file is used. When run in the context of EE, the <template> of the EE Vue file is used.

It's easy to accidentally make a change to a CE <template> that should appear in both CE and EE without making the change in both places. When this happens, the change only takes effect in CE.

The following Vue files were changed as part of this merge request that include both a CE and EE version of the file:

• app/assets/javascripts/issues/list/components/issues_list_app.vue

If you made a change to the <template> of any of these Vue files that should be visible in both CE and EE, please ensure you have made your change to both versions of the file.

A better alternative

An even better alternative is to refactor this component to only use a single template for both CE and EE. More info on this approach here: https://docs.gitlab.com/ee/development/ee_features.html#template-tag

Reviewer roulette

Category	Reviewer	Maintainer
backend	@hmehra (UTC+10, 8 hours ahead of author)	@reprazent (UTC+2, same timezone as author)
frontend	@vvempati (UTC+12, 10 hours ahead of author)	@tristan.read (UTC+2, same timezone as author)

Please check reviewer's status!

• Reviewer is available!
• Reviewer is unavailable!

Please refer to documentation page for guidance on how you can benefit from the Reviewer Roulette, or use the GitLab Review Workload Dashboard to find other available reviewers.

Tailwind CSS

Legacy utils

The following files contain legacy utils:

• app/assets/javascripts/issues/list/components/issues_list_app.vue
  • gl-sm-w-40p
• app/assets/javascripts/search/sidebar/components/app.vue
  • gl-font-sm
  • gl-font-weight-bold
• app/assets/javascripts/super_sidebar/components/super_sidebar.vue
  • gl-font-sm
  • gl-font-weight-bold
• app/assets/javascripts/whats_new/components/app.vue
  • gl-focus--focus
• app/views/projects/_sidebar.html.haml
  • gl-font-base
  • gl-font-weight-bold

Use the Tailwind documentation to find the Tailwind equivalent to these legacy utils. If the Tailwind equivalent is not available it is okay to use the legacy util for now. The Tailwind equivalent will be made available when the corresponding migration issue in &13521 (closed) is completed.

If needed, you can retry the danger-review job that generated this comment.

Generated by Danger

mentioned in issue #456618 (closed)

Bundle size analysis [beta]

This compares changes in bundle size for entry points between the commits 543cdb91 and 69bde3a6

Special assets

Entrypoint / Name	Size before	Size after	Diff	Diff in percent
average	4.3 MB	4.3 MB	-	-0.0 %
mainChunk	3.3 MB	3.3 MB	-	0.0 %

Significant Reduction: 4

Expand

Entrypoint / Name	Size before	Size after	Diff	Diff in percent
pages.groups.saml_group_links	318.67 KB	271.44 KB	-47.24 KB	-14.8 %
pages.projects.learn_gitlab.show	624.51 KB	577.28 KB	-47.24 KB	-7.6 %
pages.groups.saml_providers	509.97 KB	463.91 KB	-46.06 KB	-9.0 %
pages.groups.saml_providers.saml_members.store	509.98 KB	463.92 KB	-46.06 KB	-9.0 %

---

Note: We do not have exact data for 543cdb91. So we have used data from: 12e3c54d.
The target commit was too new, so we used the latest commit from master we have info on.
It might help to rerun the bundle-size-review job
This might mean that you have a few false positives in this report. If something unrelated to your code changes is reported, you can check this comparison in order to see if they caused this change.

Please look at the full report for more details

---

Read more about how this report works.

Generated by Danger

added 1 commit

• 074b18e8 - Migrate `gl-reset-line-height` to Tailwind

Compare with previous version

approved this merge request

added pipeline:mr-approved label

@lorenzvanherwaarden, thanks for approving this merge request.

This is the first time the merge request has been approved. To ensure we don't only run predictive pipelines, and we don't break master, a new pipeline will be started shortly.

Please wait for the pipeline to start before resolving this discussion and set auto-merge for the new pipeline. See merging a merge request for more details.

added pipelinetier-3 label and removed pipelinetier-1 label

E2E Test Result Summary

allure-report-publisher generated test report!

e2e-test-on-gdk: test report for 69bde3a6

expand test summary

+------------------------------------------------------------------+
|                          suites summary                          |
+-------------+--------+--------+---------+-------+-------+--------+
|             | passed | failed | skipped | flaky | total | result |
+-------------+--------+--------+---------+-------+-------+--------+
| Plan        | 54     | 0      | 2       | 47    | 56    | ✅     |
| Create      | 120    | 0      | 10      | 93    | 130   | ✅     |
| Package     | 19     | 0      | 12      | 19    | 31    | ✅     |
| Govern      | 64     | 0      | 1       | 41    | 65    | ✅     |
| Verify      | 31     | 0      | 1       | 30    | 32    | ✅     |
| Data Stores | 31     | 0      | 0       | 22    | 31    | ✅     |
| Release     | 5      | 0      | 0       | 5     | 5     | ✅     |
| Monitor     | 8      | 0      | 0       | 7     | 8     | ✅     |
| Analytics   | 1      | 0      | 1       | 0     | 2     | ✅     |
| Manage      | 0      | 0      | 1       | 0     | 1     | ➖     |
+-------------+--------+--------+---------+-------+-------+--------+
| Total       | 333    | 0      | 28      | 264   | 361   | ✅     |
+-------------+--------+--------+---------+-------+-------+--------+

e2e-package-and-test: test report for 69bde3a6

expand test summary

+------------------------------------------------------------------+
|                          suites summary                          |
+-------------+--------+--------+---------+-------+-------+--------+
|             | passed | failed | skipped | flaky | total | result |
+-------------+--------+--------+---------+-------+-------+--------+
| Manage      | 30     | 2      | 8       | 2     | 40    | ❌     |
| Create      | 318    | 0      | 41      | 6     | 359   | ✅     |
| Data Stores | 22     | 0      | 0       | 0     | 22    | ✅     |
| Govern      | 26     | 0      | 0       | 0     | 26    | ✅     |
| Monitor     | 8      | 0      | 0       | 0     | 8     | ✅     |
| Release     | 2      | 0      | 0       | 0     | 2     | ✅     |
| Package     | 6      | 0      | 8       | 0     | 14    | ✅     |
| Plan        | 44     | 0      | 4       | 0     | 48    | ✅     |
| Verify      | 10     | 0      | 0       | 0     | 10    | ✅     |
+-------------+--------+--------+---------+-------+-------+--------+
| Total       | 466    | 2      | 61      | 8     | 529   | ❌     |
+-------------+--------+--------+---------+-------+-------+--------+

resolved all threads

enabled an automatic merge when the pipeline for 5d281e02 succeeds

mentioned in incident gitlab-org/quality/engineering-productivity/approved-mr-pipeline-incidents#294 (closed)

aborted the automatic merge because source branch was updated

added 588 commits

• 074b18e8...16e9f2c5 - 587 commits from branch master
• 69bde3a6 - Migrate `gl-reset-line-height` to Tailwind

Compare with previous version

reset approvals from @lorenzvanherwaarden by pushing to the branch

approved this merge request

enabled an automatic merge when the pipeline for 7af95721 succeeds

merged

@lorenzvanherwaarden, did you forget to run a pipeline before you merged this work? Based on our code review process, if the latest pipeline was created more than 4 hours ago, you should:

1. Ensure the merge request is not in Draft status.
2. Start a pipeline (especially important for Community contribution merge requests).
3. Set the merge request to auto-merge.

This is a guideline, not a rule. Please consider replying to this comment for transparency.

This message was generated automatically. You're welcome to improve it.

mentioned in commit bccb32e1

mentioned in incident gitlab-org/quality/engineering-productivity/master-broken-incidents#6508 (closed)

resolved all threads

added workflowstaging-canary label and removed workflowin dev label

added workflowcanary label and removed workflowstaging-canary label

added workflowstaging label and removed workflowcanary label

added workflowproduction label and removed workflowstaging label

added releasedcandidate label

added Category:Design System label

added releasedpublished label and removed releasedcandidate label