Chrome dev tools dark theme

[BCleverly]

I use the Dark theme on Chrome dev tools by default.

When the plugin loads up, text is in black, and on the dark grey background, it's hard to read, would you be able to detect a dark theme, and change text colour to white/light grey instead?

[madebymtr]

That is absolutely something we can look into! Thank you for bringing that to our attention.

[paulirish]

The property chrome.devtools.panels.themeName will have the value of dark in dark mode. It'll be default otherwise.

[madebymtr]

thanks @paulirish - never thought i'd see the day where you commented on something i worked on

[paulirish]

well you shouldn't have build something awesome then! 😛

srsly though, this is really nice stuff. I'm really into using more visualization to explore an application and its state. ya'll done a very nice job here.

---

btw.. i dont have a decent size vue app of my own to test this out on... do you have a recommendation? (tried it on the dejavue app itself

[madebymtr]

@paulirish we have a small working demo on our orginzation repo at https://github.com/MiCottOn/dejademo

otherwise im finishing up a slack clone in vuejs as a larger example with more data. that should be done in the next couple of days.

or you can go nuts and try it on the hacker news vue2 demo found at https://github.com/vuejs/vue-hackernews-2.0 - be warned that the amount of component data can make the visualization a little nuts, but all the data is there

and the kind words coming from you have absolutely made our day. thank you so much.

[sschwartz0]

@BCleverly - Thanks for pointing this out! Just uploaded the fix here. The new version should be published in the web store in the next 60 minutes.

@paulirish - Really appreciate the feedback and help. It's awesome to see firsthand how involved you are with the community. Definitely would have had trouble with this fix without your help! Also made the SVG be the full width of the window so hackernews should look better. We'll be refining our visualization to ensure consistent spacing with large applications.

[paulirish]

@sschwartz0 all good! it was a random find. I landed on your site, was impressed with the images, wanted higher resolution, came over to github.. was surprised to see only 2 open issues for such a fine looking project, clicked through, saw the devtools ticket and knew i could help at least. :)

Ya'll should put a big animated GIF or video on the homepage. Really helps to illuminate how the tool works. :) Anyhow.. cheers!

[madebymtr]

@paulirish we are actually in the process of doing just that! should be up tomorrow.

thanks again!

[kimhjona]

@paulirish We'll have gifs and an instructional video, which people have been asking for. Appreciate the suggestions!

[BCleverly]

Awesome work, thank you!