From e1e5407c74540efa50277cec30dd3a0a38271e91 Mon Sep 17 00:00:00 2001
From: madrilene <hola@lenesaile.com>
Date: Mon, 5 Feb 2024 09:15:48 +0100
Subject: [PATCH] details

---
 src/assets/css/blocks/details.css | 47 +++++++++++++++++++++++++++++++
 src/docs/first.md                 |  1 +
 2 files changed, 48 insertions(+)
 create mode 100644 src/assets/css/blocks/details.css

diff --git a/src/assets/css/blocks/details.css b/src/assets/css/blocks/details.css
new file mode 100644
index 0000000..d82060c
--- /dev/null
+++ b/src/assets/css/blocks/details.css
@@ -0,0 +1,47 @@
+summary {
+grid-column: content;
+}
+
+summary {
+  display: flex;
+  align-items: baseline;
+  line-height: 1.2;
+  gap: 0 1ch;
+  cursor: pointer;
+  list-style: none;
+	font-weight: bold;
+	font-size: var(--size-step-1);
+}
+
+summary:hover,
+summary:focus-visible {
+  color: var(--color-primary-shade);
+}
+
+summary::before {
+  content: '+';
+  display: block;
+  color: var(--color-primary);
+	font-family: var(--font-mono);
+	font-size: var(--size-step-0);
+	font-weight: normal;
+  line-height: 0.5;
+  margin-inline-start: -2ch;
+  transform: scale(1.4);
+  transform-origin: right bottom;
+}
+
+[open] summary::before {
+  content: '-';
+}
+
+/* Hide default marker */
+summary::-webkit-details-marker,
+summary::marker {
+  content: '';
+  display: none;
+}
+
+summary + * {
+	margin-block-start: var(--space-xs)
+}
\ No newline at end of file
diff --git a/src/docs/first.md b/src/docs/first.md
index 4a0f72c..7f8c9ea 100644
--- a/src/docs/first.md
+++ b/src/docs/first.md
@@ -1,5 +1,6 @@
 ---
 title: First steps
+date: 2024-01-01
 ---
 
 You can use this starter as a template for your blog and you are ready to go! But there are some adjustments you have to make, most of them in `src/_data/meta.js`. It sets different "hard coded" text values all over the template, you can change the language, etc.