From aaf278f7f9686d9e8ae28b9974cfe08004de296a Mon Sep 17 00:00:00 2001
From: Schuwi <schuwi4@gmail.com>
Date: Sat, 20 Sep 2025 11:50:22 +0200
Subject: [PATCH] style: prevent formatter issue

---
 README.md                                         |  2 +-
 lib/components_elixir_web/live/components_live.ex | 10 ++++++----
 2 files changed, 7 insertions(+), 5 deletions(-)

diff --git a/README.md b/README.md
index 88a56ae..a6f76be 100644
--- a/README.md
+++ b/README.md
@@ -181,7 +181,7 @@ mix test
 
 ### Code Quality
 ```bash
-#mix format - nope, not yet
+mix format
 mix credo
 ```
 
diff --git a/lib/components_elixir_web/live/components_live.ex b/lib/components_elixir_web/live/components_live.ex
index 473ca5d..f18bd5f 100644
--- a/lib/components_elixir_web/live/components_live.ex
+++ b/lib/components_elixir_web/live/components_live.ex
@@ -1199,8 +1199,9 @@ defmodule ComponentsElixirWeb.ComponentsLive do
                         <%= if component.description do %>
                           <div>
                             <h4 class="text-sm font-medium text-base-content mb-2">Description</h4>
-                            <%!-- Keep interpolation inline to prevent whitespace-pre-wrap from preserving template indentation --%>
-                            <p class="text-sm text-base-content/70 leading-relaxed whitespace-pre-wrap">{component.description}</p>
+                            <%!-- Keep interpolation inline to prevent whitespace-pre-wrap from preserving template indentation.
+                                 Use phx-no-format so the formatter won't break the layout. --%>
+                            <p phx-no-format class="text-sm text-base-content/70 leading-relaxed whitespace-pre-wrap">{component.description}</p>
                           </div>
                         <% end %>
 
@@ -1393,8 +1394,9 @@ defmodule ComponentsElixirWeb.ComponentsLive do
     <!-- Middle row: Description -->
                       <%= if component.description do %>
                         <div class="mt-1">
-                          <%!-- Keep interpolation inline to prevent whitespace-pre-wrap from preserving template indentation --%>
-                          <p class="text-sm text-base-content/70 line-clamp-2 whitespace-pre-wrap">{component.description}</p>
+                          <%!-- Keep interpolation inline to prevent whitespace-pre-wrap from preserving template indentation.
+                               Use phx-no-format so the formatter won't break the layout. --%>
+                          <p phx-no-format class="text-sm text-base-content/70 line-clamp-2 whitespace-pre-wrap">{component.description}</p>
                         </div>
                       <% end %>