cleanup code

Author: marc-aurele-besner

lib/fileonchain_web/components/core_components.ex

@@ -500,7 +500,7 @@ defmodule FileonchainWeb.CoreComponents do
               class={["relative p-4", @row_click && "hover:cursor-pointer"]}
             >
               <div class="block py-4 pr-6">
-                <span class="absolute -inset-y-px right-0 -left-4 group-hover:bg-brand-700 sm:rounded-l-xl" />
+                <span class="absolute -inset-y-px right-0 -left-0 group-hover:bg-brand-700 sm:rounded-l-xl" />
                 <span class={["relative", i == 0 && "font-semibold text-secondary"]}>
                   <%= render_slot(col, @row_item.(row)) %>
                 </span>

lib/fileonchain_web/live/chunks_live/index.html.heex

@@ -1,9 +1,9 @@
 <div class="mx-auto max-w-4xl p-12 bg-brand-900 text-white rounded-lg shadow-lg">
-  <.header class="text-center text-white text-2xl">
+  <.header>
     Listing Chunks
     <:actions>
-      <.link patch={~p"/files/new"} class="font-semibold hover:underline text-secondary-light">
-        <.button class="bg-secondary hover:bg-secondary-dark text-white p-4 rounded">New File</.button>
+      <.link patch={~p"/files/new"}>
+        <.button>New File</.button>
       </.link>
     </:actions>
   </.header>
@@ -12,27 +12,25 @@
     id="chunks"
     rows={@streams.chunks}
     row_click={fn {_id, chunk} -> JS.navigate(~p"/chunks/#{chunk}") end}
-    class="w-full mt-6 bg-brand-800 rounded-lg"
   >
-    <:col :let={{_id, chunk}} label="Hash" class="p-4 border-b border-brand-700 text-white">
+    <:col :let={{_id, chunk}} label="Hash">
       <%= FileonchainWeb.ChunkLive.Index.shorten_hash(chunk.hash) %>
     </:col>
-    <:col :let={{_id, chunk}} label="Data" class="p-4 border-b border-brand-700">
+    <:col :let={{_id, chunk}} label="Data">
       <%= raw(FileonchainWeb.ChunkLive.Index.render_chunk_preview(chunk)) %>
     </:col>
-    <:col :let={{_id, chunk}} label="Size" class="p-4 border-b border-brand-700 text-white">
+    <:col :let={{_id, chunk}} label="Size">
       <%= FileonchainWeb.ChunkLive.Index.format_chunk_size(chunk.data) %>
     </:col>
-    <:action :let={{_id, chunk}} class="p-4 border-b border-brand-700">
+    <:action :let={{_id, chunk}}>
       <div class="sr-only">
-        <.link navigate={~p"/chunks/#{chunk}"} class="text-secondary-light hover:underline">Show</.link>
+        <.link navigate={~p"/chunks/#{chunk}"}>Show</.link>
       </div>
     </:action>
-    <:action :let={{id, chunk}} class="p-4 border-b border-brand-700">
+    <:action :let={{id, chunk}}>
       <.link
         phx-click={JS.push("hide", value: %{id: chunk.id}) |> hide("##{id}")}
         data-confirm="Are you sure?"
-        class="text-secondary hover:text-secondary-light"
       >
         Hide
       </.link>

lib/fileonchain_web/live/file_live/index.html.heex

@@ -1,9 +1,9 @@
 <div class="mx-auto max-w-2xl p-12 bg-brand-900 text-white rounded-lg shadow-lg">
-  <.header class="text-center text-white text-2xl">
+  <.header>
     Listing Files
     <:actions>
-      <.link patch={~p"/files/new"} class="font-semibold hover:underline text-secondary-light">
-        <.button class="bg-secondary hover:bg-secondary-dark text-white p-4 rounded">New File</.button>
+      <.link patch={~p"/files/new"}>
+        <.button>New File</.button>
       </.link>
     </:actions>
   </.header>
@@ -17,17 +17,16 @@
     <:col :let={{_id, file}} label="Preview">
       <%= raw(render_file_preview(file)) %>
     </:col>
-    <:col :let={{_id, file}} label="Size" class="p-4 border-b border-brand-700"><%= format_file_size(file.data) %></:col>
+    <:col :let={{_id, file}} label="Size"><%= format_file_size(file.data) %></:col>
     <:action :let={{_id, file}}>
-      <div class="sr-only">
-        <.link navigate={~p"/files/#{file}"} class="text-secondary-light hover:underline">Show</.link>
+      <div>
+        <.link navigate={~p"/files/#{file}"}>Show</.link>
       </div>
     </:action>
     <:action :let={{id, file}}>
       <.link
         phx-click={JS.push("hide", value: %{id: file.id}) |> hide("##{id}")}
         data-confirm="Are you sure?"
-        class="text-secondary hover:text-secondary-light"
       >
         Hide
       </.link>