tfcconnection/layouts/shortcodes/floating-button.html
Chris Cochrun be049e4536 add floating-button shortcode
This shortcode adds a floating button styled like other buttons in
this theme and allows you to move to the appropriate place on the page
or another link.
2023-03-21 17:20:35 -05:00

22 lines
900 B
HTML

{{ $icon := resources.Get (printf "icons/%s.svg" ($.Get "icon")) }}
{{ $text := .Get "text" -}}
{{ $link := .Get "link" -}}
<script>
function floatButton() {
document.getElementById("floatbutt").hidden = true;
window.location.href = '{{ $link }}';
}
</script>
<button 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 fixed bottom-4 right-8" type="button" name="floatbutt" onclick="floatButton()" id="floatbutt">
<i>{{ $text }}</i>
{{ if $icon }}
<span class="relative inline-block align-sub icon flex-auto">
{{ $icon.Content | safeHTML }}
</span>
{{ else }}
{{ errorf `[BLOWFISH] Shortcode "icon" error in "%s": Resource "%s" not found. Check the path is correct or remove the shortcode.` .Page.Path (printf "icons/%s.svg" ($.Get 0)) }}
{{ end }}
</button>