Mattaton

Fixed that. Just have to change this css code: /* Expand the clickable area to the full width of the header */ .folder-showcase-outer[expanded="true"] .folder-hand-docker { position: absolute; z-index: 50; /* Keep below the main unRAID Nav */ display: inline-block; left: 0; right: 0; top: 0; bottom: 0; padding: 8px; }

No worries at all. Thanks!

Gotcha. Good catch. Should be an easy fix. Just have to check z-index on the nav and set the icons below that like I did with the folder context menus. I'll take a look when I get home tonight and post the tweaks. I've been reworking and cleaning up the CSS to be just what it needs (with enough specificity to be clear and override default styles) and easily translated for the VM panel. Hoping @scolcipitato (since he's not busy at all ) can hook us up with autostart-related classes on container wrappers so I can add some indications for that too. Then I'll post the updated CSS code. I've also added some effects that desaturate the folder (grayscale) and container icons and then saturate them on hover (color). Those are self-contained and can be easily axed if folks don't like it.

Ah okay. Makes sense. I thought this was some sort of fix for anyone with Unifi. 😄 I've read several threads on this and seen several comments that these lines in the log are normal. Guess I'll just let it be. 🙂 Thanks!

I'm having the same issue and Unifi is using 8080 on mine as well. Can you tell me why it using 8080 is bad? Like why did you even think that was the problem? 😄 Obviously you fixed it, I'm just curious why in the world that made a difference! 😄 Thanks!

Okay. Fixed that by adding z-index: 900 to the .folder-hand-docker selector: /* Expand the clickable area to the full width of the header */ .folder-showcase-outer[expanded="true"] .folder-hand-docker { position: absolute; z-index: 900; display: inline-block; left: 0; right: 0; top: 0; bottom: 0; padding: 8px; }

As of last night at midnight, all was fine. I got my array status notification. But sometime after that my server crashed. I can't get to webGUI or SSH. The errors on the monitor connected to the machine keep coming up every few seconds or so. See images below that my wife sent me (I am away at the moment). I asked her to try to log in so she could shut it down via command line, but the errors popping up keep interrupting her login. So, first question....is this a memory issue? Seems from some short googling that may be the case. I've ordered more RAM just in case. Second, should I just pull the plug and abandon a graceful shut down? [EDIT] - I just noticed this error in one of her other photos right after she apparently successfully logged in: -bash: /usr/share/bash-completion/bash_completion: Input/output error Thanks!

Ah. Good catch. I'll look at that this evening. Unfortunately, I just realized my server is down. I'm not at home, so I can't check it. I hope some of @hernandito's problems haven't spread my way. It was okay as of array check notifications 7 hours ago. 😕

Added a couple more selectors to my previous dashboard CSS. This increases the clickable area of the folder image to the entire width of the expanded header. So, you can click anywhere to get the folder context menu. /* Expand the clickable area to the full width of the header */ .folder-showcase-outer[expanded="true"] .folder-hand-docker { position: absolute; display: inline-block; left: 0; right: 0; top: 0; bottom: 0; padding: 8px; } /* Set a size on the text area to the same height of the folder icon image */ .folder-showcase-outer[expanded="true"] .folder-inner-docker { display: inline-block; height: 48px; margin-left: 55px; }

I know you just got done with some big fixing and sweet new updates, but a feature request for when you have a moment... Can you add a css class to the containers that are set to autostart (both on the dashboard and docker tab)? That way we can add some custom css to make the autostart setting obvious without opening the folders on the docker tab. And on the dashboard, I could add another icon to denote autostart status. Thanks!!!

All seems to be working well on my end. Thanks!

I just set up Immich and I want to enable hardware transcoding. I used the ghcr.io/imagegenius/immich image from Community Apps. I then added two Variables for NVIDIA_VISIBLE_DEVICES and NVIDIA_DRIVER_CAPABILITIES Is this all I should have to do? Similar to what I had to pass to Plex? The Immich site doesn't have much instruction on doing this with unRAID and I don't know all the ins-and-outs of Docker Compose (learning it) to be able to confidently translate everything that needs to be done. Plus, I'm not sure exactly what the CA Image is already doing. Thanks!

Glad to help! Ugh. I recall you saying you were into some data recovery. Sorry, man. 😕

@hernandito Okay. Sorry to blow things up with css code. Last tweak, I hope. 🙂 I realized that the left: 0 and right: 0 only worked on folders with enough container children to fill the width of the pane. Othwerwise it dropped back into flow with the unexpanded folders. That's fixed and I used a calc() to add 10px to the 100% width. I also refactored some code and cleaned things up. This should work pretty solid. I don't have any folders on my VMs, but this should style that area to match the docker pane with a few tweaks. /* Apply border-box to all elements inside the docker and vm panes */ #docker_view *, #vm_view * { box-sizing: border-box; } /* Add a padding left to the entire docker and vm icon area */ #docker_view tr:nth-child(2) td, #vm_view tr:nth-child(2) td { padding-left: 20px; } /* Expanded folder outer wrapper styles */ .folder-showcase-outer[expanded="true"] { border-radius: 10px; border: 1px solid rgba(255, 255, 255, 0.1); margin-bottom: 20px; margin-left: -10px; /* Overcome 20px container padding-left by giving expanded folder a negative left margin */ } /* Push expanded folder and its children to full width and break them out of flow with non-expanded icons */ .folder-showcase-outer[expanded="true"], .folder-showcase-outer[expanded="true"] .folder-showcase { float: left; display: block; width: calc( 100% + 10px ); /* Add 10px to the width to overcome negative margin */ } /* Expanded folder header styles */ .folder-showcase-outer[expanded="true"] .folder-docker { position: relative; /* Needed for absolute positioning of expanded arrow icon */ display: block; float: none; padding: 8px; border: 1px solid rgba(255, 255, 255, 0); /* transparent border for size */ background: rgba(255, 255, 255, 0.1); border-radius: 10px; } /* Increase the size of the expanded folder's icon */ .folder-showcase-outer[expanded="true"] .folder-img-docker { width: 48px; height: 48px; } /* Increase the font size for the expanded folder */ .folder-showcase-outer[expanded="true"] .folder-appname-docker { font-size: 2rem; } /* Down arrow icon for the expanded folder header */ .folder-showcase-outer[expanded="true"] .folder-docker::after { position: absolute; content: "\f0d7"; display: block; font: normal normal normal 14px/1 FontAwesome; font-size: 3rem; right: 1rem; bottom: 0; } /* Child docker container icons "drawer" styles */ .folder-showcase-outer[expanded="true"] .folder-showcase { padding: 0 20px; } /* Hide the "started" and "stopped" text so that only the green arrow or red square shows on containers */ #docker_view .folder-element-docker .state { display: none; }

@hernandito A few tweaks. Added border-box to all elements inside the docker pane. Border-box should just be the default, let's be honest. 😄 /* Apply border-box to all elements inside the docker pane */ #docker_view * { box-sizing: border-box; } Removed the width: 100% on the wrappers and used left: 0 and right: 0 to make sure it touches the edges at the 10px mark. /* Push expanded folder and its children to full width and break them out of flow with non-expanded icons */ .folder-showcase-outer[expanded="true"], .folder-showcase-outer[expanded="true"] .folder-showcase { float: left; display: block; /* width: 100%; */ left: 0; right: 0; } Also updated the expanded folder header to compensate for border and keep the icons lined up. /* Styles for the expanded folder header */ .folder-showcase-outer[expanded="true"] .folder-docker { position: relative; display: block; float: none; padding: 8px; border: 1px solid rgba(255, 255, 255, 0.1); background: rgba(255, 255, 255, 0.1); border-radius: 10px; margin-bottom: -10px; } Which gives me this:

Yeah, this is all with the custom css file. Here's where I am currently. Starting to get a little hacky with the indents. Getting the folder icons to line up is tricky and ends up making the docker pane look different than the vm pane. But I guess you could apply this to both panes. All the other panes have a 10px padding. I'm increasing the left padding to 20px and then giving a negative left margin of 10px to the expanded folder so it'll line up (other than the 1px border width - easily fixed). This works, more or less, but I can't figure out how to get the right margin of the expanded folder to extend another 10px to compensate for its negative left margin. Since it's set to be 100% width, I'm not sure how to add 10px to it. Tried negative right margin, but that had no effect. The only difference between the previous two images, was the fancy one had a rounded corner box around the child containers like a drawer instead of just the bottom border. Here's the code so far: /* Add a padding left to the entire docker icon area */ #docker_view tr:nth-child(2) td { padding-left: 20px; } /* Overcome 20px container padding-left by giving expanded folder a negative left margin */ .folder-showcase-outer[expanded="true"] { margin-left: -10px; } /* Push expanded folder and its children to full width and break them out of flow with non-expanded icons */ .folder-showcase-outer[expanded="true"], .folder-showcase-outer[expanded="true"] .folder-showcase { box-sizing: border-box; float: left; display: block; width: 100%; } /* Styles for the expanded folder header */ .folder-showcase-outer[expanded="true"] .folder-docker { position: relative; display: block; float: none; padding: 1rem; border: 1px solid rgba(255, 255, 255, 0.2); background: rgba(255, 255, 255, 0.2); border-radius: 10px; margin-bottom: -10px; } /* Increase the size of the expanded folder's icon */ .folder-showcase-outer[expanded="true"] .folder-img-docker { width: 48px; height: 48px; } /* Increase the font size for the expanded folder */ .folder-showcase-outer[expanded="true"] .folder-appname-docker { font-size: 2rem; } /* Down arrow icon for the expanded folder header */ .folder-showcase-outer[expanded="true"] .folder-docker::after { position: absolute; content: "\f0d7"; display: inline-block; font: normal normal normal 14px/1 FontAwesome; font-size: 3rem; right: 1rem; bottom: 0; } /* Styles for the child docker container icons "drawer" */ .folder-showcase-outer[expanded="true"] .folder-showcase { border: 1px solid rgba(255, 255, 255, 0.2); border-width: 0 1px 1px 1px; border-radius: 0 0 10px 10px; margin-bottom: 2rem; padding: 30px 20px 0 20px; } /* Hide the "started" and "stopped" text so that only the green arrow or red square shows on containers */ #docker_view .folder-element-docker .state { display: none; }

Unfortunately, I'm still missing those globe icons after the update. 😕

Are there instructions somewhere for doing that?

Are you guys saying there are containers that should have globe icons (Web UIs) but the globe isn't showing up? That's what I have happening. Containers that should have the globe icon link, but do not. Not sure if it's coincidence or not, but for me it's the first container in three folders that should have the globe but don't.

@hernandito Here's an update based on your notes. Thoughts? And a little fancier:

Agreed, this was a second version in case @Linguafoeda liked the arrow on the left better. I like your other ideas, too. The expanded folders and icons don't have a class, but the container does have an expanded="true", so can be selected with: .folder-showcase-outer[expanded="true"] I think that still allows what you're suggesting, right? I can only mess with custom CSS, @scolcipitato would have to add classes, if the above won't accomplish/allow what you're suggesting.

I am getting the CPU MEM graph, but I do not get Port Mappings, and the Web UI comes up about:blank#blocked.

Could also put the open arrow before the folder icon, like this:

@Linguafoeda Getting close with this css: .folder-showcase-outer[expanded="true"], .folder-showcase-outer[expanded="true"] .folder-showcase { float: left; display: block; width: 100%; } .folder-showcase-outer[expanded="true"] .folder-docker { position: relative; } .folder-showcase-outer[expanded="true"] .folder-docker::after { position: absolute; content: "\f0d7"; display: inline-block; font: normal normal normal 14px/1 FontAwesome; font-size: 2rem; right: 10px; bottom: 0; } .folder-showcase-outer[expanded="true"] .folder-showcase { border-top: 1px solid gray; border-bottom: 1px solid gray; padding-top: 2rem; margin-bottom: 2rem; } #docker_view .folder-element-docker .state { display: none; }

That's crazy that it works for you. I'm on Chrome. I just redid it and added width 100 and it worked. Already had the display block. 🙂 Thanks!