From 99ae616eff44d88782954bedb22c0d96e20ddb27 Mon Sep 17 00:00:00 2001
From: KKlochko <KKlochko@protonmail.com>
Date: Sun, 20 Apr 2025 18:17:12 +0300
Subject: [PATCH] Update the style for AuthorRoles' nested forms for the Book's
 form.

---
 .../components/my_components/selected_author.ex              | 3 ++-
 .../live/book_live/form_component.ex                         | 5 +++--
 2 files changed, 5 insertions(+), 3 deletions(-)

diff --git a/lib/decentralised_book_index_web/components/my_components/selected_author.ex b/lib/decentralised_book_index_web/components/my_components/selected_author.ex
index 96dff35..2d3eb47 100644
--- a/lib/decentralised_book_index_web/components/my_components/selected_author.ex
+++ b/lib/decentralised_book_index_web/components/my_components/selected_author.ex
@@ -4,6 +4,7 @@ defmodule DecentralisedBookIndexWeb.Components.MyComponents.SelectedAuthor do
 
   attr :author_form, :map, default: nil
   attr :form_path, :string, default: ""
+  attr :class, :string, default: ""
 
   def selected_author(assigns) do
     author_id = assigns.author_form.value
@@ -18,7 +19,7 @@ defmodule DecentralisedBookIndexWeb.Components.MyComponents.SelectedAuthor do
     assigns = assign(assigns, :author, author)
 
     ~H"""
-    <button type="button" phx-click="open-select-author" phx-target={@notify_component} phx-value-path={@form_path} class="text-white bg-blue-700 hover:bg-blue-800 focus:outline-none focus:ring-4 focus:ring-blue-300 font-medium rounded-full text-sm px-5 py-2.5 text-center me-2 mb-2 dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800">
+    <button type="button" phx-click="open-select-author" phx-target={@notify_component} phx-value-path={@form_path} class={"text-white bg-blue-700 hover:bg-blue-800 focus:outline-none focus:ring-4 focus:ring-blue-300 font-medium rounded-full text-sm px-5 py-2.5 text-center dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800 #{@class}"}>
       <%= if @author != nil do %>
         {@author.name}
       <% else %>
diff --git a/lib/decentralised_book_index_web/live/book_live/form_component.ex b/lib/decentralised_book_index_web/live/book_live/form_component.ex
index de9b92c..9730997 100644
--- a/lib/decentralised_book_index_web/live/book_live/form_component.ex
+++ b/lib/decentralised_book_index_web/live/book_live/form_component.ex
@@ -212,7 +212,7 @@ defmodule DecentralisedBookIndexWeb.BookLive.FormComponent do
       <thead class="border-b border-zinc-100">
         <tr>
           <th class="text-left font-medium text-sm pb-1 px-3 w-10"></th>
-          <th class="text-left font-medium text-sm pb-1 px-3 w-96 dark:text-white">Author</th>
+          <th class="text-left font-medium text-sm pb-1 px-3 w-48 dark:text-white">Author</th>
           <th class="text-left font-medium text-sm pb-1 px-3 dark:text-white">Role</th>
           <th class="text-left font-medium text-sm pb-1 px-3 w-12"></th>
         </tr>
@@ -225,13 +225,14 @@ defmodule DecentralisedBookIndexWeb.BookLive.FormComponent do
                 <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m8 15 4 4 4-4m0-6-4-4-4 4"/>
               </svg>
             </td>
-            <td class="px-3 w-96">
+            <td class="px-3 w-48">
               <label for={author_roles_form[:author_id].id} class="hidden">Type</label>
               <.input field={author_roles_form[:author_id]} />
               <.selected_author
                 author_form={author_roles_form[:author_id]}
                 notify_component={@notify_component}
                 form_path={author_roles_form.name}
+                class="mt-2 w-full"
               />
             </td>
             <td class="px-3">