Update the card component to center their text.

lib/decentralised_book_index_web/components/my_components/author_card.ex

@@ -31,7 +31,7 @@ defmodule DecentralisedBookIndexWeb.Components.MyComponents.AuthorCard do
                 </ul>
             </div>
         </div>
-        <div class="flex flex-col items-center py-5">
+        <div class="flex flex-col items-center py-5 text-center">
             <.link navigate={~p"/authors/#{@author.id}"}>
                 <%= if @author.avatar_url != nil do %>
                     <img class="w-36 h-36 mb-3 rounded-full shadow-lg" src={@author.avatar_url} alt={"#{@author.name} image"} />

lib/decentralised_book_index_web/components/my_components/book_card.ex

@@ -31,7 +31,7 @@ defmodule DecentralisedBookIndexWeb.Components.MyComponents.BookCard do
                 </ul>
             </div>
         </div>
-        <div class="flex flex-col items-center py-5">
+        <div class="flex flex-col items-center py-5 text-center">
             <.link navigate={~p"/books/#{@book.id}"}>
                 <%= if @book.cover_image_url != nil do %>
                     <img class="w-36 mb-3 shadow-lg" src={@book.cover_image_url} alt={"#{@book.title} image"} />