Fixes broken variables layout with triggered pipeline

What does this MR do and why?

The trigger block layout was somehow broken after this MR !53151 (merged) where the layout was not viewable or scrollable.

Not sure what introduced it maybe the removal of some upstream CSS changes I noticed in a commit

This MR fixes this by not relying on upstream CSS and applying the CSS directly in the component. And moves back to the way the original UX looked.

Screenshots or screen recordings

before	after

How to set up and validate locally

Numbered steps to set up and validate the change are strongly suggested.

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.

Related to #325927 (closed)