1. Kanga
  2. Components

Kid’s Age

In my diary, I show how old my kids were at the time of each post.

By passing a date of birth, post date, kid’s name and an emoji, this component will display:

  • How old the child is at the time of this post,
  • or, how long it will be before they’re born,
  • or, that they were recently born (within the last month), and show a little emoji that depicts our family.
Open this example in a new tab
View the code for this example 
{% from 'includes/age.njk' import age as age %}

<p>{{ age({
  dob: '2010-01-01', 
  date: '2022-09-07', 
  name: 'Zanthar', 
  emoji: '👨‍👩‍👧'
}) }}</p>

<p>{{ age({
  dob: '2010-01-01', 
  date: '2010-01-23', 
  name: 'Peanut', 
  emoji: '👨‍👩‍👧'
}) }}</p>

<p>{{ age({
  dob: '2010-01-01', 
  date: '2001-01-23', 
  name: 'Facsimile', 
  emoji: '👨‍👩‍👧'
}) }}</p>

Nunjucks Macro parameters

Name Type Description
dob string Required. The kid’s date of birth in ISO 8601 format.
date string Required. The post date in ISO 8601 format.
name string Required. The kid’s name.
emoji string An emoji to show if the kid was recently born.