Update button

[abdul99ahad]

Closes #4407

Proposed Changes

Clicking Learn what's new will open modal with release changes

Clicking Update Now will take you to downloads page.

Note: Release notes are not visible because the update behavior is being mocked.

Checklist

To ensure you provided everything we need to look at your PR:

• Brief textual description of the changes present
• Visual demo attached
• Steps to try out present, i.e. using the @bpmn-io/sr tool
• Related issue linked via Closes {LINK_TO_ISSUE} or Related to {LINK_TO_ISSUE}

[nikku]

What is the reason for this change? It moves buttons around (on the status bar).

[abdul99ahad]

To accomodate the new Update button

[lmbateman]

Visually it looks fine to me. Two minor points on the text:

• The button says "Update", but the popup says "Upgrade". We should use the same word everywhere. If there's a difference between "update" and "upgrade", we should use the appropriate word (which I suspect is "update").
• The Camunda style guide specifies sentence case, so in the popup, "Update Now" should be "Update now".

Thanks!

[philippfromme]

Why are we using inline styles here?

[abdul99ahad]

The footer element styles are inline (talking about Saved button and 💚 icon). I tried creating .less file to add styles initially, but it wasn't working so by looking at the reference buttons, I assumed it's not supposed to work this way. If we can eliminate the inline styles and use separate files for styles in Fill component, then we have to do it across all elements for consistency.

[philippfromme]

We could simply add a btn--primary class to StatusBar.less and use it for the button.

[abdul99ahad]

Updated. added a different class for Update button on StatusBar.less

[abdul99ahad]

Ready for review

[philippfromme]

Mac is finally passing. Will do the final review now.

[philippfromme]

I did a couple of small adjustments:

• simplified CSS
• adjusted naming for clarity
• fixed whitespace