Update appearance of editor

[janfaracik]

This PR sets out to update the appearance of the pipeline editor, updating it to the Jenkins variables (such as the color palette, fonts) for consistency and making it a little larger too.

Before

After

Key changes

• Use Jenkins color palette
• Increase height from 250px to 350px
• Use system monospace font
• Icons and animations updated

Testing done

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 demonstrates feature works or fixes the issue

[daniel-beck]

I expect that nobody will find the new link location in the description. Could it be made more visible?

[jtnord]

where has the help icon gone?
before:

after:

[jtnord]

whilst this was not the best help - it did at least prompt users where to look?

[janfaracik]

Restored it.

[jtnord]

Code change look one to me. Have not run the pr in any circumstances context (proprietary or other.)
ATH appears to be unaffected.

Will wait to give @daniel-beck a chance to rereview

[daniel-beck]

Seems fine with the link restored.

The tiny resize handle seems like quite a step back though from the nonstandard resize line at the bottom though, hitting that is fairly difficult. It seems about a quarter of the size of a normal textarea's (e.g., cron) resize handle?

Additionally there's a 1px area in the border where I can click on the control and get the new highlight/focus animation, but it's not focused afterwards. Regular textareas don't have that (nit, obviously).

[janfaracik]

Seems fine with the link restored.

The tiny resize handle seems like quite a step back though from the nonstandard resize line at the bottom though, hitting that is fairly difficult. It seems about a quarter of the size of a normal textarea's (e.g., cron) resize handle?

Additionally there's a 1px area in the border where I can click on the control and get the new highlight/focus animation, but it's not focused afterwards. Regular textareas don't have that (nit, obviously).

Thanks! Fixed the resize handle, it was a little too inset for some reason. Couldn't find a simple fix for the 1px issue however :/

[daniel-beck]

Resize handle size is a lot better now, thanks for iterating there. The 1px issue was a nit anyway so no big deal.

[daniel-beck]

(Not a maintainer, just org owner.)