Erase Info Bar but keep Current user

A big fight happening with this one… :sweat_smile:

the code I had but in movil screen included a big space a the top for the empty info bar.

div.kn-current_user { margin-top: -55px; margin-left: 800px; }
.kn-info-bar { font-size: 11.5px; visibility: on ; }
.kn-current-user-intro, .kn-back-link { display: none; }

I want to KEEP the current user info and ELIMINATE the Info Bar.

.kn-info-bar .kn-container{ display: none; }
That does not work cose it ALSO eliminate the current user info.

The best way at this time is to make the bar 0 height:
.kn-info-bar .kn-container{ height: 0px; }

If somebody solve this trick please tell!

@MichaelG, why not just hide the crumbtrail and user intro, and colour the info bar the same as the page background?:

.kn-crumbtrail,
.kn-current-user-intro {
  visibility: hidden;
}

.kn-info-bar {
  background-color: #fff;
}

image

1 Like

Hi @StephenChapman ,

Indeed. But I am sorry I forgot the context of the problem:
on a mobile screen, the crumb block was taking a lot of space at the top (which does not on PC screen).

In this screenshot it is with height 0px.
If not display it would be even smaller.

Ah yes, I usually hide that on mobile too with this piece of CSS:

/* Hide kn-info-bar on mobile */
@media only screen and (max-width: 767px) {
  
  .kn-info-bar {
    display: none;
  }
}
1 Like

That was an interesting alternative. I just tried this media code on the mobile screen and very surprisingly it reduces less the space than the 0 height code. kind of weird.

anyway, good enough for now. tks!