Notification stack not responsive?

Hi All,

I am finding that the Foundry notification stack displays on all devices regardless of whether I change the Responsive settings for it in the Stacks HUD e.g. Hide on tablet and desktop but display on mobile.

This happens both in a work project and if I create a new blank project with just the Foundry stack, a paragraph stack and a Notifications stack.

To Reproduce This:

  1. Open a new RW project.

  2. Drag in a Foundry setup stack, a paragraph stack (for visual reference) and a notifications stack.

  3. Change the settings under the responsive section of the Stacks HUD for the notifications stack to show only on mobile but hide on tablet and desktop.

  4. View the page using the different preview options

The notifications stack is displayed regardless of which preview setting (i.e. Full view, tablet or mobile) is used.

Expected behaviour:
The stack should display on mobile but not tablet or desktop view.

I can also reproduce this if I use the Foundry visibility stack as a container for the notification stack and change the responsive settings for that stack.

Can anyone else reproduce this? Or am I misunderstanding something about how the notifications stack works?


@Beemerang The notification gets pulled out of the parent stack(s) and positioned at the top of the site’s <body> to ensure it is on top of other elements and other stacks z-index can’t thwart it (at least not easily). This means the stack’s wrapper that you’re using to hide it at. Arduous breakpoints cannot do so because it is not inside of those parent stacks.

1 Like

Ah ok, thanks for explaining this to me @elixirgraphics. Do you have any other approach up your sleeve that I could use to display a notification only on mobile?

Also noticed that the style selections (Success, Info, Danger) don’t match the Foundry brand colors being used for the project and not sure where to change them.

Sorry, should have read the documentation first.

No, sorry, there isn’t a way to do that.