diff --git a/special-pages/README.md b/special-pages/README.md index 90d0f5159..298b38f0d 100644 --- a/special-pages/README.md +++ b/special-pages/README.md @@ -24,6 +24,19 @@ This allows each respective platform to configure their integrations to use the - http://127.0.0.1:3210/build/integration/pages/duckplayer - http://127.0.0.1:3210/build/integration/pages/special-error +### Developing locally + +When working in this section of the repo, one tends to be focused on a certain special-page. To keep the dev cycle quick, we serve the special-pages, then only watch files in the special-page where development is happening. + +- `npm run serve-special-pages` run at the project root +- `npm run watch -- --page=` run in `special-pages/` directory + - e.g. `npm run watch -- --page=new-tab` + - Follow the link from this terminal window to http://localhost:8000/ for hot loading CSS updates and more + +### Styles + +Instead of dark mode media queries in the CSS, we rely on `data-theme` attribute set at the App level and update properties inside rules for `[data-theme=dark]` or `[data-theme=dark] &`. This does change the specificity of properties set in this selector vs a media query. + ### Integration Tests Ensure these commands are run from the `special-pages` folder. @@ -36,7 +49,7 @@ npm run test-int -- --project ios # to *only* run screenshot tests npm run test.screenshots # to also update screenshots (if you've made changes to anything visual) -npm run test.screenshots -- --update-snapshots +npm run test.screenshots -- --update-snapshots ``` The process is as follows: