mirror of
https://github.com/McShelby/hugo-theme-relearn.git
synced 2024-11-23 07:47:54 +00:00
tabs: support color options #550
This commit is contained in:
Sören Weber
parent
aea9a54a08
commit
d68a80d1d4
4 changed files with 99 additions and 13 deletions
|
|
@ -1,5 +1,17 @@
|
|||
{{- $tabs := (slice | append (dict
|
||||
"color" .color
|
||||
"content" .content
|
||||
"icon" .icon
|
||||
"name" .name
|
||||
"style" .style
|
||||
"title" .title
|
||||
)) }}
|
||||
{{- partial "shortcodes/tabs.html" (dict
|
||||
"context" .context
|
||||
"color" ""
|
||||
"content" $tabs
|
||||
"groupid" ""
|
||||
"content" (slice | append (dict "name" (trim .name " ") "content" .content))
|
||||
"icon" ""
|
||||
"style" ""
|
||||
"title" ""
|
||||
) }}
|
||||
|
|
@ -1,24 +1,74 @@
|
|||
{{- $context := .context }}
|
||||
{{- $tabs := .content | default slice }}
|
||||
{{- $groupid := .groupid | default (partial "make-random-md5.hugo" $context) }}
|
||||
{{- $color := .color }}
|
||||
{{- $style := .style }}
|
||||
{{- $title := .title }}
|
||||
{{- $icon := .icon }}
|
||||
{{- $tabs := slice }}
|
||||
{{- range $tab := (.content | default slice) }}
|
||||
{{- if and (not $tab.title) $tab.name }}
|
||||
{{- warnf "%s: parameter 'name' is deprecated for shortcode 'tab', use 'title' instead" $context.File.Path }}
|
||||
{{- $tab = merge $tab (dict "title" .name) }}
|
||||
{{- end }}
|
||||
{{- with $tab }}
|
||||
{{- $color := .color | default $color }}
|
||||
{{- $style := .style | default $style | default (cond (ne .color "") "filled" "default") }}
|
||||
{{- $title := .title | default ($style | T) }}
|
||||
{{- $title = trim $title " " }}
|
||||
{{- $icon := .icon | default "" }}
|
||||
{{- if and (not $icon) (eq (len $icon) 0) }}
|
||||
{{- if eq $style "info" }}{{ $icon = default "info-circle" }}{{ end }}
|
||||
{{- if eq $style "warning" }}{{ $icon = default "exclamation-triangle" }}{{ end }}
|
||||
{{- if eq $style "note" }}{{ $icon = default "exclamation-circle" }}{{ end }}
|
||||
{{- if eq $style "tip" }}{{ $icon = default "lightbulb" }}{{ end }}
|
||||
{{- end }}
|
||||
{{- $icon = trim $icon " " }}
|
||||
{{- if and $icon (not (findRE ".*?\\bfa-\\w.*?" $icon)) }}
|
||||
{{- $icon = printf "fa-fw fas fa-%s" $icon }}
|
||||
{{- end }}
|
||||
{{- $tabs = $tabs | append (dict
|
||||
"color" $color
|
||||
"content" .content
|
||||
"icon" $icon
|
||||
"itemid" (printf "%s%s" ($title | $context.RenderString | plainify) ($icon | plainify))
|
||||
"style" $style
|
||||
"title" $title
|
||||
) }}
|
||||
{{- end }}
|
||||
{{- end }}
|
||||
{{- $color = .color | default "" }}
|
||||
{{- $style = .style | default (cond (ne .color "") "filled" "default") }}
|
||||
{{- $title = .title | default ($style | T) }}
|
||||
{{- $title = trim $title " " }}
|
||||
{{- $icon = .icon | default "" }}
|
||||
{{- if and (not $icon) (eq (len $icon) 0) }}
|
||||
{{- if eq $style "info" }}{{ $icon = default "info-circle" }}{{ end }}
|
||||
{{- if eq $style "warning" }}{{ $icon = default "exclamation-triangle" }}{{ end }}
|
||||
{{- if eq $style "note" }}{{ $icon = default "exclamation-circle" }}{{ end }}
|
||||
{{- if eq $style "tip" }}{{ $icon = default "lightbulb" }}{{ end }}
|
||||
{{- end }}
|
||||
{{- $icon = trim $icon " " }}
|
||||
{{- if and $icon (not (findRE ".*?\\bfa-\\w.*?" $icon)) }}
|
||||
{{- $icon = printf "fa-fw fas fa-%s" $icon }}
|
||||
{{- end }}
|
||||
{{- with $context }}
|
||||
<div class="tab-panel" data-tab-group="{{ $groupid }}">
|
||||
<div class="tab-nav">
|
||||
{{- range $idx, $tab := $tabs }}
|
||||
<button
|
||||
data-tab-item="{{ .name | $context.RenderString | plainify }}"
|
||||
class="tab-nav-button tab-panel-style cstyle default{{ cond (eq $idx 0) " active" ""}}"
|
||||
onclick="switchTab('{{ $groupid }}','{{ .name | $context.RenderString | plainify}}')"
|
||||
data-tab-item="{{ .itemid }}"
|
||||
class="tab-nav-button tab-panel-style cstyle {{ .style }}{{ cond (eq $idx 0) " active" ""}}"{{ if .color }} style="--VARIABLE-BOX-color: {{ .color }};"{{ end }}
|
||||
onclick="switchTab('{{ $groupid }}','{{ .itemid }}')"
|
||||
>
|
||||
<div><div>{{ .name | $context.RenderString }}</div></div>
|
||||
<div><div>{{ if .icon }}<i class="{{ .icon }}"></i>{{ end }}{{ if and .icon .title }} {{ end }}{{ .title | $context.RenderString }}{{ if (not .title) }}​{{ end }}</div></div>
|
||||
</button>
|
||||
{{- end }}
|
||||
</div>
|
||||
<div class="tab-content-container">
|
||||
{{- range $idx, $tab := $tabs }}
|
||||
<div
|
||||
data-tab-item="{{ .name | $context.RenderString | plainify }}"
|
||||
class="tab-content tab-panel-style cstyle default{{ cond (eq $idx 0) " active" ""}}">
|
||||
data-tab-item="{{ .itemid }}"
|
||||
class="tab-content tab-panel-style cstyle {{ .style }}{{ cond (eq $idx 0) " active" ""}}"{{ if .color }} style="--VARIABLE-BOX-color: {{ .color }};"{{ end }}>
|
||||
<div class="tab-content-text">
|
||||
{{ if ne "<" (substr (strings.TrimLeft " " .content) 0 1) }}<p>{{ end }}<!-- we add a DOM element here if there is none to make collapsing marings work -->
|
||||
{{ .content | safeHTML }}</div><!-- no line break allowed here because of awkward behavior of Hugo 110 or this theme when tag shortcode is called standalone outside of tags shortcode ? -->
|
||||
|
|
|
|||
|
|
@ -1,18 +1,33 @@
|
|||
{{- $_hugo_config := `{ "version": 1 }` }}
|
||||
{{- $color := (.Get "color") }}
|
||||
{{- $content := .Inner }}
|
||||
{{- $icon := (.Get "icon") }}
|
||||
{{- $name := (.Get "name") }}
|
||||
{{- $style := (.Get "style") }}
|
||||
{{- $title := (.Get "title") }}
|
||||
{{- $tabs := slice }}
|
||||
{{- if and .Parent (.Parent.Scratch.Get "tabs") }}
|
||||
{{- $tabs = .Parent.Scratch.Get "tabs" }}
|
||||
{{- end }}
|
||||
{{- $tabs = $tabs | append (dict "name" (trim $name " ") "content" $content) }}
|
||||
{{- $tabs = $tabs | append (dict
|
||||
"color" $color
|
||||
"content" $content
|
||||
"icon" $icon
|
||||
"name" $name
|
||||
"style" $style
|
||||
"title" $title
|
||||
) }}
|
||||
{{- if .Parent }}
|
||||
{{- $.Parent.Scratch.Set "tabs" $tabs }}
|
||||
{{- else }}
|
||||
{{- $c:=""}}{{/* if no containing tabs shortcode is present, we display this tab as single */}}
|
||||
{{- partial "shortcodes/tabs.html" (dict
|
||||
"context" .Page
|
||||
"groupid" ""
|
||||
"color" ""
|
||||
"content" $tabs
|
||||
"groupid" ""
|
||||
"icon" ""
|
||||
"style" ""
|
||||
"title" ""
|
||||
) }}
|
||||
{{- end }}
|
||||
|
|
@ -2,12 +2,21 @@
|
|||
{{- $version := split hugo.Version "." }}
|
||||
{{- $major := int (index $version 0) }}
|
||||
{{- $minor := int (index $version 1) }}
|
||||
{{- $groupid := ((.Get "groupid") | default ((.Get "groupId") | default "")) }}
|
||||
{{- $color := (.Get "color") }}
|
||||
{{- $groupid := (.Get "groupid") }}
|
||||
{{- if or (and (eq $major 0) (ge $minor 108)) (gt $major 0) }}
|
||||
{{- $groupid = $groupid | default "" }}
|
||||
{{- end }}
|
||||
{{- $icon := (.Get "icon") }}
|
||||
{{- $style := (.Get "style") }}
|
||||
{{- $title := (.Get "title") }}
|
||||
{{- $tabs := (.Scratch.Get "tabs") }}
|
||||
{{- partial "shortcodes/tabs.html" (dict
|
||||
"context" .Page
|
||||
"color" $color
|
||||
"content" $tabs
|
||||
"groupid" $groupid
|
||||
"content" (.Scratch.Get "tabs")
|
||||
"icon" $icon
|
||||
"style" $style
|
||||
"title" $title
|
||||
) }}
|
||||
Loading…
Reference in a new issue