expand.html

<style>
.rotate{
    -moz-transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.rotate.down{
    -ms-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
}

</style>

<div class="expand pv3">
    <div class="gray" style="cursor: pointer;" onclick="$h = $(this);$h.children('i').toggleClass('down');$h.next('div').slideToggle(300);">
        <i class="fas fa-chevron-right rotate black-10"></i>
        <span>
        {{$expandMessage := T "Expand-title"}}
    	{{ if .IsNamedParams }}
    	{{.Get "default" | default $expandMessage}}
    	{{else}}
    	{{.Get 0 | default $expandMessage}}
    	{{end}}
    	</span>
    </div>
    <div class="bg-black-05 br2 ph3 pv1" style="display: none;">
        {{ .Inner | markdownify | safeHTML }}
    </div>
</div>