From eed8d6b0744ffedd1f83941003681f193b97b546 Mon Sep 17 00:00:00 2001
From: Wahyu Wiyoko <111651479+wahyuwiyoko@users.noreply.github.com>
Date: Sun, 21 Aug 2022 23:21:35 +0800
Subject: [PATCH 1/4] Improve details and change background to background-color

---
 simple.css | 34 ++++++++++++++++------------------
 1 file changed, 16 insertions(+), 18 deletions(-)

diff --git a/simple.css b/simple.css
index 7f96f2b..ea1fe97 100644
--- a/simple.css
+++ b/simple.css
@@ -64,7 +64,7 @@ html {
 /* Make the body a nice central block */
 body {
   color: var(--text);
-  background: var(--bg);
+  background-color: var(--bg);
   font-size: 1.15rem;
   line-height: 1.5;
   display: grid;
@@ -77,7 +77,7 @@ body > * {
 
 /* Make the header bg full width, but the content inline with body */
 body > header {
-  background: var(--accent-bg);
+  background-color: var(--accent-bg);
   border-bottom: 1px solid var(--border);
   text-align: center;
   padding: 0 0.5rem 2rem 0.5rem;
@@ -184,7 +184,7 @@ input[type="button"],
 label[type="button"] {
   border: none;
   border-radius: 5px;
-  background: var(--accent);
+  background-color: var(--accent);
   font-size: 1rem;
   color: var(--bg);
   padding: 0.7rem 0.9rem;
@@ -290,7 +290,7 @@ header > nav a:hover {
 
 /* Consolidate box styling */
 aside, details, pre, progress {
-  background: var(--accent-bg);
+  background-color: var(--accent-bg);
   border: 1px solid var(--border);
   border-radius: 5px;
   margin-bottom: 1rem;
@@ -344,14 +344,13 @@ section:last-child {
   padding-bottom: 0;
 }
 
-summary {
-  cursor: pointer;
-  font-weight: bold;
+details {
   padding: 0.6rem 1rem;
 }
 
-details[open] {
-  padding: 0.6rem 1rem 0.75rem 1rem;
+summary {
+  cursor: pointer;
+  font-weight: bold;
 }
 
 details[open] summary + * {
@@ -360,7 +359,6 @@ details[open] summary + * {
 
 details[open] summary {
   margin-bottom: 0.5rem;
-  padding: 0;
 }
 
 details[open] > :last-child {
@@ -384,13 +382,13 @@ th {
 }
 
 th {
-  background: var(--accent-bg);
+  background-color: var(--accent-bg);
   font-weight: bold;
 }
 
 tr:nth-child(even) {
   /* Set every other cell slightly darker. Improves readability. */
-  background: var(--accent-bg);
+  background-color: var(--accent-bg);
 }
 
 table caption {
@@ -407,7 +405,7 @@ input {
   padding: 0.5rem;
   margin-bottom: 0.5rem;
   color: var(--text);
-  background: var(--bg);
+  background-color: var(--bg);
   border: 1px solid var(--border);
   border-radius: 5px;
   box-shadow: none;
@@ -444,7 +442,7 @@ input[type="radio"] {
 
 input[type="checkbox"]:checked,
 input[type="radio"]:checked {
-  background: var(--accent);
+  background-color: var(--accent);
 }
 
 input[type="checkbox"]:checked::after {
@@ -456,7 +454,7 @@ input[type="checkbox"]:checked::after {
   position: absolute;
   top: 0.05em;
   left: 0.17em;
-  background: transparent;
+  background-color: transparent;
   border-right: solid var(--bg) 0.08em;
   border-bottom: solid var(--bg) 0.08em;
   font-size: 1.8em;
@@ -470,7 +468,7 @@ input[type="radio"]:checked::after {
   border-radius: 100%;
   position: absolute;
   top: 0.125em;
-  background: var(--bg);
+  background-color: var(--bg);
   left: 0.125em;
   font-size: 32px;
 }
@@ -511,7 +509,7 @@ hr {
 mark {
   padding: 2px 5px;
   border-radius: 4px;
-  background: var(--marked);
+  background-color: var(--marked);
 }
 
 img,
@@ -588,7 +586,7 @@ pre {
 /* Fix embedded code within pre */
 pre code {
   color: var(--preformatted);
-  background: none;
+  background-color: none;
   margin: 0;
   padding: 0;
 }

From 1ea688f8883b29e39dc6637e0f82a2cffd438c06 Mon Sep 17 00:00:00 2001
From: Wahyu Wiyoko <111651479+wahyuwiyoko@users.noreply.github.com>
Date: Sun, 21 Aug 2022 23:35:02 +0800
Subject: [PATCH 2/4] Change details padding

---
 simple.css | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/simple.css b/simple.css
index ea1fe97..0200ff1 100644
--- a/simple.css
+++ b/simple.css
@@ -345,7 +345,7 @@ section:last-child {
 }
 
 details {
-  padding: 0.6rem 1rem;
+  padding: 0.6rem 1rem 0.75rem 1rem;
 }
 
 summary {
@@ -621,4 +621,4 @@ progress::-moz-progress-bar {
 
 progress:indeterminate::-moz-progress-bar {
   background-color: var(--accent-bg);
-}
\ No newline at end of file
+}

From 75807289d7921cabd0b5d289c1ca5d7cc6ca715b Mon Sep 17 00:00:00 2001
From: Wahyu Wiyoko <111651479+wahyuwiyoko@users.noreply.github.com>
Date: Mon, 22 Aug 2022 21:23:19 +0800
Subject: [PATCH 3/4] Change pre code to background

Since have problem with the background code
---
 simple.css | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/simple.css b/simple.css
index 0200ff1..6e7bf26 100644
--- a/simple.css
+++ b/simple.css
@@ -586,7 +586,7 @@ pre {
 /* Fix embedded code within pre */
 pre code {
   color: var(--preformatted);
-  background-color: none;
+  background: none;
   margin: 0;
   padding: 0;
 }

From c60c8d1a7492fbb5f5c6885b098fa4490a9cf7ad Mon Sep 17 00:00:00 2001
From: Wahyu Wiyoko <wahyualviyoko@gmail.com>
Date: Sun, 28 Aug 2022 11:53:39 +0800
Subject: [PATCH 4/4] Improve details and summary

---
 simple.css | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/simple.css b/simple.css
index 6e7bf26..02e9d5e 100644
--- a/simple.css
+++ b/simple.css
@@ -345,12 +345,15 @@ section:last-child {
 }
 
 details {
-  padding: 0.6rem 1rem 0.75rem 1rem;
+  padding: 0.7rem 1rem;
 }
 
 summary {
   cursor: pointer;
   font-weight: bold;
+  padding: 0.7rem 1rem;
+  margin: -0.7rem -1rem;
+  word-break: break-all;
 }
 
 details[open] summary + * {