Is it possible to turn off/hide the dashboard title bars

🎬 Get Started Tips
1

Hi folks,

Looking for a way to hide/turn off the title bars in the dashboards.

I know what some of you think, is he CRAZY. Why would you hide your controls?

This is actually something you can do in ACTIONTILE Dahsboards, and the main reason i want to
do this...because i have my own custom webpages for dashboards and will be incorporating
these Hubitat dashboards as IFRAMEs in them locally and i don't want Hubitat control buttons everywhere.

One hack is to cover over them with CSS. I was just hopping to avoid the extra blackout bars as i call them.

image
image1356×914 119 KB

Thanks for any guidance....

Hubitat Newbie, Not an IT or smarthome Newbie :slight_smile:

PS: I admit the titles are fairly clean. i appooligize if this is mention in another thread. i could not find anything.

2

Short answer is yes, I would just need to get you the custom css code to do it. You can lookup the noobs css thread, otherwise I'll try and get you something later today.

2 Likes
3

sburke781,

Thanks for responding... ya if you happen to find it, I would be grateful... I figured that would be the trick, but knowing how to reference the objects is where i struggle.
Like what they are called.... like .title or .dashboard and such.

Thanks

4

Only problem with css is that you won't be able to go back in to change it back since the setting is also in that bar. I did this a while back and only way to get the it back is roll back your hub.

5

So I found the CSS in the other Nooby thread.

Ya, i get what they are saying it would have been better if the DASHBOARD settings themselves had an extra checkbox for titlebar on or off, that would be idea. Seems like that wouldn't be hard for the right developer, that is not me :slight_smile:

I have my home in smarthings, i am kicking the Hubitat tires, around the idea of moving things more local and not cloud based. Currently I use my own nginx web server on Linux mint on smarthings with a licensed copy of ACTIONTILEs. Here back about month ago when AWS cloud(east) went down for like a whole day I truly felt the dark cloud pains in my smarthome. Hunitat looks like a viable opportunity to get rid of a lot of my cloud dependencies. Ideally i want my local dashboards available with all my push-able buttons, priorities list...

Today, pretty much cloud dependent. Works great about 98% of the time. However I have a lot of sub app mobile account hooks and stuff that i want to get away from, just in case these companies start biting the dust.

Where i am thinking of being in the xt couple of yrs

  1. controls and dashboards fully functional (local)
  2. routines, (nice to keep working but not critical) (local)
  3. the cloud (0ptional) should only be the voice control dependency
    (in my case Alexa)

Even i do not fully shift, I may just assimulate the Hubitat into my enviornment, from what I have seen in my first week has been worth the purchase and the testing..

You guys should know I am a STRONG SUPPORTER of SAMSUNG products, so the only thing that might break the deal for me is if there NEW major upgrade breaks a lot of what i have. Was looking for Plan B and I am sure I made a good choice with Hubitat.

Man I got wordy.... :slight_smile:

Anyways I found this which I believe was what i was looking for.

Here is what i found that is awsome start for a Noob, so maybe they find it faster here..

.dashboard div .header {
position: fixed;
top: 0;
right: 1em;
z-index: 999;
opacity: .2;
zoom: .6;
-moz-transform:scale(.6);
}

.wrapper {
height: 100%;
margin-top: 0;
padding-top: 1em;
}

.dashBack,
.dashName {
display: none;
}

.dashboard div .header>.flex-auto.justify-end,
.dashboard div .header>.flex-auto.justify-end>.flex {
display: block;
}

1 Like
6

FYi.... this is what the above css will produce for those trying for the first time, so you don't loose total control.

image
image1112×493 17 KB

2 Likes
7

Yeah that's what I do, tuck them away in a corner and dulled down so they don't stand out too much. Nice job finding it. I also have an editor that lets you do this by adjusting a setting in a pop-up iFrame.

8

Building on this idea this is what I do in Platform Version: 2.3.5.146:

.dashboard div .header {
  position: absolute;
  top: 1.5em;
  right: 0;
  zoom: 0.5;
  z-index: 999;
}
.wrapper {
  height: 100%;
  margin-top: .5em;
  padding: 0 1em 1em 1em;
}
.dashBack,
.dashName {
  display: none;
}
.dashboard div .header>.flex-auto.justify-end,
.dashboard div .header>.flex-auto.justify-end>.flex{
  display: block;
}
.dashboard div .header>.flex-auto>:not(.showSidePanelBtn) {
  display: none !important;
}

I then go Dashboard app and for each dashboard I turn on "Lock down dashboard so no changes can be made in the Web UI of this Dashboard". This hides the '+', 'gear' and tile menus. If I need to edit the dashboard I turn off this setting and the '+', 'gear' and tile menus appear so I can make the edits.

1 Like