Mark Piga & Beachkam as stopped

basilenouvellet · Aug 27, 2024 · 9b0ca3e · 9b0ca3e
1 parent b012924
commit 9b0ca3e
Show file tree

Hide file tree

Showing 2 changed files with 21 additions and 12 deletions.
diff --git a/lib/website_web/components/core_components.ex b/lib/website_web/components/core_components.ex
@@ -65,24 +65,31 @@ defmodule WebsiteWeb.CoreComponents do
   attr :img_url, :string, default: nil
   attr :label, :string, required: true
   attr :class, :string, default: nil
+  attr :stopped, :boolean, default: false
 
   def card_link_with_image(assigns) do
     ~H"""
     <a
       href={@url}
       target="_blank"
       class={[
-        "flex items-center gap-4 py-4 px-6",
+        "flex items-center gap-4 p-2",
         "text-dark-400",
-        "hover:bg-dark-700 hover:text-dark-200",
         "rounded transition",
+        @stopped && "opacity-50 pointer-events-none",
+        !@stopped && "hover:bg-dark-700 hover:text-dark-200",
         @class
       ]}
     >
       <img src={@img_url || "#{@url}/favicon.ico"} alt={@label} class="h-8 w-8 sm:h-10 sm:w-10" />
-      <div>
-        <span class="block text-base font-bold"><%= @label %></span>
-        <span class="block mt-1 text-xs font-normal"><%= @url %></span>
+      <div class="flex-grow">
+        <div class="flex items-center justify-between gap-6">
+          <span class="block text-base font-bold"><%= @label %></span>
+          <span :if={@stopped} class="text-xs px-1 py-0.5 bg-dark-700 text-dark-400 rounded">
+            stopped
+          </span>
+        </div>
+        <span class="block mt-1 text-xs font-normal select-all"><%= @url %></span>
       </div>
     </a>
     """

diff --git a/lib/website_web/live/home_live.ex b/lib/website_web/live/home_live.ex
@@ -28,23 +28,25 @@ defmodule WebsiteWeb.HomeLive do
             <:title>building</:title>
           </.section_title>
 
-          <div class="w-fit mt-4 grid grid-cols-1 gap-4 sm:grid-cols-2">
-            <.card_link_with_image
-              url="https://piga.io"
-              img_url={~p"/images/piga-logo-192.webp"}
-              label="Piga"
-            />
-
+          <div class="w-fit mt-4 grid grid-cols-1 gap-8 sm:grid-cols-2">
             <.card_link_with_image
               url="https://liveroom.app"
               img_url={~p"/images/liveroom-logo-192.webp"}
               label="Liveroom"
             />
 
+            <.card_link_with_image
+              url="https://piga.io"
+              img_url={~p"/images/piga-logo-192.webp"}
+              label="Piga"
+              stopped
+            />
+
             <.card_link_with_image
               url="https://beachkam.com"
               img_url={~p"/images/beachkam-logo-192.webp"}
               label="Beachkam"
+              stopped
             />
           </div>