Files
blog/layouts/shortcodes/tabs.html
2022-02-16 22:12:11 +01:00

25 lines
665 B
HTML

<div x-data="{ openTab: 0 }">
<nav class="flex p-1 space-x-1 bg-blue-900/20 rounded-md">
{{ $tabTotal := .Get "tabTotal" }}
{{ $tabName := .Scratch.Get "tabName" }}
{{ range $i, $sequence := (seq $tabTotal) }}
<button @click="openTab = {{ $i }}" class="w-full py-2.5 text-sm rounded-md focus:outline-none"
:class="openTab === {{ $i }} ? 'bg-primary-100 dark:bg-primary-900 shadow' : 'hover:bg-white/[0.12] hover:text-white'"
href="#">{{
(replaceRE "(\\s)" "" (index $tabName $i)) }}</button>
{{ end }}
</nav>
<div class="-mt-4">
{{ .Inner }}
</div>
</div>