search

ezeek / smartly

smartly - hubitat dashboard skin engine
https://hubitat.ezeek.us/smartly/
13 stars 1 forks source link

Legacy CSS conflicts with zoomy #74

Closed codahq closed 4 years ago

codahq commented 4 years ago

Maybe? Felt like a big to be but I am not a web developer so I don't understand all of the nuances of CSS and I don't want to. I'll just leave this here. Steps and video to reproduce weird scrolling on Android Essential PH-1, Android 10, Chrome 81, 1312 x 2560 pixels (~504 ppi density). It's weird that it only starts after the Zoomy tile is deleted.

https://youtu.be/PJ4Yv3SpETc

Zoomy produced: @media screen and (max-width: 439px) and (min-width:435px){.dashboard{zoom:0.944; -moz-transform:scale(0.944);}}

ezeek commented 4 years ago

it looks like you have CSS from pre-smartly era.. when it was just the hubitat-dashboard repository and we had to manually copy and paste JSON/CSS. This is the line that I saw that was a red flag:

FUTURE: use the smartly div to add right and bottom grid gap spacing

I would try deleting everything within Custom CSS in your HE dashboard 'Settings' > 'Advanced' > 'CSS', then update via smartly and add zoomy, then try again. Thank you for reporting!

ezeek commented 4 years ago

@codahq I'm going to close this but if having any issues, pm me on hubitat at 'spelcheck'

codahq commented 4 years ago

Yep, that's fine. I know who you are. And I'm fine to start over. I'm more than fine. The reason I reported it is because it was CSS from your release post from only a couple of months ago.

ezeek commented 4 years ago

I appreciate you looking out. That css was only in the original manual hubitat-dashboard repo before it was a system or named. The actual release thread never linked to it, but no matter, you don't need to start over, you just need to wipe the CSS and re-update.

I will build in some legacy detection for identifying CSS from its precursor to display an error.