ndorfin / nztechrally.com

Main website for the organisation and conference

NZ Tech Rally

Website for NZ Tech Rally, built with Eleventy, and auto deploy on commit via Netlify.

Project setup

Prerequisites

• Node v20+ (installed globally)

Install dependencies

npm i

Development

Build and start local server. Keep this running while working onthe project.

npm start

Adding and using an icon

Technique by Christopher Kirk-Nielsen

1. Add .svg file to src/_includes/svg/

2. Add .njk extension to the file

3. Open the new svg file and make these edits:

   • Set any colour to currentColor, and uncoloured background to transparent
   • Ensure <svg> tag has these attribute settingd class="icon {{ class }}" aria-hidden="{{ false if title else true }}"
   • Add {% if title %}<title>{{ title }}</title>{% endif %} as first child of <svg>

4. To use in template files, include icons you've just added like this:

   {% svg "icon-file-name" %}

   To add custom clas name or Icon title...

   {% svg "icon-file-name", { class: "icon-class", title: "Icon name" } %}

   For a regular SVG file, with the isNjk property set to false

   {% svg "grid", { isNjk: false } %}