From 4c41e477e13d37e187c8de4225c7e8056bd9ed28 Mon Sep 17 00:00:00 2001 From: Martin Kagamino Lehoux Date: Mon, 29 Sep 2025 19:17:13 +0200 Subject: Internalise theme --- layouts/shortcodes/details.html | 75 +++++++++++++++++++++++++++++++++++++++++ 1 file changed, 75 insertions(+) create mode 100644 layouts/shortcodes/details.html (limited to 'layouts/shortcodes/details.html') diff --git a/layouts/shortcodes/details.html b/layouts/shortcodes/details.html new file mode 100644 index 0000000..ca524f7 --- /dev/null +++ b/layouts/shortcodes/details.html @@ -0,0 +1,75 @@ +{{- /* +Renders an HTML details element. + +@param {string} [class] The value of the element's class attribute. +@param {string} [name] The value of the element's name attribute. +@param {string} [summary] The content of the child summary element. +@param {string} [title] The value of the element's title attribute. +@param {bool} [open=false] Whether to initially display the content of the details element. + +@reference https://developer.mozilla.org/en-US/docs/Web/HTML/Element/details + +@examples + + {{< details >}} + A basic collapsible section. + {{< /details >}} + + {{< details summary="Custom Summary Text" >}} + Showing custom `summary` text. + {{< /details >}} + + {{< details summary="Open Details" open=true >}} + Contents displayed initially by using `open`. + {{< /details >}} + + {{< details summary="Styled Content" class="my-custom-class" >}} + Content can be styled with CSS by specifying a `class`. + + Target details element: + + ```css + details.my-custom-class { } + ``` + + Target summary element: + + ```css + details.my-custom-class > summary > * { } + ``` + + Target inner content: + + ```css + details.my-custom-class > :not(summary) { } + ``` + {{< /details >}} + + {{< details summary="Grouped Details" name="my-details" >}} + Specifying a `name` allows elements to be connected, with only one able to be open at a time. + {{< /details >}} + +*/}} + +{{- /* Get arguments. */}} +{{- $class := or (.Get "class") "" }} +{{- $name := or (.Get "name") "" }} +{{- $summary := or (.Get "summary") "Details" }} +{{- $title := or (.Get "title") "" }} +{{- $open := false }} +{{- if in (slice "false" false 0) (.Get "open") }} + {{- $open = false }} +{{- else if in (slice "true" true 1) (.Get "open") }} + {{- $open = true }} +{{- end }} + +{{- /* Render. */}} +
+ {{ $summary | .Page.RenderString }} + {{ .Inner | .Page.RenderString (dict "display" "block") -}} +
\ No newline at end of file -- cgit v1.3