dp/wish
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Continue improving home screen

Browse Source
This commit is contained in:
Daniel Patterson
2023-11-28 01:34:04 +00:00
parent cb7c15c345
commit 39e6f36e9a
7 changed files with 46 additions and 66 deletions
Download Patch File Download Diff File Expand all files Collapse all files

42
lib/wish_web/live/home_live/index.html.heex
View File

@@ -16,7 +16,6 @@
:for={item <- @items}
phx-click={JS.navigate(~p"/details/#{item}")}
class="h-72 p-2 rounded hover:bg-zinc-100 active:bg-zinc-200"
,
>
<div class="aspect-square relative flex flex-col justify-center">
<img
@@ -27,7 +26,7 @@
width="224"
class="rounded"
/>
<%= if item.received do %>
<%= if item.received && !@current_user do %>
<div class="bg-red-400 text-white absolute w-full h-7 bottom-0">
<.icon name="hero-check-circle" />Received
</div>
@@ -37,24 +36,12 @@
<%= item.title %>
<div phx-click={JS.toggle(to: "#dropdown-#{item.id}")} class="relative">
<.icon name="hero-ellipsis-vertical" class="w-7 h-7" />
<div
id={"dropdown-#{item.id}"}
class="absolute z-10 w-40 bg-white origin-top right-0 whitespace-nowrap p-1 border rounded"
phx-click-away={JS.hide()}
hidden
>
<div
class="p-1 border border-white hover:bg-slate-100 hover:border-black select-none"
phx-click={
JS.push("toggle_received", value: %{"id" => item.id})
|> JS.hide(to: "#dropdown-#{item.id}")
}
>
Mark received
</div>
</div>
<.dropdown item={item} />
</div>
</div>
<div class="text-sm">
<%= item.description %>
</div>
</div>
</div>
<% else %>
@@ -71,7 +58,7 @@
alt={item.title}
class="max-h-full rounded"
/>
<%= if item.received do %>
<%= if item.received && !@current_user do %>
<div class="absolute bg-red-400 text-xs text-white w-full h-7 bottom-0">
<.icon name="hero-check-circle" />Received
</div>
@@ -82,22 +69,7 @@
</div>
<div phx-click={JS.toggle(to: "#dropdown-#{item.id}")} class="relative">
<.icon name="hero-ellipsis-vertical" class="w-7 h-7" />
<div
id={"dropdown-#{item.id}"}
class="absolute z-10 w-40 bg-white origin-top right-0 whitespace-nowrap p-1 border rounded"
phx-click-away={JS.hide()}
hidden
>
<div
class="p-1 border border-white hover:bg-slate-100 hover:border-black select-none"
phx-click={
JS.push("toggle_received", value: %{"id" => item.id})
|> JS.hide(to: "#dropdown-#{item.id}")
}
>
Mark received
</div>
</div>
<.dropdown item={item} />
</div>
</div>
</div>