Couple things. Make sure you click the “Copy to Clipboard” button, it’s a second click and in re-doing my dashes to v2 I have also often miss that second click (we are discussing option to fix it).
Secondly if that is not it, try a incognito/private window. Some extension are known to mess with smartly. LMK what you find and we’ll go from there.
wait I just re-read this part. The stuff into and out of smartly is the JSON “Layout” tab, not CSS. Make sure you are deleting your “Layout” tab and pasting the smartly JSON in there.
@TechMedX, thank you! That’s what I was missing. I swear with v1 it was into the CSS tab (I used the Layout to get into smartly, just put it in the css coming out). One of those days I guess!
Personal customization to smartly (less are needed now) go in the CCS. We can do lots of cool new stuff there, and silly stuff like spinning tiles when you turn lights on, with v2. All that goes into CSS, at the very bottom, but the main smartly code is JSON.
Is there a good way (custom CSS at the bottom I assume?) of setting the column width to “auto”? This lets it work better on multiple tablets without having to make a million of the same dashboard. Normally I could just figure out the ID or class of the object, but I’m not sure how it works since it is one of the settings in the Hubitat menu.
BTW, drag and drop is the best thing EVER. Most useful app I’ve every installed just for that!
@TechMedX I poked at that, but it was a pain to have to figure out what all of the devices were or might be and I really don’t want to have to redo the dashboard every time I get a new device. The built in Hubitat “auto” for column width works great.
Basically, same number of columns that I have ideal for my tablets works okay just a little inefficient on a computer screen. It’s just a pain to have to adjust the column width back to no value for every dashboard if I have to update it in Smartly
Thanks for that feedback. tagging @spelcheck to review it, and we’ll discuss what can be done to resolve that. I know that smartly uses blank values to detect/apply the advanced grid mod, but you have a valid point. It may be easy enough to modify how the advanced grid mod is detect/deployed, so that it does not interfere with the auto adjustment feature.
We sincerely appreciate the feedback, that’s how smartly gets even better! Keep it coming!!
The other one it would be nice to have an option for is the menu font size. The font is so huge that even on my browser I have to scroll and it makes some of the menus unusable. The words (especially “search”) on the menu pages don’t need to be made nearly as big as they are imho nor does that box need to be quite so large. There’s no reason it couldn’t fit nicely when updating things from a browser. Maybe there is something else that I don’t realize that uses that same class.
Example like when you click on the three dots for a tile. I tried to add a picture but it looks like that’s turned off for this community
That’s a discord membership issue. You need to spend a few minutes reading topics before the site will increase your “trust level”. It happens automatically after a short time (5-10 minutes reading I think). It’s to prevent bots from ruining things.
EDIT: helped you out with a few extra likes and the assist pic below.
I get what you mean. Not sure how much control smartly has over those type of screens, but if it can be done @spelcheck will find a way!
I do agree they are way too big and often get in the way of seeing your tiles. Not being able to drag the stupid CSS edit window out of the way also drives me mad! Constantly moving tiles to work on them, then moving them back into place, foolishness!!
It is foolishness! I believe those are not the default size and that it is different from without Smartly in the dashboard. This is the test dashboard I have without Smartly:
I believe these are the two items I changed in custom CSS that overrode things (from messing with v1). I also for some reason feel like it was not working without the !important? (Don’t judge the poor CSS practices please, I was sleep deprived with a 2 month old at the time )
I’m getting caught up, so I’ll start from the bottom up!
The reason that tile jumps to the bottom when you enable drag-and-drop is because your “Home” dashboard tile is technically overlapping the tiles below it, and drag-and-drop doesn’t yet support overlapping tiles.
Dashboard tiles by default, are using the ‘half height (centered)’ setting, so they are actually taller than they appear. See below:
This is the setting you should set to ‘full height’ for that tile in smartly, then when you drag and drop it into place and size it (assuming you make it not overlap anything), it’ll stay in place.
@forlornlawngnome Yeah I bumped up the size of all input-related fields and buttons in the UI for touch accessibility for use with tablets. I could have it conditionally apply to only devices of that size, but I thought it helped across the board so I kept it. Understandable that there are a few bugs because of it, requiring us to sometimes drag downwards to make the buttons visible, and I’d like to find time to improve that but it might not be soon, sorry!
I’m going to make an issue ticket for this though. Definitely some tuning would be great so that on desktop in particular the fields aren’t enormous
Re: auto-width columns / calibration… I understand that the auto feature is tempting, but please drop a few devices into calibration and try it out. the benefit is that you can have one dash and structure it so that the most important tiles are in the first 2-3 columns. this way when viewing on mobile, it’ll show your go-to tiles, and you can scroll to the right to access more. for larger devices it’ll intelligently choose how many columns to show and zoom the entire dashboard to have the best legibility.
best example of the end product is probably this smartly product photo
I will, I actually hit a weird one with the battery on my pixel 5 where everything was very wrong, but then on a brand new dashboard it seemed okay so it must be something I had done in my custom CSS causing the issue .
I guess for me, I basically only use it on tablets or my computer browser. If I’m in a position where I need it not near one of those, I just use voice assistant. For tablets, I have a fire tablet, an iPad and a Pixel C, the last one doesn’t actually have an optimization and is a bit of wonky sizing I believe.
Thank you all so much for this awesome addition, and great response! I’ve had a much more positive response on this forum than I ever do on Hubitat proper, especially for help. I also absolutely LOVE the drag and drop!!
Hey
Something is wrong with the calibration.
And it was also wrong when I used Fire 8 HD settings (which are exactly the same).
But I changed settings by myself and I can tell you that these ones are great:
@media screen and (orientation: portrait) and (max-width:602px) and (min-width:600px){.dashboard{zoom:0.977; -moz-transform:scale(0.977);}}@media screen and (orientation: landscape) and (max-width:963px) and (min-width:961px){.dashboard{zoom:0.9; -moz-transform:scale(0.9);}}
I changed dashbard zoom for landscape orientation to 0.9.
Now it looks great on Fully Kiosk Browser
Just jumping in to say thanks, I used Smartly for a couple of dashboards just after you launched and they’ve done sterling service. We don’t use dashboards much though so it all got left as is.
Roll around to today, new devices and some free time meant updating Smartly and tinkering.