devel #175
8 changed files with 41 additions and 58 deletions
|
@ -67,7 +67,9 @@
|
||||||
</header>
|
</header>
|
||||||
|
|
||||||
<main class="mx-3 md:mx-0">
|
<main class="mx-3 md:mx-0">
|
||||||
<%= @inner_content %>
|
<section class="mx-auto max-w-2xl">
|
||||||
|
<%= @inner_content %>
|
||||||
|
</section>
|
||||||
</main>
|
</main>
|
||||||
|
|
||||||
<footer class="max-w-full mt-8 p-8 text-theme-base/75 bg-theme-background1">
|
<footer class="max-w-full mt-8 p-8 text-theme-base/75 bg-theme-background1">
|
||||||
|
|
|
@ -69,30 +69,19 @@ defmodule ChiyaWeb.PublicComponents do
|
||||||
Renders a note-header with title.
|
Renders a note-header with title.
|
||||||
"""
|
"""
|
||||||
attr :class, :string, default: nil
|
attr :class, :string, default: nil
|
||||||
attr :inline, :boolean, default: false
|
|
||||||
|
|
||||||
slot :inner_block, required: true
|
slot :title, required: true
|
||||||
slot :subtitle
|
slot :subtitle
|
||||||
slot :actions
|
|
||||||
|
|
||||||
def header(assigns) do
|
def header(assigns) do
|
||||||
~H"""
|
~H"""
|
||||||
<header class={[@actions != [] && "flex items-center justify-between gap-6", @class]}>
|
<header class={["p-8 rounded", @class]}>
|
||||||
<div>
|
<h1 class="text-3xl font-extrabold leading-10 tracking-tight text-theme-primary">
|
||||||
<h1 class="text-lg font-semibold leading-8 text-gray-800 dark:text-gray-200">
|
<%= render_slot(@title) %>
|
||||||
<%= render_slot(@inner_block) %>
|
</h1>
|
||||||
<span :if={@inline} class="text-sm leading-6 font-normal text-gray-600 dark:text-gray-400">
|
<p :if={@subtitle != []} class="mt-4 leading-7 text-theme-base/75 uppercase font-semibold">
|
||||||
<%= render_slot(@subtitle) %>
|
<%= render_slot(@subtitle) %>
|
||||||
</span>
|
</p>
|
||||||
</h1>
|
|
||||||
<p
|
|
||||||
:if={@subtitle != [] && @inline == false}
|
|
||||||
class="mt-2 text-sm leading-6 text-gray-600 dark:text-gray-400"
|
|
||||||
>
|
|
||||||
<%= render_slot(@subtitle) %>
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
<div class="flex-none"><%= render_slot(@actions) %></div>
|
|
||||||
</header>
|
</header>
|
||||||
"""
|
"""
|
||||||
end
|
end
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<article class="h-card hcard">
|
<article class="h-card hcard">
|
||||||
<section class="mx-auto max-w-2xl p-10 bg-theme-background1 flex gap-3 items-start">
|
<section class="p-10 bg-theme-background1 flex gap-3 items-start">
|
||||||
<div>
|
<div>
|
||||||
<img
|
<img
|
||||||
class="rounded-lg w-28 | u-photo"
|
class="rounded-lg w-28 | u-photo"
|
||||||
|
|
|
@ -1,12 +1,10 @@
|
||||||
<div class="mx-auto max-w-xl">
|
<h1 class="mt-16 text-3xl font-extrabold tracking-tight text-theme-primary">
|
||||||
<h1 class="mt-16 text-3xl font-extrabold tracking-tight text-theme-primary">
|
<%= @channel.name %>
|
||||||
<%= @channel.name %>
|
</h1>
|
||||||
</h1>
|
<p class="mt-4 text-base leading-7 text-theme-base">
|
||||||
<p class="mt-4 text-base leading-7 text-theme-base">
|
<%= @channel.content %>
|
||||||
<%= @channel.content %>
|
</p>
|
||||||
</p>
|
|
||||||
|
|
||||||
<div class="w-full mt-6 sm:w-auto flex flex-col gap-1.5">
|
<div class="w-full mt-6 sm:w-auto flex flex-col gap-1.5">
|
||||||
<.note_list notes={@channel.notes} layout={@channel.layout} />
|
<.note_list notes={@channel.notes} layout={@channel.layout} />
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
|
@ -1,13 +1,9 @@
|
||||||
<section class="mx-auto max-w-2xl p-10 bg-theme-background1">
|
<.header>
|
||||||
<h1 class="text-3xl font-extrabold leading-10 tracking-tight text-theme-primary | p-name">
|
<:title><%= @settings.title %></:title>
|
||||||
<%= @settings.title %>
|
<:subtitle><%= @settings.subtitle %></:subtitle>
|
||||||
</h1>
|
</.header>
|
||||||
<p class="mt-4 leading-7 text-theme-base/75 uppercase font-semibold | p-summary">
|
|
||||||
<%= @settings.subtitle %>
|
|
||||||
</p>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<section class="mx-auto max-w-2xl text-sm my-8">
|
<section class="text-sm my-8">
|
||||||
<ul class="flex flex-wrap gap-3">
|
<ul class="flex flex-wrap gap-3">
|
||||||
<li>
|
<li>
|
||||||
<a
|
<a
|
||||||
|
@ -31,7 +27,7 @@
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<%= if @channel do %>
|
<%= if @channel do %>
|
||||||
<section class="mx-auto max-w-2xl mt-8 border-t border-theme-background1">
|
<section class="mt-8 border-t border-theme-background1">
|
||||||
<.note_list notes={@channel.notes} layout={@channel.layout} />
|
<.note_list notes={@channel.notes} layout={@channel.layout} />
|
||||||
</section>
|
</section>
|
||||||
<% end %>
|
<% end %>
|
||||||
|
|
|
@ -1,15 +1,15 @@
|
||||||
<article class="h-entry hentry">
|
<article class="h-entry hentry">
|
||||||
<header class="mx-auto max-w-2xl">
|
<header>
|
||||||
<h1 class="mt-16 lg:text-5xl md:text-4xl text-3xl font-bold text-theme-base | p-name">
|
<h1 class="mt-16 lg:text-5xl md:text-4xl text-3xl font-bold text-theme-base | p-name">
|
||||||
<%= @note.name %>
|
<%= @note.name %>
|
||||||
</h1>
|
</h1>
|
||||||
</header>
|
</header>
|
||||||
|
|
||||||
<section class="mx-auto mt-8 prose prose-gruvbox md:prose-lg lg:prose-xl | p-summary e-content">
|
<section class="mt-8 prose prose-gruvbox md:prose-lg lg:prose-xl | p-summary e-content">
|
||||||
<%= Markdown.render(@note.content) |> raw %>
|
<%= Markdown.render(@note.content) |> raw %>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<footer class="mt-8 mx-auto max-w-2xl text-theme-base">
|
<footer class="mt-8 text-theme-base">
|
||||||
<%= if @note.published_at do %>
|
<%= if @note.published_at do %>
|
||||||
<span>Published</span>
|
<span>Published</span>
|
||||||
<% else %>
|
<% else %>
|
||||||
|
@ -41,7 +41,7 @@
|
||||||
<a href={~p"/note/#{@note.slug}"} class="hidden | u-url u-uid"><%= @note.name %></a>
|
<a href={~p"/note/#{@note.slug}"} class="hidden | u-url u-uid"><%= @note.name %></a>
|
||||||
</footer>
|
</footer>
|
||||||
|
|
||||||
<section class="mt-8 mx-auto max-w-2xl">
|
<section class="mt-8">
|
||||||
<%= if !Enum.empty?(@note.images) do %>
|
<%= if !Enum.empty?(@note.images) do %>
|
||||||
<.line />
|
<.line />
|
||||||
|
|
||||||
|
|
|
@ -1,12 +1,10 @@
|
||||||
<div class="mx-auto max-w-xl">
|
<h1 class="mt-16 text-3xl font-extrabold tracking-tight text-theme-primary">
|
||||||
<h1 class="mt-16 text-3xl font-extrabold tracking-tight text-theme-primary">
|
Tagged with “<%= @tag.name %>”
|
||||||
Tagged with “<%= @tag.name %>”
|
</h1>
|
||||||
</h1>
|
<p class="mt-4 text-base leading-7 text-theme-base">
|
||||||
<p class="mt-4 text-base leading-7 text-theme-base">
|
<%= @tag.content %>
|
||||||
<%= @tag.content %>
|
</p>
|
||||||
</p>
|
|
||||||
|
|
||||||
<div class="w-full mt-6 sm:w-auto flex flex-col gap-1.5">
|
<div class="w-full mt-6 sm:w-auto flex flex-col gap-1.5">
|
||||||
<.note_list notes={@tag.notes} />
|
<.note_list notes={@tag.notes} />
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
|
@ -1,5 +1,5 @@
|
||||||
<section>
|
<section>
|
||||||
<header class="mx-auto max-w-2xl">
|
<header>
|
||||||
<h1 class="mt-16 lg:text-5xl md:text-4xl text-3xl font-bold text-theme-base">
|
<h1 class="mt-16 lg:text-5xl md:text-4xl text-3xl font-bold text-theme-base">
|
||||||
Wiki
|
Wiki
|
||||||
</h1>
|
</h1>
|
||||||
|
|
Loading…
Reference in a new issue