Azure Health Marketing Site

This repo contains the Azure Health public marketing site. It is built with Eleventy for static site generation, Sass for styling, and Decap CMS (Netlify CMS) for updating content through a browser-based admin UI.

Prerequisites

• Node.js 20 (match the Netlify build environment defined in netlify.toml)
• npm 9+

Install dependencies once your runtime matches:

npm install

Common Tasks

• Start local dev server with live reload:

  npm run start
  

  This runs sass --watch and eleventy --serve, serving the site at http://localhost:8080/ by default.

• Build for production / Netlify deploy preview:

  npm run build
  

  Output is written to the _site directory.

• Regenerate CSS only:

  npm run sass
  

ℹ️ npm run build currently prints a Sass deprecation warning about global map-get. It does not break the build and will be addressed when Sass 3.0 lands.

Project Structure

_includes/        Reusable Nunjucks templates (header, footer, etc.)
_data/            Global data fed into Eleventy & Decap CMS (`site-data.json`)
pages/            Page templates (compiled into routes like /, /refer, /patients)
scss/             Sass source; compiled into `css/style.css`
css/              Generated CSS (committed so Netlify can serve it as-is)
admin/            Decap CMS configuration (`config.yml`) and admin UI shell
js/               Front-end behaviour (currently just `app.js` for nav toggle)
netlify.toml      Netlify build instructions

Editing Content with Decap CMS

1. Deploy the site with Netlify Identity / Git Gateway enabled.
2. Visit /admin/ and log in with your Netlify Identity account.
3. Use the Site Settings collection to edit:
   • Navigation labels/URLs
   • Home page CTAs, pricing, company info, etc.
   • Practitioner content used on /practitioners/
4. Use the Policy Pages collection to edit Markdown content for fees, privacy, and terms pages.
5. The Refer Page section (added under Site Settings) controls the hero copy, process steps, benefits, and contact info displayed on /refer/.

Edits made through Decap CMS create commits in the master branch via Git Gateway. Remember that some fields allow limited HTML (body | safe in templates) for links or formatting.

Making Code Changes

1. Create a feature branch in Git.
2. Run npm run start for a local preview while updating templates, Sass, or scripts.
3. Commit changes along with the compiled css/style.css and css/style.css.map so Netlify deploys the updated assets.
4. Open a pull request and merge once reviewed; Netlify will redeploy via npm run build automatically.

Deployment

The site is configured for Netlify. Pushes to master trigger Netlify builds using the command npm run build, publishing the _site directory. Environment-specific URLs are automatically handled in _data/site.js, which swaps site.url with Netlify preview URLs when appropriate.

Troubleshooting

• Sass deprecation notice: Informational only. If it becomes blocking in a future Sass release, update _mixins.scss to use map.get.
• Decap CMS login issues: Confirm Netlify Identity is enabled and the logged-in user has access. Check browser console for CORS errors.
• Local build differs from production: Ensure you are using Node 20. Run npm ci to install exact lockfile versions if discrepancies persist.

Useful Links

• Eleventy docs: https://www.11ty.dev/docs/
• Sass CLI docs: https://sass-lang.com/documentation/
• Decap CMS config reference: https://decapcms.org/docs/configuration-options/
• Netlify Identity & Git Gateway: https://docs.netlify.com/visitor-access/git-gateway/