Works like a charm! I put the “breakpoints” into the frontend view_helpers:
defp view_helpers() do
quote do
@sd_max_width 768
@md_max_width 1080
@display_size_small :display_size_small
@display_size_medium :display_size_medium
@display_size_large :display_size_large
def display_size(width) when width <= @sd_max_width, do: @display_size_small
def display_size(width) when width <= @md_max_width, do: @display_size_medium
def display_size(width), do: @display_size_large
use Phoenix.HTML
...
end
end
And dispatched the page_size on in:
@impl Phoenix.LiveView
def handle_event("viewport_resize", %{"width" => width}, socket) do
socket
|> assign(
:page_size,
case display_size(width) do
@display_size_small -> 6
_ -> 9
end
)
|> noreply()
end
