From 9ba9088f6ea590e47a6b7dd20c2650fd6350f6d1 Mon Sep 17 00:00:00 2001 From: Tanvir Date: Mon, 8 Jul 2024 18:12:22 +0600 Subject: [PATCH] add instructions in readme for live debugging of user chrome --- chrome/panel/statuspanel.css | 5 +++++ readme.md | 9 +++++++++ 2 files changed, 14 insertions(+) diff --git a/chrome/panel/statuspanel.css b/chrome/panel/statuspanel.css index 4245934..57968e8 100644 --- a/chrome/panel/statuspanel.css +++ b/chrome/panel/statuspanel.css @@ -43,3 +43,8 @@ background-color: #202020 !important; color: #c38f8f !important; } + +/* Hide the status panel */ +/* +#statuspanel {display: none !important ;} +*/ diff --git a/readme.md b/readme.md index 6933103..fa009f2 100644 --- a/readme.md +++ b/readme.md @@ -107,6 +107,15 @@ Look for specific topics in github: [userchrome](https://github.com/topics/userc More handy resources: [userchrome.org](https://www.userchrome.org), [FirefoxCSS Store](https://firefoxcss-store.github.io), [Mozilla Bugzilla](https://bugzilla.mozilla.org) +### Live debug and update `userChrome.css` + +1. Set `devtools.debugger.remote-enabled` to `true` in `about:config`. +2. Set `devtools.chrome.enabled` to true in `about:config`. +3. Open remote debugger using **Ctrl+Alt+Shift+I**. +4. Allow the incoming connection. +5. Select Style Editor tab, then open `userChrome.css`. +6. Edit and save the file for it to take effect (hot reload). + ## Theme The theme I'm currently using: [RosyBrown Dark by Me](https://addons.mozilla.org/en-US/firefox/addon/rosybrown_dark/)