diff --git a/src/patterns/04-components/_index.scss b/src/patterns/04-components/_index.scss
index 3774b03115a785fffc89b72e6c5f96158ccfe55d..70225c4ec478eeed4c10528013b31315987af8ad 100644
--- a/src/patterns/04-components/_index.scss
+++ b/src/patterns/04-components/_index.scss
@@ -48,6 +48,7 @@
@forward 'tag/tag';
@forward 'tag-list/tag-list';
@forward 'territorial-statement/territorial-statement';
+@forward 'timeline/timeline';
@forward 'twitter/twitter';
@forward 'view/view';
@forward 'view/view-content/view-content';
diff --git a/src/patterns/04-components/timeline/_timeline.scss b/src/patterns/04-components/timeline/_timeline.scss
new file mode 100644
index 0000000000000000000000000000000000000000..b97eb64d1486a9a115c218824162a98640af4c4a
--- /dev/null
+++ b/src/patterns/04-components/timeline/_timeline.scss
@@ -0,0 +1,195 @@
+@use '../../01-core' as *;
+
+.vertical-timeline {
+ font-family: var(--font-secondary);
+ font-size: var(--font-size-1);
+ font-weight: 200;
+ list-style: none;
+ /* 2 padding-top to allow pulling the line up above the first entry */
+ padding: 0;
+ padding-top: var(--size-6) !important;
+ position: relative;
+ z-index: var(--layer-background);
+
+ b,
+ strong {
+ font-family: var(--font-book);
+ font-weight: 500;
+ }
+
+ @media(min-width: $screen-sm) {
+ margin-left: var(--size-4);
+ }
+
+ @media(min-width: $screen-md) {
+ margin: 0;
+ }
+
+ p {
+ font-family: var(--font-secondary);
+ font-size: var(--font-size-1);
+ margin-top: var(--size-1);
+ }
+
+ a {
+ text-decoration: none;
+ }
+
+ li {
+ margin: 0;
+ padding: 0;
+ }
+
+ ol {
+ display: inline-block;
+ list-style: none;
+ margin: 0;
+ overflow: visible;
+ padding: 0;
+ vertical-align: top;
+ }
+
+ .timeline-year {
+ background: var(--uw-black);
+ color: var(--uw-white);
+ display: inline-block;
+
+ @media(min-width: $screen-md) {
+ margin-left: inherit;
+ }
+ padding: var(--size-05) var(--size-1);
+ position: relative;
+ text-align: center;
+ /* Fix the width so the line always lines up. */
+ width: var(--size-6);
+ z-index: var(--layer-wrapper);
+ }
+
+ .timeline-month {
+ background: var(--gray-5);
+ color: var(--uw-white);
+ display: inline-block;
+
+ @media(min-width: $screen-md) {
+ margin-left: -0.19rem;
+ }
+ padding: var(--size-05) var(--size-1);
+ position: relative;
+ text-align: center;
+ text-transform: uppercase;
+ /* Fix the width so the line always lines up. */
+ width: var(--size-6);
+ z-index: var(--layer-wrapper);
+ }
+
+ .timeline-info {
+ border: var(--size-xs) solid var(--uw-white);
+ box-shadow: var(--size-sm) var(--size-sm) 0 var(--gray-2);
+ margin-bottom: var(--size-4);
+ padding: var(--size-sm) var(--size-2) var(--size-4);
+ position: relative;
+
+ a {
+ display: block;
+ /* Margin/padding tricks to make links cover the padding of the li */
+ margin: -1rem -1rem -2rem;
+ padding: var(--size-2) var(--size-2) var(--size-2);
+
+ &:hover,
+ &:focus{
+ background: var(--gray-2);
+ }
+
+ &::after {
+ /* Modern clearfix from https://css-tricks.com/snippets/css/clear-fix/ */
+ clear: both;
+ content: '';
+ display: table;
+ }
+ }
+
+ &::before {
+ /* Trick CSS to add the circle. */
+ background: var(--gray-1);
+ border: 1px solid var(--gray-4);
+ border-radius: 50%;
+ content: '';
+ display: inline-block;
+ height: var(--size-105);
+ left: -0.5rem;
+
+ @media(min-width: $screen-md) {
+ left: -1.45rem;
+ }
+ position: absolute;
+ top: var(--size-05);
+ width: var(--size-105);
+ }
+
+ &::after {
+ /* Modern clearfix from https://css-tricks.com/snippets/css/clear-fix/ */
+ clear: both;
+ content: '';
+ display: table;
+ }
+
+ &__withlink {
+ &:hover {
+ &::before {
+ background: var(--gray-3);
+ border: var(--size-xs) solid var(--gray-4);
+ }
+ }
+ }
+ }
+
+ .timeline-photo {
+ border: var(--size-xs) solid #dddddd;
+ float: right;
+ margin: 0 0 0.7rem 0.7rem;
+ }
+
+ &.vertical-year,
+ &.vertical-month {
+ overflow: visible;
+ }
+
+ &.vertical-year,
+ &.vertical-month ol {
+ /* -2 margin-top + 2 padding-top to pull the line up above the first entry */
+ margin-top: -2rem;
+ padding-top: var(--size-4);
+ width: 100%;
+
+ @media(min-width: $screen-md) {
+ width: calc(100% - 4rem);
+ }
+ }
+
+ &.vertical-year ol,
+ &.vertical-month ol ol {
+ border-left: var(--size-xs) solid var(--gray-4);
+ /* -2 margin-top + 2 padding-top to pull the line up above the first entry */
+ margin: 0;
+ width: 100%;
+
+ @media(min-width: $screen-md) {
+ margin: -1rem 0 0 var(--size-4);
+ padding: var(--size-2) var(--size-2) 0;
+ width: calc(100% - 8rem);
+ }
+ }
+}
+
+.timeline {
+ &-headline {
+ font-size: var(--font-size-0);
+ line-height: 1.25;
+ }
+
+ &-year,
+ &-month {
+ font-family: var(--font-systemmedium);
+ font-size: var(--font-size-00);
+ }
+}
diff --git a/src/patterns/04-components/timeline/timeline.md b/src/patterns/04-components/timeline/timeline.md
new file mode 100644
index 0000000000000000000000000000000000000000..e69de29bb2d1d6434b8b29ae775ad8c2e48c5391
diff --git a/src/patterns/04-components/timeline/timeline.twig b/src/patterns/04-components/timeline/timeline.twig
new file mode 100644
index 0000000000000000000000000000000000000000..707327a684a3b886f2ff65f10f053c0138ff7e24
--- /dev/null
+++ b/src/patterns/04-components/timeline/timeline.twig
@@ -0,0 +1,55 @@
+{% set modifier_classes -%}
+ uw-timeline vertical-timeline vertical-{{ timeline.style }} {{ modifier_classes }}
+{%- endset %}
+
+<ol class="{{ modifier_classes }}">
+ {% for year, years in timeline.items %}
+
+ <li>
+ <span class="timeline-year">{{ year }}</span>
+ <ol>
+
+ {% for month, months in years %}
+
+ {% if timeline.style == 'month' %}
+ <li>
+ {% set date = year ~ "-" ~ month ~ "-1" %}
+
+ <span class="timeline-month">{{ date|date("M") }}</span>
+ <ol>
+ {% endif %}
+
+ {% for days in months %}
+
+ {% for entry in days %}
+
+ <li class="timeline-info{% if entry.link %} timeline-info__withlink {% endif %}">
+ {% if entry.link %}
+ <a href="{{ entry.link }}">
+ {% endif %}
+ {% if entry.image %}
+ <img src="{{ entry.image }}" alt="" class="timeline-photo"/>
+ {% endif %}
+ <div class="timeline-headline"><strong>{{ entry.headline }}</strong></div>
+ <p>{{ entry.content }}</p>
+
+ {% if entry.link %}
+ </a>
+ {% endif %}
+ </li>
+
+ {% endfor %}
+
+ {% endfor %}
+
+ {% if timeline.style == 'month' %}
+ </ol>
+ </li>
+ {% endif %}
+
+ {% endfor %}
+ </ol>
+ </li>
+
+ {% endfor %}
+</ol>
\ No newline at end of file
diff --git a/src/patterns/04-components/timeline/timeline.yml b/src/patterns/04-components/timeline/timeline.yml
new file mode 100644
index 0000000000000000000000000000000000000000..860418795f52524fded480fe569758a17be875ee
--- /dev/null
+++ b/src/patterns/04-components/timeline/timeline.yml
@@ -0,0 +1,190 @@
+---
+timeline:
+ style: 'month'
+ items:
+ 1966:
+ 6:
+ 8:
+ -
+ link: 'https://uwaterloo.ca'
+ headline: 'This is a headline.'
+ content: 'The Polyphemus moths have begun to emerge from their cocoons - 7 females and 2 males emerge in one day. I put the females into 3 separate mating boxes and leave them by an open window so that they can release their pheromones. By 1 am, they have called in a couple of male moths. I mate two of the females with wild males.'
+ 9:
+ -
+ link: 'https://uwaterloo.ca'
+ headline: 'This is a headline.'
+ content: 'I release all the moths except one of the pregnant Polyphemus moths which I keep in a paper bag to lay her eggs.'
+ image: 'https://uwaterloo.ca/ecology-lab/sites/ca.ecology-lab/files/styles/thumbnail/public/june_9.jpg?itok=9i7qSooF'
+ 11:
+ -
+ link: 'https://uwaterloo.ca'
+ headline: 'This is a headline.'
+ content: 'The female Polyphemus has laid a total of 103 eggs. Half of these eggs are now in the Ecology Lab under modified temperature and humidity conditions. As a control measure, the other half of the eggs have been placed in a natural area, their habitat was not modified in any way so that they are subject to natural conditions.'
+ image: 'https://uwaterloo.ca/ecology-lab/sites/ca.ecology-lab/files/styles/thumbnail/public/june_10.jpg?itok=rZoYiTP_'
+ 13:
+ -
+ link: 'https://uwaterloo.ca'
+ headline: 'This is a headline.'
+ content: 'A total of 10 males and 1 female Cecropia Moths have emerged, which is a stark contrast to the sex ratio of the Polyphemus moths. I will attempt to mate the female tonight using the same method as the Polyphemus moths. I will also be releasing the males tonight, but I have tagged them with small stickers to prevent inbreeding should they find their way back to the female through her pheromones.'
+ image: 'https://uwaterloo.ca/ecology-lab/sites/ca.ecology-lab/files/styles/thumbnail/public/june_13.jpg?itok=-TIDW7D8'
+ 16:
+ -
+ link: 'https://uwaterloo.ca'
+ headline: 'This is a headline.'
+ content: 'Successfully mated a Cecropia moth at 2:40 am on June16th, and over the next 2 days she laid 153 eggs into a paper bag. However, she presented odd behaviour while laying eggs, and laid thick bundles of 10-20 eggs on her legs rather than on the bag. Usually a female will lay groups of 3 eggs randomly, and never on her own body. I removed them from her and pulled apart the eggs before the substrate used to stick eggs to leaves completely dried. However I do not know if I have accidentally damaged any eggs in the process, despite my carefulness. This will be interesting to observe once the caterpillars begin to hatch in 10-14 days. '
+ image: 'https://uwaterloo.ca/ecology-lab/sites/ca.ecology-lab/files/styles/thumbnail/public/june_16.jpg?itok=18idxfuY'
+
+ 7:
+ 8:
+ -
+ link: 'https://uwaterloo.ca'
+ headline: 'This is a headline.'
+ content: 'The Polyphemus moths have begun to emerge from their cocoons - 7 females and 2 males emerge in one day. I put the females into 3 separate mating boxes and leave them by an open window so that they can release their pheromones. By 1 am, they have called in a couple of male moths. I mate two of the females with wild males.'
+ 9:
+ -
+ link: 'https://uwaterloo.ca'
+ headline: 'This is a headline.'
+ content: 'I release all the moths except one of the pregnant Polyphemus moths which I keep in a paper bag to lay her eggs.'
+ image: 'https://uwaterloo.ca/ecology-lab/sites/ca.ecology-lab/files/styles/thumbnail/public/june_9.jpg?itok=9i7qSooF'
+ 10:
+ -
+ link: 'https://uwaterloo.ca'
+ headline: 'This is a headline.'
+ content: 'The female Polyphemus has laid a total of 103 eggs. Half of these eggs are now in the Ecology Lab under modified temperature and humidity conditions. As a control measure, the other half of the eggs have been placed in a natural area, their habitat was not modified in any way so that they are subject to natural conditions.'
+ image: 'https://uwaterloo.ca/ecology-lab/sites/ca.ecology-lab/files/styles/thumbnail/public/june_10.jpg?itok=rZoYiTP_'
+ 13:
+ -
+ link: 'https://uwaterloo.ca'
+ headline: 'This is a headline.'
+ content: 'A total of 10 males and 1 female Cecropia Moths have emerged, which is a stark contrast to the sex ratio of the Polyphemus moths. I will attempt to mate the female tonight using the same method as the Polyphemus moths. I will also be releasing the males tonight, but I have tagged them with small stickers to prevent inbreeding should they find their way back to the female through her pheromones.'
+ image: 'https://uwaterloo.ca/ecology-lab/sites/ca.ecology-lab/files/styles/thumbnail/public/june_13.jpg?itok=-TIDW7D8'
+ 16:
+ -
+ link: 'https://uwaterloo.ca'
+ headline: 'This is a headline.'
+ content: 'Successfully mated a Cecropia moth at 2:40 am on June16th, and over the next 2 days she laid 153 eggs into a paper bag. However, she presented odd behaviour while laying eggs, and laid thick bundles of 10-20 eggs on her legs rather than on the bag. Usually a female will lay groups of 3 eggs randomly, and never on her own body. I removed them from her and pulled apart the eggs before the substrate used to stick eggs to leaves completely dried. However I do not know if I have accidentally damaged any eggs in the process, despite my carefulness. This will be interesting to observe once the caterpillars begin to hatch in 10-14 days. '
+ image: 'https://uwaterloo.ca/ecology-lab/sites/ca.ecology-lab/files/styles/thumbnail/public/june_16.jpg?itok=18idxfuY'
+
+ 8:
+ 8:
+ -
+ link: 'https://uwaterloo.ca'
+ headline: 'This is a headline.'
+ content: 'The Polyphemus moths have begun to emerge from their cocoons - 7 females and 2 males emerge in one day. I put the females into 3 separate mating boxes and leave them by an open window so that they can release their pheromones. By 1 am, they have called in a couple of male moths. I mate two of the females with wild males.'
+ 9:
+ -
+ link: 'https://uwaterloo.ca'
+ headline: 'This is a headline.'
+ content: 'I release all the moths except one of the pregnant Polyphemus moths which I keep in a paper bag to lay her eggs.'
+ image: 'https://uwaterloo.ca/ecology-lab/sites/ca.ecology-lab/files/styles/thumbnail/public/june_9.jpg?itok=9i7qSooF'
+ 10:
+ -
+ link: 'https://uwaterloo.ca'
+ headline: 'This is a headline.'
+ content: 'The female Polyphemus has laid a total of 103 eggs. Half of these eggs are now in the Ecology Lab under modified temperature and humidity conditions. As a control measure, the other half of the eggs have been placed in a natural area, their habitat was not modified in any way so that they are subject to natural conditions.'
+ image: 'https://uwaterloo.ca/ecology-lab/sites/ca.ecology-lab/files/styles/thumbnail/public/june_10.jpg?itok=rZoYiTP_'
+ 13:
+ -
+ link: 'https://uwaterloo.ca'
+ headline: 'This is a headline.'
+ content: 'A total of 10 males and 1 female Cecropia Moths have emerged, which is a stark contrast to the sex ratio of the Polyphemus moths. I will attempt to mate the female tonight using the same method as the Polyphemus moths. I will also be releasing the males tonight, but I have tagged them with small stickers to prevent inbreeding should they find their way back to the female through her pheromones.'
+ image: 'https://uwaterloo.ca/ecology-lab/sites/ca.ecology-lab/files/styles/thumbnail/public/june_13.jpg?itok=-TIDW7D8'
+ 16:
+ -
+ link: 'https://uwaterloo.ca'
+ headline: 'This is a headline.'
+ content: 'Successfully mated a Cecropia moth at 2:40 am on June16th, and over the next 2 days she laid 153 eggs into a paper bag. However, she presented odd behaviour while laying eggs, and laid thick bundles of 10-20 eggs on her legs rather than on the bag. Usually a female will lay groups of 3 eggs randomly, and never on her own body. I removed them from her and pulled apart the eggs before the substrate used to stick eggs to leaves completely dried. However I do not know if I have accidentally damaged any eggs in the process, despite my carefulness. This will be interesting to observe once the caterpillars begin to hatch in 10-14 days. '
+ image: 'https://uwaterloo.ca/ecology-lab/sites/ca.ecology-lab/files/styles/thumbnail/public/june_16.jpg?itok=18idxfuY'
+
+ 1967:
+ 1:
+ 8:
+ -
+ link: 'https://uwaterloo.ca'
+ headline: 'This is a headline.'
+ content: 'The Polyphemus moths have begun to emerge from their cocoons - 7 females and 2 males emerge in one day. I put the females into 3 separate mating boxes and leave them by an open window so that they can release their pheromones. By 1 am, they have called in a couple of male moths. I mate two of the females with wild males.'
+ 9:
+ -
+ link: 'https://uwaterloo.ca'
+ headline: 'This is a headline.'
+ content: 'I release all the moths except one of the pregnant Polyphemus moths which I keep in a paper bag to lay her eggs.'
+ image: 'https://uwaterloo.ca/ecology-lab/sites/ca.ecology-lab/files/styles/thumbnail/public/june_9.jpg?itok=9i7qSooF'
+ 10:
+ -
+ link: 'https://uwaterloo.ca'
+ headline: 'This is a headline.'
+ content: 'The female Polyphemus has laid a total of 103 eggs. Half of these eggs are now in the Ecology Lab under modified temperature and humidity conditions. As a control measure, the other half of the eggs have been placed in a natural area, their habitat was not modified in any way so that they are subject to natural conditions.'
+ image: 'https://uwaterloo.ca/ecology-lab/sites/ca.ecology-lab/files/styles/thumbnail/public/june_10.jpg?itok=rZoYiTP_'
+ 13:
+ -
+ link: 'https://uwaterloo.ca'
+ headline: 'This is a headline.'
+ content: 'A total of 10 males and 1 female Cecropia Moths have emerged, which is a stark contrast to the sex ratio of the Polyphemus moths. I will attempt to mate the female tonight using the same method as the Polyphemus moths. I will also be releasing the males tonight, but I have tagged them with small stickers to prevent inbreeding should they find their way back to the female through her pheromones.'
+ image: 'https://uwaterloo.ca/ecology-lab/sites/ca.ecology-lab/files/styles/thumbnail/public/june_13.jpg?itok=-TIDW7D8'
+ 16:
+ -
+ link: 'https://uwaterloo.ca'
+ headline: 'This is a headline.'
+ content: 'Successfully mated a Cecropia moth at 2:40 am on June16th, and over the next 2 days she laid 153 eggs into a paper bag. However, she presented odd behaviour while laying eggs, and laid thick bundles of 10-20 eggs on her legs rather than on the bag. Usually a female will lay groups of 3 eggs randomly, and never on her own body. I removed them from her and pulled apart the eggs before the substrate used to stick eggs to leaves completely dried. However I do not know if I have accidentally damaged any eggs in the process, despite my carefulness. This will be interesting to observe once the caterpillars begin to hatch in 10-14 days. '
+ image: 'https://uwaterloo.ca/ecology-lab/sites/ca.ecology-lab/files/styles/thumbnail/public/june_16.jpg?itok=18idxfuY'
+ 2:
+ 8:
+ -
+ link: 'https://uwaterloo.ca'
+ headline: 'This is a headline.'
+ content: 'The Polyphemus moths have begun to emerge from their cocoons - 7 females and 2 males emerge in one day. I put the females into 3 separate mating boxes and leave them by an open window so that they can release their pheromones. By 1 am, they have called in a couple of male moths. I mate two of the females with wild males.'
+ 9:
+ -
+ link: 'https://uwaterloo.ca'
+ headline: 'This is a headline.'
+ content: 'I release all the moths except one of the pregnant Polyphemus moths which I keep in a paper bag to lay her eggs.'
+ image: 'https://uwaterloo.ca/ecology-lab/sites/ca.ecology-lab/files/styles/thumbnail/public/june_9.jpg?itok=9i7qSooF'
+ 10:
+ -
+ link: 'https://uwaterloo.ca'
+ headline: 'This is a headline.'
+ content: 'The female Polyphemus has laid a total of 103 eggs. Half of these eggs are now in the Ecology Lab under modified temperature and humidity conditions. As a control measure, the other half of the eggs have been placed in a natural area, their habitat was not modified in any way so that they are subject to natural conditions.'
+ image: 'https://uwaterloo.ca/ecology-lab/sites/ca.ecology-lab/files/styles/thumbnail/public/june_10.jpg?itok=rZoYiTP_'
+ 13:
+ -
+ link: 'https://uwaterloo.ca'
+ headline: 'This is a headline.'
+ content: 'A total of 10 males and 1 female Cecropia Moths have emerged, which is a stark contrast to the sex ratio of the Polyphemus moths. I will attempt to mate the female tonight using the same method as the Polyphemus moths. I will also be releasing the males tonight, but I have tagged them with small stickers to prevent inbreeding should they find their way back to the female through her pheromones.'
+ image: 'https://uwaterloo.ca/ecology-lab/sites/ca.ecology-lab/files/styles/thumbnail/public/june_13.jpg?itok=-TIDW7D8'
+ 16:
+ -
+ link: 'https://uwaterloo.ca'
+ headline: 'This is a headline.'
+ content: 'Successfully mated a Cecropia moth at 2:40 am on June16th, and over the next 2 days she laid 153 eggs into a paper bag. However, she presented odd behaviour while laying eggs, and laid thick bundles of 10-20 eggs on her legs rather than on the bag. Usually a female will lay groups of 3 eggs randomly, and never on her own body. I removed them from her and pulled apart the eggs before the substrate used to stick eggs to leaves completely dried. However I do not know if I have accidentally damaged any eggs in the process, despite my carefulness. This will be interesting to observe once the caterpillars begin to hatch in 10-14 days. '
+ image: 'https://uwaterloo.ca/ecology-lab/sites/ca.ecology-lab/files/styles/thumbnail/public/june_16.jpg?itok=18idxfuY'
+ 1968:
+ 2:
+ 8:
+ -
+ link: 'https://uwaterloo.ca'
+ headline: 'This is a headline.'
+ content: 'The Polyphemus moths have begun to emerge from their cocoons - 7 females and 2 males emerge in one day. I put the females into 3 separate mating boxes and leave them by an open window so that they can release their pheromones. By 1 am, they have called in a couple of male moths. I mate two of the females with wild males.'
+ 9:
+ -
+ link: 'https://uwaterloo.ca'
+ headline: 'This is a headline.'
+ content: 'I release all the moths except one of the pregnant Polyphemus moths which I keep in a paper bag to lay her eggs.'
+ image: 'https://uwaterloo.ca/ecology-lab/sites/ca.ecology-lab/files/styles/thumbnail/public/june_9.jpg?itok=9i7qSooF'
+ 10:
+ -
+ link: 'https://uwaterloo.ca'
+ headline: 'This is a headline.'
+ content: 'The female Polyphemus has laid a total of 103 eggs. Half of these eggs are now in the Ecology Lab under modified temperature and humidity conditions. As a control measure, the other half of the eggs have been placed in a natural area, their habitat was not modified in any way so that they are subject to natural conditions.'
+ image: 'https://uwaterloo.ca/ecology-lab/sites/ca.ecology-lab/files/styles/thumbnail/public/june_10.jpg?itok=rZoYiTP_'
+ 13:
+ -
+ link: 'https://uwaterloo.ca'
+ headline: 'This is a headline.'
+ content: 'A total of 10 males and 1 female Cecropia Moths have emerged, which is a stark contrast to the sex ratio of the Polyphemus moths. I will attempt to mate the female tonight using the same method as the Polyphemus moths. I will also be releasing the males tonight, but I have tagged them with small stickers to prevent inbreeding should they find their way back to the female through her pheromones.'
+ image: 'https://uwaterloo.ca/ecology-lab/sites/ca.ecology-lab/files/styles/thumbnail/public/june_13.jpg?itok=-TIDW7D8'
+ 16:
+ -
+ link: 'https://uwaterloo.ca'
+ headline: 'This is a headline.'
+ content: 'Successfully mated a Cecropia moth at 2:40 am on June16th, and over the next 2 days she laid 153 eggs into a paper bag. However, she presented odd behaviour while laying eggs, and laid thick bundles of 10-20 eggs on her legs rather than on the bag. Usually a female will lay groups of 3 eggs randomly, and never on her own body. I removed them from her and pulled apart the eggs before the substrate used to stick eggs to leaves completely dried. However I do not know if I have accidentally damaged any eggs in the process, despite my carefulness. This will be interesting to observe once the caterpillars begin to hatch in 10-14 days. '
+ image: 'https://uwaterloo.ca/ecology-lab/sites/ca.ecology-lab/files/styles/thumbnail/public/june_16.jpg?itok=18idxfuY'