Files
hugo/layouts/shortcodes/code-toggle.html
T
Anthony Fok 650fac3a4e Squashed 'themes/gohugoioTheme/' changes from a1768ebb..f31a3dc8
f31a3dc8 Fix problem where non-ASCII menu links cannot be triggered
e1cff357 Add eSolia as new sponsor
cfedbdde Adjust gray color of tab vs pane in code-toggle.
d9ba8d66 Rebuild Chroma CSS
22ec76a4 Add code toggler
cf139e3a Merge commit '7ae9cf2ccb3eecc1ff50f686925249d01cf37c6c'
c03ab1e9 Revert "Anchorify headings up to h4"
de01837f Anchorify headings up to h4

git-subtree-dir: themes/gohugoioTheme
git-subtree-split: f31a3dc8b65e76e8827caf1ad998404e933314d0
2018-05-03 16:47:11 -06:00

25 lines
1.2 KiB
HTML

{{ $langs := (slice "yaml" "toml" "json") }}
<div class="code relative" {{ with .Get "file" }}id="{{ . | urlize}}"{{ end }}>
<div class="code-nav flex flex-nowrap items-stretch">
{{- with .Get "file" -}}
<div class="san-serif f6 dib lh-solid pl2 pv2 mr2">{{ . }}.</div>
{{- end -}}
{{ range $langs }}
<button data-toggle-tab="{{ . }}" class="tab-button {{ cond (eq . "yaml") "active" ""}} ba san-serif f6 dib lh-solid ph2 pv2">{{ . }}</button>&nbsp;
{{ end }}
</div>
<div class="tab-content">
{{ range $langs }}
<div data-pane="{{ . }}" class="code-copy-content nt3 tab-pane {{ cond (eq . "yaml") "active" ""}}">
{{ highlight ($.Inner | transform.Remarshal . | safeHTML) . ""}}
</div>
{{ if ne ($.Get "copy") "false" }}
<button class="needs-js copy copy-toggle bg-accent-color-dark f6 absolute top-0 right-0 lh-solid hover-bg-primary-color-dark bn white ph3 pv2" title="Copy this code to your clipboard." data-clipboard-action="copy" aria-label="copy button">
</button>
{{/* Functionality located within filesaver.js The copy here is located in the css with .copy class so it can be replaced with JS on success */}}
{{end}}
{{ end }}
</div>
</div>