Sudden change in UI visuals on components on the POS

Extensions
1

So I am working on a POS extension app. Yesterday everything looked like it’s supposed to (like the screenshots in the POS documentation). This morning some UI changed a little bit.

For example the section component with a header, the header had a separator and some padding under but now it’s flush with the content without a separator. Also secondary buttons had a blue text, now it’s white.

So this morning it looks like that:

image
image1179×449 78.9 KB

I wish I had a screenshot of what it looked like yesterday. But here’s what the section component should look like according to the doc (which is what I was seeing yesterday):

image
image1296×1200 63.6 KB

And for secondary buttons:

image
image1296×1200 17.6 KB

I do think the secondary buttons look better with the white text, but it’s hard to make UI decisions if things just suddenly changes :sweat_smile:

For reference this is a simplified version of the code:

 <s-section heading={i18n.translate('list_filters_heading')}>
    <s-stack direction="inline" gap="small">
      <s-button variant="secondary" onClick={handleClick}>
        My button
      </s-button>
    </s-stack>
  </s-section>
2

@Tommy_Gaudreau did you recently update POS to 11+? Because there is a significant UI change, but that’s the whole platform, not extensions specifically

3

Hey @JS_Goupil I was already on POS 11 latest version, I started working on the extension not long after its release. Yesterday it all looked normal, this morning it looks different.

I don’t think there’s been an update since yesterday so I’m suspecting it’s more a bug than an actual change (it would also feel like a bad UI choice to remove padding under the heading in the section component).

I’ll try completely uninstalling the app and see if it comes back to normal.

4

Ok so I completely uninstalled the app, but the “issue” is still there. I’m unsure if this is an actual UI change or not. I could add a separator myself under the heading, but then it will look weird if it suddenly comes back again :sweat_smile: