Here is the section I use specifically for annotations, it is pretty much @mgmeyers template but with the added benefit of working with @Chetachi Highlightr plugin:
## Annotations
{% persist "annotations" %}
{% set annots = annotations | filterby("date", "dateafter", lastImportDate) -%}
{% if annots.length > 0 %}
{% for annot in annots -%}
{%- if annot.annotatedText %}
- <mark style="background: {{annot.color}}">{{annot.annotatedText | nl2br}} </mark>
{%- endif -%}
{%- if annot.imageRelativePath %}
![[{{annot.imageRelativePath}}]]
{%- endif %}
{%- if annot.comment %}
>[!annot] Comment
>{{annot.comment | nl2br}}
{%- endif %}
{%- endfor %}
{%- endif %}
{%- endpersist %}
It pulls the color hex code from the annotation data and uses that to determine the highlight color. I think you need css-inline enabled in Highlightr to use this.
So you get something that looks like this:
Sidenote: I noticed that any document with pen annotations, like handwritten notes from using an apple pencil on the zotero ios app, will completely fail to import. Is this a known issue? If not, is there somewhere I should post about this?