diff --git a/README.md b/README.md index daa01f5..2ce4190 100644 --- a/README.md +++ b/README.md @@ -4,7 +4,12 @@ A browser extension to show your billability over the past 5 weeks in TimeChimp. -![Screenshot of the TimeChimp page with the billability chart](screenshots/page.png) +![The TimeChimp page with the billability chart](screenshots/page.png) + +
+ The billability chart + The tooltip of the chart, showing detailed information +
## Usage @@ -53,8 +58,6 @@ npm run type-check npm run format ``` -To load the extension in your browser, check the docs for [Chrome](https://developer.chrome.com/docs/extensions/mv3/getstarted/development-basics/#load-unpacked) or [Firefox](https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/Your_first_WebExtension#installing). - ### Step by Step First, you need to clone the repository, and install all dependencies: @@ -74,7 +77,9 @@ npm start This will generate various build folders for Chrome and Firefox. These are called `build_chrome` and `build_firefox` respectively. You can now load this as an unpacked extension in your browser. -For more info on how to do that, check the instructions for [Chrome](https://developer.chrome.com/docs/extensions/mv3/getstarted/development-basics/#load-unpacked) or [Firefox](https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/Your_first_WebExtension#installing). +For more info on how to do that, check the instructions +for [Chrome](https://developer.chrome.com/docs/extensions/mv3/getstarted/development-basics/#load-unpacked) +or [Firefox](https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/Your_first_WebExtension#installing). After making changes, be sure to click the "reload" button to let your browser reload the extension code. Without this, you won't see your changes in the browser.