/nztechrally.com

Main website for the organisation and conference

Primary LanguageNunjucks

NZ Tech Rally

Netlify Status

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 } %}