Apply liliform components to home

This commit is contained in:
Harshad Sharma 2024-05-16 01:48:00 +05:30
parent f2f4c0531d
commit 2d33f14fcd

View file

@ -3,9 +3,12 @@ defmodule FreediveWeb.HomeLive do
def render(assigns) do def render(assigns) do
~H""" ~H"""
<.section> <.block class="px-2 py-4">
<.panel is-info> <.panel is-info>
<.panel_heading>Home</.panel_heading> <.panel_heading>
Home
</.panel_heading>
<.panel_tabs is-hidden-mobile> <.panel_tabs is-hidden-mobile>
<a class="is-active">All</a> <a class="is-active">All</a>
<a>Compute</a> <a>Compute</a>
@ -13,21 +16,22 @@ defmodule FreediveWeb.HomeLive do
<a>Network</a> <a>Network</a>
<a>System</a> <a>System</a>
</.panel_tabs> </.panel_tabs>
<.panel_tabs is-hidden-tablet> <.panel_tabs is-hidden-tablet>
<a class="is-active" title="All"> <a title="All" is-active>
<.icon for="infinity" color="auto" /> <.icon for="all" color="auto" />
</a> </a>
<a title="Compute"> <a title="Compute">
<.icon for="binary" color="auto" /> <.icon for="compute" color="auto" />
</a> </a>
<a title="Storage"> <a title="Storage">
<.icon for="hard-drive" color="auto" /> <.icon for="storage" color="auto" />
</a> </a>
<a title="Network"> <a title="Network">
<.icon for="earth" color="auto" /> <.icon for="network" color="auto" />
</a> </a>
<a title="System"> <a title="System">
<.icon for="bot" color="auto" /> <.icon for="system" color="auto" />
</a> </a>
</.panel_tabs> </.panel_tabs>
@ -40,11 +44,10 @@ defmodule FreediveWeb.HomeLive do
name="search" name="search"
value={@query} value={@query}
/> />
<span class="icon is-left"> <.icon for="search" size="1.5rem" aria-hidden="true" is-left />
<Lucideicons.search aria-hidden="true" />
</span>
</.control> </.control>
</.panel_block> </.panel_block>
<.link patch={~p"/services"} class="panel-block pt-1"> <.link patch={~p"/services"} class="panel-block pt-1">
<span class="panel-icon"> <span class="panel-icon">
<.icon for="puzzle" color="auto" aria-hidden="true" /> <.icon for="puzzle" color="auto" aria-hidden="true" />
@ -64,12 +67,32 @@ defmodule FreediveWeb.HomeLive do
<span class="mt-2 ml-2">Software updates</span> <span class="mt-2 ml-2">Software updates</span>
</.link> </.link>
</.panel> </.panel>
</.block>
<.section>
<.box>
<.button phx-click="color" phx-value-enable="true">
Color
</.button>
<.button phx-click="color" phx-value-enable="false">
Grayscale
</.button>
</.box>
</.section> </.section>
""" """
end end
def mount(_params, _session, socket) do def mount(_params, _session, socket) do
socket = assign(socket, query: "") socket = assign(socket, query: "all")
{:ok, socket} {:ok, socket}
end end
def handle_event("color", %{"enable" => "true"}, socket) do
Freedive.Features.enable(:colorhash)
{:noreply, assign(socket, query: "color")}
end
def handle_event("color", %{"enable" => "false"}, socket) do
Freedive.Features.disable(:colorhash)
{:noreply, assign(socket, query: "grayscale")}
end
end end