typeit isn't working

This commit is contained in:
Chris Cochrun 2025-05-20 23:29:29 -05:00
parent b62229a693
commit bae61d7968
5 changed files with 30 additions and 50 deletions

View file

@ -321,5 +321,6 @@
{% endif %}
{% block extra_js %}
{% endblock extra_js %}
</body>
</html>

View file

@ -0,0 +1,8 @@
<a
class="!rounded-md bg-primary-600 px-4 py-2 !text-neutral !no-underline hover:!bg-primary-500 dark:bg-primary-800 dark:hover:!bg-primary-700"
{% if href %}href="{{ href }}"{% endif %}
{% if target %}target="{{ target }}"{% endif %}
role="button"
>
{{ body }}
</a>

View file

@ -1,37 +1,19 @@
{{- $content := split .Inner "\n" -}}
{{- $initialString := .Get "initialString" | default "" -}}
{{- $speed := .Get "speed" | default 100 -}}
{{- $lifeLike := .Get "lifeLike" | default false -}}
{{- $startDelay := .Get "startDelay" | default 0 -}}
{{- $breakLines := .Get "breakLines" | default true -}}
{{- $waitUntilVisible := .Get "waitUntilVisible" | default true -}}
{{- $loop := .Get "loop" | default false -}}
{% set id = "typeit-{% get_random(0, 100) %}" %}
{{- $classList := slice -}}
{{- with .Get "class" -}}
{{- $classList = $classList | append . -}}
{{- end -}}
{{- $tag := .Get "tag" | default "div" -}}
{{ $id := delimit (slice "typeit" .Ordinal now.UnixNano) "-" }}
{{- $attrs := printf `id="%v"` $id -}}
{{- with $classList -}}
{{- $attrs = delimit $classList " " | printf `%v class="%v"` $attrs -}}
{{- end -}}
{{ printf `<%v %v>%s</%v>` $tag $attrs $initialString $tag | safeHTML }}
<script src="https://unpkg.com/typeit@8.7.1/dist/index.umd.js"></script>
<h2 id="type">{{ body }}</h2>
<script>
console.log("type");
document.addEventListener("DOMContentLoaded", function () {
new TypeIt("#{{ $id }}", {
strings: {{ $content }},
speed: {{ $speed }},
lifeLike: {{ $lifeLike }},
startDelay: {{ $startDelay }},
breakLines: {{ $breakLines }},
waitUntilVisible: {{ $waitUntilVisible }},
loop: {{ $loop }}
new TypeIt("#type", {
strings: {{ body }},
speed: 100,
lifeLike: true,
startDelay: 0,
breakLines: true,
waitUntilVisible: true,
loop: false
}).go();
});
</script>
</script>