3 ms·
Does anyone know a good extension that just does the hover / inspect element for the CSS styles in a nice way like this app? Seems much more convenient than di
by city17 3y ago
Does anyone know a good extension that just does the hover / inspect element for the CSS styles in a nice way like this app?
Seems much more convenient than diving into dev tools every time you want to quickly check an element’s property. 30/month is a bit excessive for just that one function.
- kristopolous 3y agoIt's a clever idea and it's super simple Add an event listener on the entire document.body Get the event.target and the style and then descend to the children. Put it formatted in the clipboard. Then do it as a bookmarklet and deregister the click handler when you're done so you can continue interacting with the site It's probably around 12 lines of modern js. You can add a fancy graphical outline to know what you're selecting with a few more lines. Just make sure you draw it on top and don't modify the elements. Use a css filter to make it work on all elements. Modern tooling is pretty great.
- city17 3y agoThanks, I was thinking of a similar solution too, but the tricky part is filtering and finding the right CSS properties to display. From my quick attempt this is a non-trivial task as there is no easy built-in way to get just the computed styles of classes on the specific element and those of its close ancestors. And even among those, not all are always relevant.
- CharlesW 3y ago> Does anyone know a good extension that just does the hover / inspect element for the CSS styles in a nice way like this app? I think the same person makes CSS Scan ($95 lifetime): https://getcssscan.com/ https://getcssscan.com/