Packages
moon
2.90.5
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
Retired package: Deprecated - Package no longer supported. Use moon_live_view package instead
Current section
Files
Jump to
Current section
Files
lib/moon_web/components/componets_page/components_page_card.ex
defmodule MoonWeb.Components.ComponetsPage.ComponentsPageCard do
@moduledoc false
use MoonWeb, :stateless_component
prop(image, :string)
prop(title, :string, required: true)
slot(default, required: true)
prop(page, :atom)
def render(assigns) do
~F"""
<div>
<a href={live_path(MoonWeb.Endpoint, @page)}>
<div class="flex flex-col border border-beerus rounded-moon-s-lg p-2 pb-6">
<div :if={@image} class="pb-2">
<img src={"/moon/assets/images/#{@image}"} alt={@title} width={408} height={224}>
</div>
<div class="flex flex-col gap-2 pt-2 px-4">
<h3 class="text-moon-20 font-medium">
{@title}</h3>
<p class="h-12 text-moon-16 text-ellipsis overflow-hidden">
<#slot />
</p>
</div>
</div>
</a>
</div>
"""
end
end