在 debugger 首個版本發佈之後，我注意到通過彈出式視窗（popup）打開的編輯器在失去焦點時會關閉，這給用戶體驗帶來了很大的不便。通過 @DIYgod，我了解到了 Stylebot 這個插件。在安裝、體驗和閱讀源碼之後，我學會了運用 content scripts 將代碼編輯器嵌入到當前頁面中。因此，在今天下午我對代碼進行了大幅度的重構。
目前插件支持以下功能：
- 查看並實時調試當前頁面的自定義 CSS；
- 編輯器能夠根據頁面自動適配暗黑模式；
- 增加了一些 xlog CSS 選擇器的自動補全提示。
歡迎大家使用並提供反饋，以幫助我修復 bug。
下載地址：https://github.com/birdgg/xLog-custom-css-debugger/releases/download/0.2.0-alpha/dist.zip
使用方式：
- 下載後解壓縮
- 打開 chrome://extensions/， 開啟開發者模式，加載 dist 文件夾
- 右鍵菜單欄選擇 Toggle xLog css debugger，打開調試器（安裝後，已打開的頁面需要刷新一下）
github 地址：https://github.com/birdgg/xLog-custom-css-debugger
ps: 這篇文章用 chatgpt 潤色一下，讀起來怪怪的
pps: 是時候開啟自定義 css 的時代了🥳