:lipstick: Format debug output nicely.

2 files changed, 11 insertions, 2 deletions

diff --git a/test/examples/input.gleam b/test/examples/input.gleam
index 352e480..da93d47 100644
--- a/test/examples/input.gleam
+++ b/test/examples/input.gleam
@@ -64,7 +64,16 @@ fn render(model: Model) -> Element(Msg) {
         email_input(model.email),
         password_input(model.password),
         remember_checkbox(model.remember_me),
-        pre([attribute.class("debug")], [t(string.inspect(model))]),
+        pre(
+          [attribute.class("debug")],
+          [
+            string.inspect(model)
+            |> string.replace("(", "(\n  ")
+            |> string.replace(", ", ",\n  ")
+            |> string.replace(")", "\n)")
+            |> t,
+          ],
+        ),
       ]),
     ],
   )
diff --git a/test/examples/input.html b/test/examples/input.html
index 273dffa..3bd6463 100644
--- a/test/examples/input.html
+++ b/test/examples/input.html
@@ -21,7 +21,7 @@
         }
 
         .debug {
-          @apply text-sm text-gray-400 whitespace-pre-line;
+          @apply text-sm text-gray-400;
         }
 
         .input label {