854502634c
* 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
44 lines
1.4 KiB
Elixir
44 lines
1.4 KiB
Elixir
defmodule PinchflatWeb.CustomComponents.TabComponents do
|
|
@moduledoc false
|
|
use Phoenix.Component
|
|
|
|
@doc """
|
|
Takes a list of tabs and renders them in a tabbed layout.
|
|
"""
|
|
slot :tab, required: true do
|
|
attr :title, :string, required: true
|
|
end
|
|
|
|
slot :tab_append, required: false
|
|
|
|
def tabbed_layout(assigns) do
|
|
~H"""
|
|
<div
|
|
x-data="{ openTab: 0, activeClasses: 'text-meta-5 border-meta-5', inactiveClasses: 'border-transparent' }"
|
|
class="w-full"
|
|
>
|
|
<header class="flex flex-col md:flex-row md:justify-between border-b border-strokedark">
|
|
<div class="flex flex-wrap gap-5 sm:gap-10">
|
|
<a
|
|
:for={{tab, idx} <- Enum.with_index(@tab)}
|
|
href="#"
|
|
@click.prevent={"openTab = #{idx}"}
|
|
x-bind:class={"openTab === #{idx} ? activeClasses : inactiveClasses"}
|
|
class="border-b-2 py-4 w-full sm:w-fit text-sm font-medium hover:text-meta-5 md:text-base"
|
|
>
|
|
<span class="text-xl"><%= tab.title %></span>
|
|
</a>
|
|
</div>
|
|
<div class="mx-4 my-4 lg:my-0 flex gap-5 sm:gap-10 items-center">
|
|
<%= render_slot(@tab_append) %>
|
|
</div>
|
|
</header>
|
|
<div class="mt-4">
|
|
<div :for={{tab, idx} <- Enum.with_index(@tab)} x-show={"openTab === #{idx}"} class="font-medium leading-relaxed">
|
|
<%= render_slot(tab) %>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
"""
|
|
end
|
|
end
|