Fix changelog view for multiline commit messages with Jira links

[kumadee]

• fixes Multiline changelog message with Jira links is scrambled after upgrade to 5.10.0 #3944
• additionally updated the margin-left attribute as some text was shown beyond the margin line.

Testing done

Grid display style assumes that the changelog message data is displayed in a grid with 3 columns. This assumption does not work properly when there are multiple anchor links on the same commit message line.
Hence, I updated the stylesheet and went for block display style instead.
There are automated tests for this and I tested it locally on my browser by directly updating the stylesheet as shown in the below screenshots.

Before:

After:

Submitter checklist

• Make sure you are opening from a topic/feature/bugfix branch (right side) and not your main branch!
• Ensure that the pull request title represents the desired changelog entry
• Please describe what you did
• Link to relevant issues in GitHub or Jira
• Link to relevant pull requests, esp. upstream and downstream changes
• Ensure you have provided tests that demonstrate the feature works or the issue is fixed

[MarkEWaite]

I'd like a review from @janfaracik. He's much more capable in UI changes than I am.

I've confirmed that the proposed change improves the layout in my tests.

[janfaracik]

I can't seem to reproduce the Jira annotations - could you provide some more info?

Heads up that this PR breaks non-Jira changes:

[kumadee]

@janfaracik You need to ensure that there is a jira ticket number mentioned in your git commit message. And you need to ensure Jira plugin is installed and it is configured with a jira site. See Reproduction steps at #3944

Few examples of the commit messages.

# Multiple Jira tickets on a single line
git commit -m "JENKINS-1234, JENKINS-456, JENKINS-000, JENKINS-111: fixes multiple jira issues"

# Multiple lines of a commit message mentioning tickets
git commit --allow-empty --amend --only -m "JENKINS-1234: multiline commit msg render in Jenkins changelog" -m "* JENKINS-1234: This is a long commit
msg to see how jenkins render
it in the changelog. This msg is without any special
Jira ticket number which creates autolinks in github & Jenkins.

* JENKINS-1234: This is a simple msg which should be rendered without
any issue.
But lets see how it goes."

[janfaracik]

@janfaracik You need to ensure that there is a jira ticket number mentioned in your git commit message. And you need to ensure Jira plugin is installed and it is configured with a jira site. See Reproduction steps at #3944

I've tried that - here's my config

Not seeing annotations though.

[MarkEWaite]

@janfaracik the issue regex and more details are included in the zip file that I attached to the related issue. My apologies that I didn't point you to the duplication details that are inside the issue report. Refer to my #3944 (comment)

[kumadee]

@janfaracik You need to ensure that there is a jira ticket number mentioned in your git commit message. And you need to ensure Jira plugin is installed and it is configured with a jira site. See Reproduction steps at #3944

I've tried that - here's my config

Not seeing annotations though.

@janfaracik Maybe I am missing something to see in your screenshot, but I don't see any Jira ticket numbers mentioned in your git commit message. I also gave 2 examples of the git commit messages with which you can try to replicate.