LiveViewResponsive.Breakpoints (live_view_responsive v0.1.1)
Generates breakpoints for live_view_responsive package.
Usage:
defmodule ExampleApp.LiveViewResponsive do
use LiveViewResponsive.Breakpoints, [
mobile: [max_width: 700],
tablet: [min_width: 701, max_width: 1200],
desktop: [min_width: 1201],
]
end
Then you can import
or use
the module ExampleApp.LiveViewResponsive
in your components.
For each breakpoint a new component named {breakpoint}_media_query
is generated, for example:
<.mobile_media_query>
You are on mobile
</.mobile_media_query>
And a function named assign_{breakpoint}_media_query
is created, for example:
socket
|> assign_mobile_media_query(initial: true)
|> assign_tablet_media_query()
Summary
Functions
Link to this function