From e7d8ece65d4888574da79e0de6e99401a806d396 Mon Sep 17 00:00:00 2001 From: Nikolaos Karaolidis Date: Sun, 14 Sep 2025 11:17:14 +0100 Subject: [PATCH] Add summary animation Signed-off-by: Nikolaos Karaolidis --- assets/sass/blockquote.scss | 2 +- assets/sass/common.scss | 32 +++++++++++++++++++++++++++++++ layouts/_shortcodes/contents.html | 5 +++++ 3 files changed, 38 insertions(+), 1 deletion(-) create mode 100644 layouts/_shortcodes/contents.html diff --git a/assets/sass/blockquote.scss b/assets/sass/blockquote.scss index 5e3799e..322057b 100644 --- a/assets/sass/blockquote.scss +++ b/assets/sass/blockquote.scss @@ -12,7 +12,7 @@ blockquote { } p { - margin: 0 0 0.5rem 0; + margin: 0.5rem 0 0.5rem 0; } p:last-child { diff --git a/assets/sass/common.scss b/assets/sass/common.scss index 004a6a8..811bab6 100644 --- a/assets/sass/common.scss +++ b/assets/sass/common.scss @@ -62,3 +62,35 @@ p { li { margin: 0.5rem 0 0.5rem 0; } + +details { + background-color: var(--background-50); + padding: 1rem 1.5rem 1rem 1.5rem; + border-radius: 0.5rem; + + p { + margin: 0.5rem 0 0.5rem 0; + } + + summary { + margin: 0.5rem; + font-weight: bold; + display: inline-flex; + align-items: center; + gap: 0.5rem; + cursor: pointer; + } + + summary::before { + content: ''; + border-width: 0.4rem; + border-style: solid; + border-color: transparent transparent transparent var(--text); + transition: transform 0.3s ease; + transform-origin: 25% 50%; + } + + &[open] summary::before { + transform: rotate(90deg); + } +} diff --git a/layouts/_shortcodes/contents.html b/layouts/_shortcodes/contents.html new file mode 100644 index 0000000..5d66adf --- /dev/null +++ b/layouts/_shortcodes/contents.html @@ -0,0 +1,5 @@ +
+ Post Contents + {{ .Page.TableOfContents }} +
+{{- /* chomp trailing newline */ -}}