Genius/hextra
1
0
Fork 0
forked from drowl87/hextra_mirror
Code Pull Requests Activity

fix: tabs styling in steps shortcode (#440)

Browse Source 
* fix: tabs styling in steps shortcode

* docs: add notes for intended usage
This commit is contained in:
Xin 2024-08-18 15:38:06 +01:00 committed by GitHub
parent 2863a3a029
commit 526be88d7b
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 14 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
exampleSite/content/docs/guide/shortcodes/steps.md
View File

@ -25,6 +25,11 @@ This is the third step.
## Usage
{{< callout emoji="ℹ️" >}}
Please note that this shortcode is intended **only for Markdown content**.
If you put HTML content or other shortcodes as step content, it may not render as expected.
{{< /callout >}}
Put Markdown h3 header within `steps` shortcode.
```

7
layouts/shortcodes/tab.html
View File

@ -4,8 +4,9 @@
class="hextra-tabs-panel hx-rounded hx-pt-6 hx-hidden data-[state=selected]:hx-block"
id="tabs-panel-{{ .Ordinal }}"
role="tabpanel"
{{ if eq .Ordinal $defaultIndex }}tabindex="0"{{ end }}
{{ if eq .Ordinal $defaultIndex }}data-state="selected"{{ end }}
{{- if eq .Ordinal $defaultIndex }} tabindex="0" {{ end -}}
{{- if eq .Ordinal $defaultIndex }} data-state="selected" {{ end -}}
>
{{ .InnerDeindent | markdownify }}
{{- .InnerDeindent | markdownify -}}
</div>
{{- /* Drop trailing newlines */ -}}

9
layouts/shortcodes/tabs.html
View File

@ -13,9 +13,9 @@
role="tab"
type="button"
aria-controls="tabs-panel-{{ $i }}"
{{ if eq $i $defaultIndex }}aria-selected="true"{{ end }}
{{ if eq $i $defaultIndex }}tabindex="0"{{ end }}
{{ if eq $i $defaultIndex }}data-state="selected"{{ end }}
{{- if eq $i $defaultIndex }} aria-selected="true" {{ end -}}
{{- if eq $i $defaultIndex }} tabindex="0" {{ end -}}
{{- if eq $i $defaultIndex }} data-state="selected"{{ end -}}
>
{{- $item -}}
</button>
@ -23,5 +23,6 @@
</div>
</div>
<div>
{{ .Inner }}
{{- .Inner -}}
</div>
{{- /* Drop trailing newlines */ -}}