dbrun/blowfish
1
0
Fork 0
mirror of https://github.com/nunocoracao/blowfish.git synced 2026-01-30 16:31:52 +01:00
Code Issues Packages Projects Releases Wiki Activity

feat(tabs): support default tab

Browse Source
This commit is contained in:
ZhenShuo Leo
2026-01-02 17:29:00 +08:00
parent dbb7d3f7f2
commit 601bb87559
1 changed files with 21 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
layouts/shortcodes/tabs.html
View File

@@ -2,18 +2,28 @@
{{- $noop := .Inner -}}
{{- $group := .Get "group" -}}
{{- $default := .Get "default" -}}
<div class="tab__container w-full" {{ with $group }}data-tab-group="{{ . }}"{{ end }}>
<div
class="tab__container w-full"
{{ with $group }}data-tab-group="{{ . }}"{{ end }}
{{ with $default }}data-default-tab="{{ . }}"{{ end }}>
<div class="tab__nav" role="tablist">
<div class="flex gap-1 overflow-x-auto">
{{- range $nTabs, $_ := .Store.Get "tabs" -}}
{{- $isActive := false -}}
{{- if $default -}}
{{- $isActive = eq $default (index . "label") -}}
{{- else -}}
{{- $isActive = eq $nTabs 0 -}}
{{- end -}}
<button
class="tab__button px-3 py-2 text-sm font-semibold border-b-2 border-transparent rounded-t-md hover:bg-neutral-200 dark:hover:bg-neutral-700 {{ if eq $nTabs 0 }}
class="tab__button px-3 py-2 text-sm font-semibold border-b-2 border-transparent rounded-t-md hover:bg-neutral-200 dark:hover:bg-neutral-700 {{ if $isActive -}}
tab--active
{{ end }}"
{{- end }}"
role="tab"
aria-selected="{{ cond (eq $nTabs 0) "true" "false" }}"
aria-selected="{{ cond $isActive `true` `false` }}"
data-tab-index="{{ $nTabs }}"
data-tab-label="{{ index . "label" }}">
<span class="flex items-center gap-1">
@@ -28,7 +38,13 @@
</div>
<div class="tab__content mt-4">
{{- range $nTabs, $_ := .Store.Get "tabs" -}}
<div class="tab__panel {{ if eq $nTabs 0 }}tab--active{{ end }}" data-tab-index="{{ $nTabs }}">
{{- $isActive := false -}}
{{- if $default -}}
{{- $isActive = eq $default (index . "label") -}}
{{- else -}}
{{- $isActive = eq $nTabs 0 -}}
{{- end -}}
<div class="tab__panel {{ if $isActive }}tab--active{{ end }}" data-tab-index="{{ $nTabs }}">
{{ index . "content" }}
</div>
{{- end -}}