A discussion on the “Welcome Link Banner has extra margin” issue is ongoing. MarcP identified a margin bug caused by a specific CSS code, which adds unnecessary margin even when the welcome banner is hidden. MarcP proposed a fix by removing the margin from the .above-main-container-outlet.welcome-link-banner-connectors class and adding it to the .welcome-link-banner class.
Canapin agreed that the margin is unnecessary and suggested two solutions: removing the margin-bottom or adding display: none; when the welcome banner is not displayed. Canapin also provided examples of how the margin can interfere with other theme components.
awesomerobot explained that the margin is necessary in some cases where the banner is immediately above another banner or alert. However, they relocated the margin to prevent issues when the component is hidden, and a pull request (https://github.com/discourse/discourse-welcome-link-banner/pull/8) has been made to address the issue.
I can not see this issue on meta, but on my instance, this is caused by this CSS code:
The code is there to add some margin between top buttons and the welcome banner, but it’s also enforcing the margin on places where it should not be, the margin also stays enabled even if the welcome banner is hidden, for example, because of staff or trust level.
EDIT: sloppy fix?
Remove the margin from this class:
Either remove the margin-bottom from the Welcome Banner component if it has no use or add a display: none; on the Welcome Banner when the requirements for it to be displayed are not met.
Thanks for letting me know! There are some cases where the banner is immediately above another banner or alert, which is why it needs the margin. I was able to relocate the margin to remove the impact when the component is hidden.
