When using .topbar-xx-wide without a nested <nav>-tag, it centers the logo

[erikhallaraaker]

Describe the bug

When using topbar-lg-wide on the topbar component without a .topbar-nav, the logo centers regardless of window size.

To Reproduce
Use the following code to add the topbar:

Code:

<header class="topbar topbar-lg-wide">
    <a class="topbar-logo" href="/">
        <img src="https://design.swedbankpay.com/v/3.4.2/img/spay_horizontal_pos.svg" alt="swedbankpay-logo" />
    </a>
</header>

Expected behavior

Expected the logo to behave like it does when the <nav> is present as a sibling.
E.g. center when the screen is smaller the the threshold, otherwise stay to the left.

Actual behavior

The logo centers on the topbar regardless of screensize.

Possible fix

This is the result of the .topbar rule justify-content: center;, and it can be fixed by adding .justify-content-start to the .topbar when you don't have a <nav> child.
Seeing as this is probably an edge-case I'm not sure if this should be accounted for.

[PhungNg]

After some discussion with the designer, it is decided that the logo should be centered when there is no navigation presented in the topbar. Issue closed! 🔨