forked from hiway/freedive
Apply liliform components to home
This commit is contained in:
parent
f2f4c0531d
commit
2d33f14fcd
1 changed files with 35 additions and 12 deletions
|
@ -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
|
||||||
|
|
Loading…
Reference in a new issue