Sticky Header style options

Service: Hoop.la

Hi there!

Since the recent major update, I noticed theres's this new 'Sticky Header' added to topic pages. Seen under the top navigation as well as at the top of the page after scrolling down. (see screen snaps below)

I can't find where to style it, unless I'm missing something obvious. I could do it by custom CSS, but since it breaks dark themes I believe that at least its colors should be selectable from the theme editor.

Thanks in advance!

Schermafbeelding 2019-05-08 om 23.29.05Schermafbeelding 2019-05-08 om 23.29.40

Attachments

Photos (2)
Original Post

Marked As Best Solution

Good news!

We've just rolled out an update that solves this problem. The sticky header will now use the same colors set in your theme for Default Content. In addition, the sticky header will not appear at all on smaller screens.  Thus, no CSS should be required now, unless you want to change use colors other than the Default Content theme items.

Best Solution

Activity Stream

Thank you Lori! 

In the meantime I'm doing this through custom CSS. If anyone else uses a dark theme and wishes to fix it, add below code to the Custom CSS section of your Display Settings. Ideally you should change #000000 (black) to your page background color.

.forum-topic-sticky-header {
background-color: #000000;
}

.forum-topic-sticky-header.fixed {
background-color: #000000;
}

Thanks Slaz. Changing the Background color will also help the sticky header stand out from the page's background too.

Hoop:

When viewing on a small device...

The FONT SIZE of the floating bar needs adjusted for small devices. It eats up too much of the screen real estate. I tried to apply font-size but the CSS would not take.  Please give us the secret sauce to adjust the font size.

Also, the Sticky Header covers up the Hamburger Menu.  (For that reason alone I might want to turn it off.)  Hope you can fix that.

 Image-1-[1)

Attachments

Photos (1)

Good news!

We've just rolled out an update that solves this problem. The sticky header will now use the same colors set in your theme for Default Content. In addition, the sticky header will not appear at all on smaller screens.  Thus, no CSS should be required now, unless you want to change use colors other than the Default Content theme items.

Issue Resolved

This action was taken by Slaz.

Issue Reopened

This action was taken by Slaz.

Issue Resolved

This action was taken by Slaz.
To follow up on this issue, please click here.
×
×
×
×
×