diff --git a/.gitignore b/.gitignore index d3ecd9c..acbc26b 100644 --- a/.gitignore +++ b/.gitignore @@ -2,4 +2,6 @@ node_modules .DS_Store .vscode build -.wrangler \ No newline at end of file +.wrangler +site.css +site.css.map \ No newline at end of file diff --git a/README.md b/README.md index 0a91a3d..5253663 100644 --- a/README.md +++ b/README.md @@ -8,11 +8,19 @@ Also includes a contact form, which sends an email with relevant details from wh Ensure npm is installed. -Download pico css: +Download dependencies: `npm install` +Run `./build.sh` to build the site that is served by cloudflare pages + ## Debugging Easiest way to debug/visualise the content is to use the inbuilt IDE browser. VS Code/Codium can display a preview side-by-side by clicking the Open Preview to the Side button. This will show changes live, exactly as the content will be rendered when run from another webserver. + +To generate the css file during development, run the following: + +`npx sass --watch site.scss. site.css` + +Note: The contact form cannot be tested locally with wrangler as this is not supported by Email Routing, instead you'll need to use the --remote diff --git a/build.sh b/build.sh index 521ec69..dce07fb 100755 --- a/build.sh +++ b/build.sh @@ -1,6 +1,3 @@ -mkdir -p build/@picocss/pico/css/ -cp -r *.png *.xml *.svg *.css *.webmanifest *.ico robots.txt _headers functions contact build -# https://github.com/cloudflare/workers-sdk/issues/3615 -sed 's/node_modules\///' index.html > build/index.html -sed 's/node_modules\///' contact/index.html > build/contact/index.html -cp node_modules/@picocss/pico/css/pico.min.css build/@picocss/pico/css/ \ No newline at end of file +mkdir -p build/ +cp -r *.png *.xml *.html *.svg *.webmanifest *.ico robots.txt _headers functions contact build +npx sass --quiet --style=compressed --no-source-map site.scss build/site.css \ No newline at end of file diff --git a/contact/index.html b/contact/index.html index 55e638c..4b5cab2 100644 --- a/contact/index.html +++ b/contact/index.html @@ -4,10 +4,7 @@ Michael Pivato | Contact - + Michael Pivato - @@ -28,7 +27,7 @@ /> -
+