Hide menu bar in Mosaic

[Trond Hoyem]

Hi

I am making some visualisations on some Divus screens. For this purpose I only want each screen to be able to see one single page and not be able to navigate to any other page.

I see that there is some CSS in the "Styles" in the config. Is it possible to hide it completely here?

[Daniel]

In new Mosaic with user access you will have option to restrict access.
Try this

Code:

body.app-container .panels.panels_left {
visibility: hidden;
}
body.app-container .header {
visibility: hidden;
}

[Trond Hoyem]

In new Mosaic with user access you will have option to restrict access.
Try this

Code:

body.app-container .panels.panels_left {
visibility: hidden;
}
body.app-container .header {
visibility: hidden;
}

I am using the Schneider Touch, not really Mosaic as I stated earlier. Sorry about the unclear information.

This CSS worked like a charm, so I will go for this solution.
Thanks for help!

[Trond Hoyem]

I am doing some more adjustments to this touch-visu.

I want to hide also the back-button in the top left corner so that the users are not able to navigate at all. I need this because there are several different rooms with visu on each SL, and since there is no user control, I need to restrict the access in a different way.

I have tried this, but with no luck:

Code:

body.app-container .header.header__constrain.header_settings2 {
visibility: hidden !important;
}

The back button is still there. 

I am not sure exactly how to drill in to the different levels of the different <div>, so maybe I am doing it wrong....

[admin]

Try this:

Code:

.header__settings2 { display: none !important; }

[Trond Hoyem]

Try this:

Code:

.header__settings2 { display: none !important; }

Yup, that worked.

But in this code you are skipping the whole drill down thing. I cannot really understand why sometimes one needs to drill down, and other times that is not working.
In the first CSS code in this thread i get the code to hide the left panel:

Code:

body.app-container .panels.panels_left {
visibility: hidden;
}

When I inspect the touch visu, the body.app... -> panels -> panels.left is the actual levels for the <div>'s I can see in the inspect window, hance the reason why I tried the code

Code:

body.app-container .header.header__constrain.header__settings2

to reference the button I needed to hide. (I realize that I had a misspel in my first post, (missing one _) but correcting it did not help)

It did not work, but when I tried your version, without the reference to the other levels, it worked. 

Why?
How do one know when to use the different levels in the referenceand when not to?

[admin]

If using !important usually you don't need to write the whole path. Otherwise the priority depends on which types (element, id, class) are in the selector.

[Trond Hoyem]

If using !important usually you don't need to write the whole path. Otherwise the priority depends on which types (element, id, class) are in the selector.

OK, so that means, use !important, and then add path if it does not work?

[admin]

important should work with a single selector in most cases. You can use inspect element in your browser to see which rules are overridden with others with higher priority.