From e4e0349a32206333cf2cd7fab970dc0d6be232ef Mon Sep 17 00:00:00 2001
From: Nathan McCarty <thatonelutenist@stranger.systems>
Date: Sun, 9 Feb 2025 22:27:17 -0500
Subject: [PATCH] Unit test styling

---
 lib/Render/Util.rakumod |  2 ++
 resources/code.css      | 26 ++++++++++++++++++++++++++
 resources/colors.css    | 10 ++++++++++
 3 files changed, 38 insertions(+)

diff --git a/lib/Render/Util.rakumod b/lib/Render/Util.rakumod
index d2b2d77..475a79a 100644
--- a/lib/Render/Util.rakumod
+++ b/lib/Render/Util.rakumod
@@ -11,6 +11,8 @@ sub show-html($html) is export {
    $out ~~ s:g/'</i>' \v+ '<span>'/<\/i><span>/;
    $out ~~ s:g/\v+ '</a>'/<\/a>/;
    $out ~~ s:g/\s+ ',' \s+ '<span'/, <span/;
+   # Fixup unit test divs
+   $out ~~ s:g/'<div class="unit-test">' \s* '<pre><code class="idris-code">&nbsp;&nbsp;'/<div class="unit-test"><span><i class='bx bx-check-circle'><\/i>Unit Test<\/span><pre><code class="idris-code">/;
    $out
 }
 
diff --git a/resources/code.css b/resources/code.css
index f633095..a3e1758 100644
--- a/resources/code.css
+++ b/resources/code.css
@@ -19,4 +19,30 @@ pre > code {
 }
 pre {
     width: 90%;
+    box-sizing: border-box;
+}
+
+/* Styling for unit tests */
+.unit-test {
+    width: 90%;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    padding: 1rem;
+    border-radius: 0.55rem / 0.5rem;
+    box-sizing: border-box;
+}
+.unit-test > span {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    padding: 0.5rem;
+    border-radius: 0.55rem / 0.5rem;
+}
+.unit-test > pre {
+    width: auto;
+}
+.unit-test i {
+    font-size: 1.5rem;
+    margin-right: 0.5rem;
 }
diff --git a/resources/colors.css b/resources/colors.css
index 42db252..5c9ec9c 100644
--- a/resources/colors.css
+++ b/resources/colors.css
@@ -78,6 +78,16 @@ a:visited {
 blockquote {
   background-color: var(--bg-1);
 }
+.unit-test {
+  background-color: var(--bg-1);
+}
+.unit-test > span {
+  background-color: var(--bg-2);
+  color: var(--fg-1);
+}
+.unit-test i {
+  color: var(--green);
+}
 
 /* Colorization for idris code blocks */
 code {