320b25f5b6
* Add media streaming (#108) * [WIP] set up streaming route * Added UUID to sources and media items * Added media preview to MI show page * Added plug to strip file extensions * [VERY WIP] basic podcast RSS setup * [WIP] got basic podcast RSS working * [WIP] more expanding on RSS * Comment * [WIP] Working on refactoring feed * Added UUID backfill to a migration * [WIP] Moar refactoring * [WIP] Adding UI for getting RSS feed * Many tests * Added conditional routing for feed URLs * Removed the need for url_base to be set * Updated preset name * Rendered certain fields HTML-safe; Added logging to confirm range request support * Fixed incorrect scheme issue * Updated env var * Updated other UI to use dropdown * removed commented code * Generate rss feeds (#123) * Added plug to strip file extensions * [VERY WIP] basic podcast RSS setup * [WIP] got basic podcast RSS working * [WIP] more expanding on RSS * [WIP] Working on refactoring feed * Added UUID backfill to a migration * [WIP] Moar refactoring * [WIP] Adding UI for getting RSS feed * Many tests * Added conditional routing for feed URLs * Removed the need for url_base to be set * Updated preset name * Rendered certain fields HTML-safe; Added logging to confirm range request support * Fixed incorrect scheme issue * Updated env var * Updated other UI to use dropdown * removed commented code * docs * Added unique index to UUID fields
92 lines
2.4 KiB
Elixir
92 lines
2.4 KiB
Elixir
defmodule PinchflatWeb.CustomComponents.ButtonComponents do
|
|
@moduledoc false
|
|
use Phoenix.Component, global_prefixes: ~w(x-)
|
|
|
|
alias PinchflatWeb.CoreComponents
|
|
|
|
@doc """
|
|
Render a button
|
|
|
|
## Examples
|
|
|
|
<.button color="bg-primary" rounding="rounded-sm">
|
|
<span>Click me</span>
|
|
</.button>
|
|
"""
|
|
attr :color, :string, default: "bg-primary"
|
|
attr :rounding, :string, default: "rounded-sm"
|
|
attr :class, :string, default: ""
|
|
attr :type, :string, default: "submit"
|
|
attr :disabled, :boolean, default: false
|
|
attr :rest, :global
|
|
|
|
slot :inner_block, required: true
|
|
|
|
def button(assigns) do
|
|
~H"""
|
|
<button
|
|
class={[
|
|
"text-center font-medium text-white",
|
|
"#{@rounding} inline-flex items-center justify-center px-8 py-4",
|
|
"#{@color}",
|
|
"hover:bg-opacity-90 lg:px-8 xl:px-10",
|
|
"disabled:bg-opacity-50 disabled:cursor-not-allowed disabled:text-grey-5",
|
|
@class
|
|
]}
|
|
type={@type}
|
|
disabled={@disabled}
|
|
{@rest}
|
|
>
|
|
<%= render_slot(@inner_block) %>
|
|
</button>
|
|
"""
|
|
end
|
|
|
|
@doc """
|
|
Render a dropdown based off a button
|
|
|
|
## Examples
|
|
|
|
<.button_dropdown text="Actions">
|
|
<:option>TEST</:option>
|
|
</.button_dropdown>
|
|
"""
|
|
attr :text, :string, required: true
|
|
attr :class, :string, default: ""
|
|
|
|
slot :option, required: true
|
|
|
|
def button_dropdown(assigns) do
|
|
~H"""
|
|
<div x-data="{ dropdownOpen: false }" class={["relative flex", @class]}>
|
|
<span
|
|
x-on:click.prevent="dropdownOpen = !dropdownOpen"
|
|
class={[
|
|
"cursor-pointer inline-flex gap-2.5 rounded-md bg-primary px-5.5 py-3",
|
|
"font-medium text-white hover:bg-opacity-95"
|
|
]}
|
|
>
|
|
<%= @text %>
|
|
<CoreComponents.icon
|
|
name="hero-chevron-down"
|
|
class="fill-current duration-200 ease-linear mt-1"
|
|
x-bind:class="dropdownOpen && 'rotate-180'"
|
|
/>
|
|
</span>
|
|
<div
|
|
x-show="dropdownOpen"
|
|
x-on:click.outside="dropdownOpen = false"
|
|
class="absolute left-0 top-full z-40 mt-2 w-full rounded-md bg-black py-3 shadow-card"
|
|
>
|
|
<ul class="flex flex-col">
|
|
<li :for={option <- @option}>
|
|
<span class="flex px-5 py-2 font-medium text-bodydark2 hover:text-white cursor-pointer">
|
|
<%= render_slot(option) %>
|
|
</span>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
"""
|
|
end
|
|
end
|