Calculate line-height to control total flag height

[jkaltoft]

Fixes #1904

Which issue does this PR close?

This PR closes # (insert issue number here)

What is the new behavior?

The intrinsic height of a Flag (or any element) is defined by its font-size, vertical padding, border width and line height. By calculating the line-height we can control the total height of a Flag and make it match a defined target height.

Does this PR introduce a breaking change?

• Yes
• No

Are there any additional context?

The difference is subtle but here it is:

Before

After

Checklist:

The following tasks should be carried out in sequence in order to follow the process of contributing correctly.

Reminders

• Make sure you have implemented tests following the guidelines in: "The good: Test".
• Make sure you have updated the cookbook with examples and showcases (for bug fixes, enhancements & new components).

Review

• Do a self-review.
• Request that the changes are code-reviewed
• Request that the changes are UX reviewed (only necessary if your PR introduces visual changes)

When the pull request has been approved it will be merged to develop by Team Kirby.