Packages
moon
2.76.2
2.90.5
retired
2.90.4
2.90.3
2.90.2
2.90.1
2.90.0
2.89.4
2.89.1
2.89.0
2.88.0
2.87.11
2.87.10
2.87.9
2.87.8
2.87.7
2.87.6
2.87.5
2.87.4
2.87.3
2.87.2
2.87.1
2.87.0
2.86.1
2.86.0
2.85.1
2.85.0
2.84.0
2.83.0
2.82.0
2.81.4
2.81.3
2.81.2
2.81.1
2.81.0
2.80.2
2.80.1
2.80.0
2.79.13
2.79.12
2.79.11
2.79.10
2.79.9
2.79.8
2.79.7
2.79.6
2.79.5
2.79.4
2.79.3
2.79.2
2.79.1
2.79.0
2.78.4
2.78.3
2.78.2
2.78.1
2.78.0
2.77.0
2.76.5
2.76.4
2.76.3
2.76.2
2.76.1
2.76.0
2.75.0
2.74.1
2.74.0
2.73.8
2.73.7
2.73.6
2.73.5
2.73.4
2.73.3
2.73.2
2.73.1
2.73.0
2.72.5
2.72.4
2.72.3
2.72.2
2.72.1
2.72.0
2.71.1
2.71.0
2.70.0
2.69.2
2.69.1
2.69.0
2.68.11
2.68.10
Components-based design system written in elixir
Current section
Files
Jump to
Current section
Files
lib/moon_web/pages/components/link_page.ex
defmodule MoonWeb.Pages.Components.LinkPage do
@moduledoc false
use MoonWeb, :live_view
alias Moon.Autolayouts.TopToDown
alias Moon.Components.Heading
alias Moon.Components.Link
alias Moon.Components.Link
alias MoonWeb.Components.ExampleAndCode
alias MoonWeb.Components.Page
data(breadcrumbs, :any,
default: [
%{
to: "#",
name: "Components v1"
},
%{
to: "/components/link",
name: "Link"
}
]
)
def handle_params(_params, uri, socket) do
{:noreply, assign(socket, uri: uri)}
end
def render(assigns) do
~F"""
<Page {=@theme_name} {=@active_page} {=@breadcrumbs} {=@direction}>
<TopToDown>
<Heading size={56} class="mb-4">Link</Heading>
<p>
<Link to="#">Figma design</Link>
<Link to="https://github.com/coingaming/moon/blob/main/lib/moon_web/pages/components/link_page.ex">Sourcecode of this page</Link>
<Link to="#">React implementation</Link>
</p>
<ExampleAndCode id="link_1">
<:example>
<Link to="#">I'm a link</Link>
<Link to="#" secondary>
I'm a Secondary link
</Link>
<Link to="#" optional>
I'm an Optional link
</Link>
<Link to="#" disabled>
I'm a disabled link
</Link>
</:example>
<:code>{link_1_code()}</:code>
</ExampleAndCode>
</TopToDown>
</Page>
"""
end
def link_1_code do
"""
<Link to="#">I'm a link</Link>
<Link to="#" secondary>
I'm a Secondary link
</Link>
<Link to="#" optional>
I'm an Optional link
</Link>
<Link to="#" disabled>
I'm a disabled link
</Link>
"""
end
end