Keep Brand Header static instead of scrolling?

Dev
,
1

Confirming;

After installing this, it appears as though the header scrolls off the page. Is there a way to fix the header in place above the existing discourse header?

2

I am unable to reproduce it. Can you give me a screenshot?

3

Oh, sorry for the confusion - Iā€™m asking for the intended behavior?

Locally I see the brand header scroll off the page as I scroll through a long thread.

4

Try changing the .b-header css style like below

.b-header {
  position: fixed;
}

You may require more CSS edits to achieve your goal.

2 Likes
5

Thanks Vinoth.

I found a couple of things help with this;

.b-header {
  position: fixed;
  z-index: 1001;
  height: $header-height;
}

.docked .d-header {
  margin-top: $header-height;
}

#main-outlet {
  padding-top: $discourse-content-padding + $header-height;
}

This causes the custom header to be static on scroll, and sit above the discourse header at all times.

The only disadvantage of this approach that I can see is the thread title appears in the discourse header a little later than normal, because of the additional static height of the header component.

Unsure of how to change this logic - its prolly in the bowels of discourse somewhere.

4 Likes