postnhost 0.0.0 → 0.1.1

data/app/views/postnhost/public/templates/workspace-journal/articles/show.html.erb

@@ -0,0 +1,120 @@
+<%= render "postnhost/public/articles/content_for/show" %>
+
+<article class="mx-auto max-w-[1800px] px-6 pt-8 lg:px-10 lg:pt-14">
+  <div class="grid grid-cols-1 gap-8 lg:gap-12 xl:grid-cols-[minmax(0,1fr)_minmax(0,820px)_minmax(0,1fr)]">
+    <aside class="max-w-[260px] xl:sticky xl:top-28 xl:col-start-1 xl:row-start-1 xl:self-start xl:pb-16">
+      <%= link_to language_root_path(@current_language), class: "inline-flex items-center gap-2 text-sm/6 text-[#85827d] hover:text-[#1f1f1f] cursor-pointer" do %>
+        <%= icon("arrow-left-long", css_class: "size-5") %>
+        <%= t("postnhost.public.blog.back_to_articles") %>
+      <% end %>
+
+      <% if @article.categories.any? %>
+        <div class="mt-5 h-px w-24 bg-[#e4e2de] lg:mt-9"></div>
+        <nav class="mt-4 flex flex-col items-start gap-3 lg:mt-7" aria-label="<%= t("postnhost.public.footer.explore_categories") %>">
+          <% @article.categories.each do |category| %>
+            <%= link_to localized_category_name(category, @current_language),
+                  language_category_path(category.slug, @current_language),
+                  class: "text-sm/6 text-[#77736e] hover:text-[#1f1f1f] cursor-pointer" %>
+          <% end %>
+        </nav>
+      <% end %>
+    </aside>
+
+    <div class="min-w-0 lg:mx-auto lg:w-full lg:max-w-[820px] xl:col-start-2 xl:row-start-1 xl:mx-0 xl:max-w-none">
+      <% cache [public_site_revision, @article, @article_variant, article_authors_cache_key(@article), "workspace-journal_header"].compact do %>
+        <header>
+          <div class="flex flex-wrap items-center gap-x-2 gap-y-1 text-sm/6 text-[#85827d]">
+            <time datetime="<%= @article.published_at.to_date.iso8601 %>">
+              <%= l @article.published_at.to_date, format: :long %>
+            </time>
+            <% if @article.categories.any? %>
+              <span aria-hidden="true">/</span>
+              <%= link_to localized_category_name(@article.categories.first, @current_language),
+                    language_category_path(@article.categories.first.slug, @current_language),
+                    class: "underline decoration-[#c7c3bc] underline-offset-4 hover:text-[#1f1f1f] cursor-pointer" %>
+            <% end %>
+          </div>
+
+          <h1 class="mt-5 break-words text-[2.5rem] font-semibold leading-[0.98] text-[#111111] sm:text-[3.5rem]">
+            <%= @content.title %>
+          </h1>
+
+          <%= render "postnhost/public/templates/workspace-journal/shared/article_authors", authors: article_authors(@article), current_language: @current_language %>
+        </header>
+      <% end %>
+
+      <% if @article.cover_image? %>
+        <div class="mt-8 lg:mt-12">
+          <%= render "postnhost/public/templates/workspace-journal/shared/hero_cover_image",
+                publication: @article,
+                alt_text: @content.title,
+                image_class: "aspect-[16/9] w-full rounded-md border border-[#e8e6e1] bg-[#f7f6f3] object-cover" %>
+        </div>
+      <% end %>
+
+      <% if user_signed_in? %>
+        <div class="pt-5 lg:pt-7">
+          <%= link_to(@article_variant.present? ? edit_article_variant_path(@article.article_id, @article_variant.article_variant_id) : edit_article_path(@article.article_id),
+                data: { turbo_prefetch: false },
+                class: "inline-flex items-center gap-2 rounded-md border border-[#e4e2de] px-3 py-2 text-sm/6 font-medium text-[#5f5d59] hover:bg-[#f7f6f3] hover:text-[#1f1f1f] cursor-pointer") do %>
+            <%= icon("edit", css_class: "size-4") %>
+            Edit
+          <% end %>
+        </div>
+      <% end %>
+
+      <% cache [public_site_revision, @article, @article_variant, "workspace-journal_content"].compact do %>
+        <div class="pt-8 lg:pt-12">
+          <div class="prose prose-zinc max-w-none prose-headings:font-semibold prose-headings:leading-tight prose-headings:text-[#111111] prose-p:font-serif prose-p:text-lg prose-p:leading-8 prose-p:text-[#2f2f2f] prose-a:text-[#1f1f1f] prose-a:underline prose-a:decoration-[#c7c3bc] prose-a:underline-offset-4 prose-blockquote:border-l-[#d8d5cf] prose-blockquote:text-[#5f5d59]">
+            <%= render_article_content(@content.content) %>
+          </div>
+        </div>
+      <% end %>
+    </div>
+  </div>
+</article>
+
+<% if @available_variants.count > 1 || (@article.published? && @available_variants.any?) %>
+  <section class="mx-auto max-w-[1800px] px-6 pt-8 lg:px-10 lg:pt-10">
+    <div class="grid grid-cols-1 gap-8 lg:gap-12 xl:grid-cols-[minmax(0,1fr)_minmax(0,820px)_minmax(0,1fr)]">
+      <div class="lg:mx-auto lg:w-full lg:max-w-[820px] xl:col-start-2 xl:mx-0 xl:max-w-none">
+        <div class="border-y border-[#eeeeec] py-5">
+          <p class="mb-3 text-sm/6 font-semibold text-[#1f1f1f]"><%= t("postnhost.public.blog.available_in_languages") %></p>
+          <div class="flex flex-wrap gap-2">
+            <% if @article.published? %>
+              <%= link_to public_article_path(@article.slug), class: "rounded-md px-3 py-2 text-sm/6 font-medium #{@content == @article ? 'bg-[#1f1f1f] text-white' : 'bg-[#f7f6f3] text-[#5f5d59] hover:bg-[#eeeeec] hover:text-[#1f1f1f]'} cursor-pointer" do %>
+                <%= @primary_language.name %>
+              <% end %>
+            <% end %>
+
+            <% @available_variants.each do |variant| %>
+              <%= link_to localized_public_article_path(variant.language.html_lang, @article.slug), class: "rounded-md px-3 py-2 text-sm/6 font-medium #{@content == variant ? 'bg-[#1f1f1f] text-white' : 'bg-[#f7f6f3] text-[#5f5d59] hover:bg-[#eeeeec] hover:text-[#1f1f1f]'} cursor-pointer" do %>
+                <%= variant.language.name %>
+              <% end %>
+            <% end %>
+          </div>
+        </div>
+      </div>
+    </div>
+  </section>
+<% end %>
+
+<%= render "postnhost/public/templates/workspace-journal/articles/suggestions" %>
+
+<div class="mx-auto max-w-[1800px] px-6 pt-8 lg:px-10 lg:pt-10">
+  <div class="grid grid-cols-1 gap-8 lg:gap-12 xl:grid-cols-[minmax(0,1fr)_minmax(0,820px)_minmax(0,1fr)]">
+    <div class="flex flex-col gap-4 border-t border-[#eeeeec] pt-5 sm:flex-row sm:items-center sm:justify-between lg:mx-auto lg:w-full lg:max-w-[820px] lg:pt-6 xl:col-start-2 xl:mx-0 xl:max-w-none">
+      <%= link_to language_root_path(@current_language), class: "inline-flex items-center gap-2 text-sm/6 text-[#85827d] hover:text-[#1f1f1f] cursor-pointer" do %>
+        <%= icon("arrow-left-long", css_class: "size-4") %>
+        <%= t("postnhost.public.blog.back_to_articles") %>
+      <% end %>
+
+      <% if @article.categories.any? %>
+        <%= link_to language_category_path(@article.categories.first.slug, @current_language), class: "inline-flex items-center gap-2 text-sm/6 text-[#85827d] hover:text-[#1f1f1f] cursor-pointer" do %>
+          <%= t("postnhost.public.blog.more_in_category", category: localized_category_name(@article.categories.first, @current_language)) %>
+          <%= icon("arrow-right-long", css_class: "size-4") %>
+        <% end %>
+      <% end %>
+    </div>
+  </div>
+</div>

data/app/views/postnhost/public/templates/workspace-journal/authors/_article_card.html.erb

@@ -0,0 +1 @@
+<%= render "postnhost/public/templates/workspace-journal/shared/article_card", item: item, index: local_assigns.fetch(:index) { item_counter + local_assigns.fetch(:index_offset, 0) }, show_author: false %>

data/app/views/postnhost/public/templates/workspace-journal/authors/_profile_block.html.erb

@@ -0,0 +1,32 @@
+<section>
+  <div class="max-w-44">
+    <%= render "postnhost/public/templates/workspace-journal/shared/author_avatar", user: author, size_class: "aspect-square w-full", text_size_class: "text-5xl" %>
+  </div>
+
+  <h1 class="mt-5 text-[2.5rem] font-semibold leading-none text-[#111111] sm:text-[3rem] lg:mt-8 lg:text-[2.875rem]">
+    <%= author_name(author) %>
+  </h1>
+
+  <% if author.position.present? %>
+    <p class="mt-5 text-sm/6 font-medium text-[#85827d]"><%= author.position %></p>
+  <% end %>
+
+  <% if author.bio.present? %>
+    <p class="mt-4 max-w-[18rem] text-sm/6 text-[#77736e] lg:mt-6"><%= author.bio %></p>
+  <% end %>
+
+  <% if author_social_links(author).any? %>
+    <div class="mt-6 flex flex-wrap gap-2 border-t border-[#eeeeec] pt-5 lg:mt-8">
+      <% author_social_links(author).each do |social| %>
+        <%= link_to social[:url],
+              target: "_blank",
+              rel: "noopener noreferrer",
+              class: "inline-flex size-9 items-center justify-center rounded-md text-[#85827d] hover:bg-[#f7f6f3] hover:text-[#1f1f1f] cursor-pointer",
+              aria: { label: social[:label] },
+              title: social[:label] do %>
+          <%= icon(social[:icon], css_class: "size-4") %>
+        <% end %>
+      <% end %>
+    </div>
+  <% end %>
+</section>

data/app/views/postnhost/public/templates/workspace-journal/authors/show.html.erb

@@ -0,0 +1,33 @@
+<%= render "postnhost/public/authors/content_for/show" %>
+
+<section class="mx-auto max-w-[1800px] px-6 pb-8 pt-10 lg:px-10 lg:pb-10 lg:pt-12">
+  <div class="grid grid-cols-1 gap-8 lg:grid-cols-[260px_minmax(0,1fr)] lg:gap-12 xl:grid-cols-[300px_minmax(0,1fr)]">
+    <aside class="lg:sticky lg:top-28 lg:self-start lg:border-r lg:border-[#eeeeec] lg:pb-16 lg:pr-16">
+      <%= render "postnhost/public/templates/workspace-journal/authors/profile_block", author: @author %>
+    </aside>
+
+    <div class="min-w-0">
+      <div class="mb-6 border-b border-[#eeeeec] pb-4 lg:mb-8">
+        <h2 class="text-lg/6 font-semibold text-[#1f1f1f]"><%= t("postnhost.public.authors.latest_from_author") %></h2>
+      </div>
+
+      <% if category_articles.any? %>
+        <div class="grid grid-cols-1 gap-x-16 gap-y-10 md:grid-cols-2 lg:gap-y-14">
+          <%= render partial: "postnhost/public/templates/workspace-journal/authors/article_card",
+                collection: category_articles,
+                as: :item,
+                cached: ->(item) { [public_site_revision, item, "workspace-journal_author_card"] } %>
+        </div>
+
+        <div class="pt-8 lg:pt-10">
+          <%= render "postnhost/public/templates/workspace-journal/shared/pagination", pagy: @pagy %>
+        </div>
+      <% else %>
+        <div class="border-y border-[#eeeeec] py-10 text-center lg:py-12">
+          <h3 class="text-xl/7 font-semibold text-[#1f1f1f]"><%= t("postnhost.public.authors.no_articles") %></h3>
+          <p class="mt-3 text-sm/6 text-[#77736e]"><%= t("postnhost.public.authors.no_articles_description") %></p>
+        </div>
+      <% end %>
+    </div>
+  </div>
+</section>

data/app/views/postnhost/public/templates/workspace-journal/categories/_article_card.html.erb

@@ -0,0 +1 @@
+<%= render "postnhost/public/templates/workspace-journal/shared/article_card", item: item, index: local_assigns.fetch(:index) { item_counter + local_assigns.fetch(:index_offset, 0) }, show_category: false %>

data/app/views/postnhost/public/templates/workspace-journal/categories/index.html.erb

@@ -0,0 +1,58 @@
+<%= render "postnhost/public/categories/content_for/index" %>
+
+<% if category_articles.any? %>
+  <section class="mx-auto max-w-[1800px] px-6 pb-8 pt-10 lg:px-10 lg:pb-10 lg:pt-12">
+    <div class="grid grid-cols-1 gap-8 lg:grid-cols-[260px_minmax(0,1fr)] lg:gap-12 xl:grid-cols-[300px_minmax(0,1fr)]">
+      <aside class="lg:sticky lg:top-28 lg:self-start lg:border-r lg:border-[#eeeeec] lg:pb-16 lg:pr-16">
+        <h1 class="text-[2.5rem] font-semibold leading-none text-[#111111] sm:text-[3rem] lg:text-[2.875rem]">
+          <%= public_category_heading(@category) %>
+        </h1>
+
+        <% if show_public_category_description?(@category) %>
+          <p class="mt-4 max-w-[18rem] text-sm/6 text-[#77736e] lg:mt-6">
+            <%= public_category_description(@category) %>
+          </p>
+        <% end %>
+
+        <%= render "postnhost/public/templates/workspace-journal/shared/category_navigation" %>
+      </aside>
+
+      <div class="min-w-0">
+        <div class="grid grid-cols-1 gap-x-16 gap-y-10 md:grid-cols-2 lg:gap-y-14">
+          <%= render partial: "postnhost/public/templates/workspace-journal/categories/article_card",
+                collection: category_articles,
+                as: :item,
+                cached: ->(item) { [public_site_revision, item, article_authors_cache_key(item), "workspace-journal_category_card"] } %>
+        </div>
+
+        <div class="pt-8 lg:pt-10">
+          <%= render "postnhost/public/templates/workspace-journal/shared/pagination", pagy: @pagy %>
+        </div>
+      </div>
+    </div>
+  </section>
+<% else %>
+  <section class="mx-auto max-w-[1800px] px-6 py-12 lg:px-10 lg:py-16">
+    <div class="grid grid-cols-1 gap-8 lg:grid-cols-[260px_minmax(0,1fr)] lg:gap-12 xl:grid-cols-[300px_minmax(0,1fr)]">
+      <aside class="lg:border-r lg:border-[#eeeeec] lg:pr-16">
+        <h1 class="text-[2.5rem] font-semibold leading-none text-[#111111] sm:text-[3rem] lg:text-[2.875rem]">
+          <%= public_category_heading(@category) %>
+        </h1>
+
+        <% if show_public_category_description?(@category) %>
+          <p class="mt-4 max-w-[18rem] text-sm/6 text-[#77736e] lg:mt-6">
+            <%= public_category_description(@category) %>
+          </p>
+        <% end %>
+
+        <%= render "postnhost/public/templates/workspace-journal/shared/category_navigation" %>
+      </aside>
+
+      <div class="border-y border-[#eeeeec] py-10 text-center lg:py-12">
+        <h2 class="text-xl/7 font-semibold text-[#1f1f1f]"><%= t("postnhost.public.category.no_articles") %></h2>
+        <p class="mt-3 text-sm/6 text-[#77736e]"><%= t("postnhost.public.category.no_articles_description") %></p>
+        <%= link_to t("postnhost.public.blog.browse_all_articles"), language_root_path(@current_language), class: "mt-6 inline-flex items-center rounded-md bg-[#1f1f1f] px-4 py-2 text-sm/6 font-medium text-white hover:bg-[#3b3a37] cursor-pointer lg:mt-8" %>
+      </div>
+    </div>
+  </section>
+<% end %>

data/app/views/postnhost/public/templates/workspace-journal/shared/_article_authors.html.erb

@@ -0,0 +1,27 @@
+<% if authors.any? || local_assigns[:published_at].present? %>
+  <div class="mt-5 flex flex-col gap-4 text-left sm:flex-row sm:items-center sm:justify-between lg:mt-7">
+    <% if authors.any? %>
+      <div class="flex flex-col gap-4 sm:flex-row sm:flex-wrap sm:items-center">
+        <% authors.each do |author| %>
+          <div class="flex min-w-0 items-center gap-3.5">
+            <%= render "postnhost/public/templates/workspace-journal/shared/author_avatar", user: author, size_class: "size-12", text_size_class: "text-sm" %>
+            <div class="min-w-0">
+              <% if author_pages_enabled? %>
+                <%= link_to author_name(author), language_author_path(author.slug, current_language), class: "block truncate text-sm/6 font-medium text-[#1f1f1f] hover:text-[#5f5d59] cursor-pointer" %>
+              <% else %>
+                <span class="block truncate text-sm/6 font-medium text-[#1f1f1f]"><%= author_name(author) %></span>
+              <% end %>
+              <p class="truncate text-sm/6 text-[#a6a29d]"><%= article_author_label(author) %></p>
+            </div>
+          </div>
+        <% end %>
+      </div>
+    <% end %>
+
+    <% if local_assigns[:published_at].present? %>
+      <time datetime="<%= local_assigns[:published_at].to_date.iso8601 %>" class="text-sm/6 text-[#85827d]">
+        <%= l local_assigns[:published_at].to_date, format: :long %>
+      </time>
+    <% end %>
+  </div>
+<% end %>

data/app/views/postnhost/public/templates/workspace-journal/shared/_article_card.html.erb

@@ -0,0 +1,44 @@
+<article class="group break-words">
+  <% if category_article(item).cover_image? %>
+    <%= link_to category_article_url(item), class: "mb-5 block cursor-pointer", "aria-label": t("postnhost.public.blog.read_article_aria_label", title: item.title) do %>
+      <%= render "postnhost/public/templates/workspace-journal/shared/thumbnail_cover_image",
+            publication: category_article(item),
+            index: index,
+            image_class: "aspect-[16/9] w-full rounded-md border border-[#e8e6e1] bg-[#f7f6f3] object-cover" %>
+    <% end %>
+  <% end %>
+
+  <% if local_assigns.fetch(:show_category, true) && category_article(item).categories.any? %>
+    <%= link_to localized_category_name(category_article(item).categories.first, @current_language),
+          language_category_path(category_article(item).categories.first.slug, @current_language),
+          class: "text-sm/6 font-medium text-[#85827d] hover:text-[#1f1f1f] cursor-pointer" %>
+  <% end %>
+
+  <%= link_to category_article_url(item), class: "mt-2 block cursor-pointer", "aria-label": t("postnhost.public.blog.read_article_aria_label", title: item.title) do %>
+    <h3 class="text-xl/7 font-semibold text-[#1f1f1f] group-hover:text-[#5f5d59]">
+      <%= item.title %>
+    </h3>
+
+    <% if article_excerpt(item).present? %>
+      <p class="mt-3 line-clamp-3 text-sm/6 text-[#77736e]">
+        <%= article_excerpt(item) %>
+      </p>
+    <% end %>
+  <% end %>
+
+  <div class="mt-5 flex items-center gap-3">
+    <% if local_assigns.fetch(:show_author, true) && author_name(category_article_author_user(item)).present? %>
+      <%= render "postnhost/public/templates/workspace-journal/shared/author_avatar", user: category_article_author_user(item), size_class: "size-11", text_size_class: "text-sm" %>
+      <div class="min-w-0">
+        <p class="truncate text-sm/6 font-medium text-[#1f1f1f]"><%= author_name(category_article_author_user(item)) %></p>
+        <time datetime="<%= category_article(item).published_at.to_date.iso8601 %>" class="block truncate text-sm/6 text-[#a6a29d]">
+          <%= l category_article(item).published_at.to_date, format: :long %>
+        </time>
+      </div>
+    <% else %>
+      <time datetime="<%= category_article(item).published_at.to_date.iso8601 %>" class="text-sm/6 text-[#85827d]">
+        <%= l category_article(item).published_at.to_date, format: :long %>
+      </time>
+    <% end %>
+  </div>
+</article>

data/app/views/postnhost/public/templates/workspace-journal/shared/_author_avatar.html.erb

@@ -0,0 +1,9 @@
+<div class="<%= size_class %> flex items-center justify-center overflow-hidden rounded-md bg-zinc-950 text-[#fbfaf7]">
+  <% if author_avatar(user).present? %>
+    <%= image_tag author_avatar(user), class: "h-full w-full object-cover", alt: "Author Image" %>
+  <% elsif author_initials(user).present? %>
+    <span class="<%= text_size_class %> font-semibold uppercase">
+      <%= author_initials(user) %>
+    </span>
+  <% end %>
+</div>

data/app/views/postnhost/public/templates/workspace-journal/shared/_category_navigation.html.erb

@@ -0,0 +1,10 @@
+<% if @sidebar_categories.any? %>
+  <div class="mt-6 hidden h-px w-24 bg-[#e4e2de] lg:mt-9 lg:block"></div>
+  <nav class="mt-5 hidden flex-col items-start gap-3 lg:mt-7 lg:flex" aria-label="<%= t("postnhost.public.footer.explore_categories") %>">
+    <% @sidebar_categories.each do |category| %>
+      <%= link_to localized_category_name(category, @current_language),
+            language_category_path(category.slug, @current_language),
+            class: "text-sm/6 text-[#77736e] hover:text-[#1f1f1f] cursor-pointer" %>
+    <% end %>
+  </nav>
+<% end %>

data/app/views/postnhost/public/templates/workspace-journal/shared/_hero_cover_image.html.erb

@@ -0,0 +1,11 @@
+<% if publication.cover_image? %>
+  <%= image_tag publication.cover_image.thumbnail.url,
+        loading: "eager",
+        fetchpriority: "high",
+        alt: publication.cover_image_alt.presence || local_assigns[:alt_text] || publication.title,
+        width: 1200,
+        height: 675,
+        class: local_assigns.fetch(:image_class, "aspect-[16/9] w-full rounded-md bg-zinc-100 object-cover"),
+        srcset: "#{publication.cover_image.thumbnail.url} 520w, #{publication.cover_image.medium.url} 1024w, #{publication.cover_image.url} 1200w",
+        sizes: "(max-width: 639px) 100vw, (max-width: 1279px) 90vw, 1200px" %>
+<% end %>

data/app/views/postnhost/public/templates/workspace-journal/shared/_pagination.html.erb

@@ -0,0 +1,35 @@
+<% if pagy.pages > 1 %>
+  <nav class="flex items-center justify-center gap-1 border-y border-zinc-950/10 py-4 lg:py-6">
+    <% if pagy.previous %>
+      <%= link_to pagination_url(pagy, pagy.previous), class: "inline-flex size-10 items-center justify-center rounded-md text-zinc-600 hover:bg-zinc-950/5 hover:text-zinc-950 cursor-pointer", aria: { label: t("postnhost.public.pagination.previous") } do %>
+        <%= icon("chevron-left", css_class: "size-5") %>
+      <% end %>
+    <% else %>
+      <span class="inline-flex size-10 items-center justify-center rounded-md text-zinc-300" role="link" aria-label="<%= t("postnhost.public.pagination.previous") %>" aria-disabled="true">
+        <%= icon("chevron-left", css_class: "size-5") %>
+      </span>
+    <% end %>
+
+    <% pagination_series(pagy).each do |item| %>
+      <% if item.is_a?(Integer) %>
+        <% if item == pagy.page %>
+          <span class="inline-flex size-10 items-center justify-center rounded-md bg-zinc-950 text-sm font-medium text-[#fbfaf7]" aria-current="page"><%= item %></span>
+        <% else %>
+          <%= link_to item, pagination_url(pagy, item), class: "inline-flex size-10 items-center justify-center rounded-md text-sm font-medium text-zinc-600 hover:bg-zinc-950/5 hover:text-zinc-950 cursor-pointer" %>
+        <% end %>
+      <% elsif item == :gap %>
+        <span class="inline-flex size-10 items-center justify-center text-sm text-zinc-400">…</span>
+      <% end %>
+    <% end %>
+
+    <% if pagy.next %>
+      <%= link_to pagination_url(pagy, pagy.next), class: "inline-flex size-10 items-center justify-center rounded-md text-zinc-600 hover:bg-zinc-950/5 hover:text-zinc-950 cursor-pointer", aria: { label: t("postnhost.public.pagination.next") } do %>
+        <%= icon("chevron-right", css_class: "size-5") %>
+      <% end %>
+    <% else %>
+      <span class="inline-flex size-10 items-center justify-center rounded-md text-zinc-300" role="link" aria-label="<%= t("postnhost.public.pagination.next") %>" aria-disabled="true">
+        <%= icon("chevron-right", css_class: "size-5") %>
+      </span>
+    <% end %>
+  </nav>
+<% end %>

data/app/views/postnhost/public/templates/workspace-journal/shared/_thumbnail_cover_image.html.erb

@@ -0,0 +1,9 @@
+<% if publication.cover_image? %>
+  <%= image_tag publication.cover_image.thumbnail.url,
+        loading: index.to_i < 3 ? "eager" : "lazy",
+        fetchpriority: index.to_i < 3 ? "high" : "auto",
+        alt: publication.cover_image_alt.presence || publication.title,
+        width: 520,
+        height: 325,
+        class: local_assigns.fetch(:image_class, "aspect-[16/10] w-full rounded-md bg-zinc-100 object-cover") %>
+<% end %>

data/app/views/postnhost/public/templates/workspace-journal/static_pages/show.html.erb

@@ -0,0 +1,17 @@
+<%= render "postnhost/public/static_pages/content_for/show" %>
+
+<header class="mx-auto max-w-[1800px] px-6 pt-10 lg:px-10 lg:pt-14">
+  <div class="mx-auto max-w-[820px]">
+    <h1 class="break-words text-[2.5rem] font-semibold leading-[0.98] text-[#111111] sm:text-[3.5rem]">
+      <%= @content.title %>
+    </h1>
+  </div>
+</header>
+
+<article class="mx-auto max-w-[1800px] px-6 pt-8 lg:px-10 lg:pt-12">
+  <div class="mx-auto max-w-[820px]">
+    <div class="prose prose-zinc max-w-none prose-headings:font-semibold prose-headings:leading-tight prose-headings:text-[#111111] prose-p:font-serif prose-p:text-lg prose-p:leading-8 prose-p:text-[#2f2f2f] prose-a:text-[#1f1f1f] prose-a:underline prose-a:decoration-[#c7c3bc] prose-a:underline-offset-4 prose-blockquote:border-l-[#d8d5cf] prose-blockquote:text-[#5f5d59]">
+      <%= render_article_content(@content.content) %>
+    </div>
+  </div>
+</article>

data/app/views/postnhost/sessions/new.html.erb

@@ -0,0 +1,59 @@
+<% content_for :title, "Sign In" %>
+<% content_for :meta_description, "Sign in to your account to access your dashboard and manage your blog." %>
+<% content_for :robots, "noindex, nofollow" %>
+
+<div class="flex min-h-dvh min-h-screen bg-gray-50 pb-[max(1rem,env(safe-area-inset-bottom))] pt-[max(0.75rem,env(safe-area-inset-top))]">
+  <div class="flex w-full min-w-0 flex-1 flex-col justify-center px-4 sm:px-6 lg:px-8 sm:-mt-10">
+    <div class="mx-auto w-full max-w-md">
+      <div class="bg-white border border-gray-200 rounded-2xl p-5 sm:p-8">
+        <div class="space-y-6">
+          <div class="text-center space-y-2">
+            <h1 class="text-2xl font-semibold text-gray-900 tracking-tight">
+              Welcome back
+            </h1>
+            <p class="text-sm text-gray-600">
+              Sign in to your account to continue
+            </p>
+          </div>
+
+          <%= form_with scope: :user, url: session_path, class: "space-y-5" do |f| %>
+            <%= render "postnhost/shared/flash_messages" %>
+
+            <div class="space-y-4">
+              <div>
+                <%= f.email_field :email,
+                    autofocus: true,
+                    autocomplete: "email",
+                    placeholder: "Enter your email address",
+                    required: true,
+                    class: "block w-full rounded-xl border-gray-200 bg-gray-50 px-4 py-3 text-sm font-medium text-gray-900 placeholder-gray-500 transition-all duration-200 focus:border-gray-900 focus:bg-white focus:ring-0" %>
+              </div>
+
+              <div>
+                <%= f.password_field :password,
+                    autocomplete: "current-password",
+                    placeholder: "Enter your password",
+                    required: true,
+                    class: "block w-full rounded-xl border-gray-200 bg-gray-50 px-4 py-3 text-sm font-medium text-gray-900 placeholder-gray-500 transition-all duration-200 focus:border-gray-900 focus:bg-white focus:ring-0" %>
+              </div>
+            </div>
+
+            <button type="submit" class="group relative w-full overflow-hidden rounded-xl bg-gray-900 px-4 py-3 font-medium text-white transition-all duration-300 hover:bg-gray-800 focus:outline-none focus:ring-2 focus:ring-gray-900 focus:ring-offset-2 cursor-pointer">
+              <span class="relative flex items-center justify-center">
+                Sign in
+                <%= icon("arrow-right", css_class: "ml-2 h-4 w-4 transition-transform group-hover:translate-x-1") %>
+              </span>
+            </button>
+          <% end %>
+        </div>
+      </div>
+
+      <div class="mt-4 flex justify-center">
+        <a href="https://postnhost.com" target="_blank" rel="noopener noreferrer" class="inline-flex items-center gap-1.5 text-xs text-gray-400 hover:text-gray-600 transition-colors">
+          Powered by
+          <%= image_tag "postnhost/logo.webp", alt: "PostnHost", class: "h-4 w-auto opacity-60 hover:opacity-100 transition-opacity", width: 80, height: 16 %>
+        </a>
+      </div>
+    </div>
+  </div>
+</div>

data/app/views/postnhost/settings/edit.html.erb

@@ -0,0 +1,68 @@
+<% content_for :title, "Settings" %>
+
+<div class="space-y-8">
+  <div class="grid grid-cols-1 lg:grid-cols-4 gap-6">
+    <aside class="lg:col-span-1">
+      <nav class="bg-white rounded-2xl border border-gray-200 p-2">
+        <%= link_to edit_settings_path(section: 'site'),
+          class: "group flex items-center space-x-3 px-3 py-2.5 rounded-xl text-sm font-medium transition-all duration-200 #{@active_section == 'site' ? 'bg-gray-900 text-white' : 'text-gray-700 hover:text-gray-900 hover:bg-gray-50'}" do %>
+          <%= icon('settings', css_class: "h-5 w-5 #{@active_section == 'site' ? 'text-white' : 'text-gray-500 group-hover:text-gray-700'}") %>
+          <span>Site</span>
+        <% end %>
+
+        <%= link_to edit_settings_path(section: 'assets'),
+          class: "group mt-1 flex items-center space-x-3 px-3 py-2.5 rounded-xl text-sm font-medium transition-all duration-200 #{@active_section == 'assets' ? 'bg-gray-900 text-white' : 'text-gray-700 hover:text-gray-900 hover:bg-gray-50'}" do %>
+          <%= icon('image', css_class: "h-5 w-5 #{@active_section == 'assets' ? 'text-white' : 'text-gray-500 group-hover:text-gray-700'}") %>
+          <span>Assets</span>
+        <% end %>
+
+        <%= link_to edit_settings_path(section: 'i18n'),
+          class: "group mt-1 flex items-center space-x-3 px-3 py-2.5 rounded-xl text-sm font-medium transition-all duration-200 #{@active_section == 'i18n' ? 'bg-gray-900 text-white' : 'text-gray-700 hover:text-gray-900 hover:bg-gray-50'}" do %>
+          <%= icon('language', css_class: "h-5 w-5 #{@active_section == 'i18n' ? 'text-white' : 'text-gray-500 group-hover:text-gray-700'}") %>
+          <span>I18n</span>
+        <% end %>
+
+        <%= link_to edit_settings_path(section: 'timezone'),
+          class: "group mt-1 flex items-center space-x-3 px-3 py-2.5 rounded-xl text-sm font-medium transition-all duration-200 #{@active_section == 'timezone' ? 'bg-gray-900 text-white' : 'text-gray-700 hover:text-gray-900 hover:bg-gray-50'}" do %>
+          <%= icon('clock', css_class: "h-5 w-5 #{@active_section == 'timezone' ? 'text-white' : 'text-gray-500 group-hover:text-gray-700'}") %>
+          <span>Timezone</span>
+        <% end %>
+
+        <%= link_to edit_settings_path(section: 'schema'),
+          class: "group mt-1 flex items-center space-x-3 px-3 py-2.5 rounded-xl text-sm font-medium transition-all duration-200 #{@active_section == 'schema' ? 'bg-gray-900 text-white' : 'text-gray-700 hover:text-gray-900 hover:bg-gray-50'}" do %>
+          <%= icon('layers', css_class: "h-5 w-5 #{@active_section == 'schema' ? 'text-white' : 'text-gray-500 group-hover:text-gray-700'}") %>
+          <span>Schema</span>
+        <% end %>
+
+        <%= link_to edit_settings_path(section: 'navigation'),
+          class: "group mt-1 flex items-center space-x-3 px-3 py-2.5 rounded-xl text-sm font-medium transition-all duration-200 #{@active_section == 'navigation' ? 'bg-gray-900 text-white' : 'text-gray-700 hover:text-gray-900 hover:bg-gray-50'}" do %>
+          <%= icon('bars', css_class: "h-5 w-5 #{@active_section == 'navigation' ? 'text-white' : 'text-gray-500 group-hover:text-gray-700'}") %>
+          <span>Navigation</span>
+        <% end %>
+
+        <%= link_to edit_settings_path(section: 'scripts'),
+          class: "group mt-1 flex items-center space-x-3 px-3 py-2.5 rounded-xl text-sm font-medium transition-all duration-200 #{@active_section == 'scripts' ? 'bg-gray-900 text-white' : 'text-gray-700 hover:text-gray-900 hover:bg-gray-50'}" do %>
+          <%= icon('code-bracket', css_class: "h-5 w-5 #{@active_section == 'scripts' ? 'text-white' : 'text-gray-500 group-hover:text-gray-700'}") %>
+          <span>Scripts</span>
+        <% end %>
+
+        <%= link_to edit_settings_path(section: 'feature_flags'),
+          class: "group mt-1 flex items-center space-x-3 px-3 py-2.5 rounded-xl text-sm font-medium transition-all duration-200 #{@active_section == 'feature_flags' ? 'bg-gray-900 text-white' : 'text-gray-700 hover:text-gray-900 hover:bg-gray-50'}" do %>
+          <%= icon('lightning', css_class: "h-5 w-5 #{@active_section == 'feature_flags' ? 'text-white' : 'text-gray-500 group-hover:text-gray-700'}") %>
+          <span>Feature Flags</span>
+        <% end %>
+
+      </nav>
+    </aside>
+
+    <section class="lg:col-span-3 bg-white rounded-2xl border border-gray-200 p-6">
+      <% if %w[site timezone assets i18n schema navigation feature_flags scripts].include?(@active_section) %>
+        <%= render "postnhost/settings/sections/#{@active_section}" %>
+      <% else %>
+        <div class="rounded-xl border border-yellow-200 bg-yellow-50 px-4 py-3 text-sm text-yellow-900">
+          Unknown settings section.
+        </div>
+      <% end %>
+    </section>
+  </div>
+</div>

data/app/views/postnhost/settings/sections/_assets.html.erb

@@ -0,0 +1,40 @@
+<div class="mb-6">
+  <h2 class="text-xl font-medium tracking-tight text-gray-700">Assets</h2>
+  <p class="mt-1 text-sm text-gray-500">Upload branding images used across the public site.</p>
+</div>
+
+<%= form_with model: @setting, url: settings_path(section: 'assets'), method: :patch, multipart: true, class: "space-y-6", data: { controller: "file-auto-submit", file_auto_submit_target: "form" } do |f| %>
+  <%= render 'postnhost/shared/form_errors', resource: @setting %>
+
+  <div class="space-y-3">
+    <%= f.label :site_logo, 'Site Logo', class: form_label_classes %>
+    <div class="relative rounded-xl border border-gray-200 bg-gray-50 p-4">
+      <%= image_tag(setting_site_logo_src, alt: 'Site logo', class: 'h-9 w-auto', width: 180, height: 37) %>
+      <% if @setting.site_logo? %>
+        <%= link_to settings_path(section: 'assets', setting: { site_logo: nil }),
+          class: "absolute top-3 right-3 bg-white/90 hover:bg-red-50 text-gray-600 hover:text-red-600 p-1.5 rounded-lg shadow transition-colors cursor-pointer",
+          data: { turbo_method: :patch, turbo_confirm: 'Delete current site logo?' } do %>
+          <%= icon('trash', css_class: 'w-4 h-4') %>
+        <% end %>
+      <% end %>
+    </div>
+    <%= f.file_field :site_logo, accept: 'image/png,image/jpeg,image/gif,image/webp,image/heic', class: form_input_classes, data: { file_auto_submit_target: "input" } %>
+  </div>
+
+  <div class="space-y-3">
+    <%= f.label :og_image, 'Default OG Image', class: form_label_classes %>
+    <div class="relative rounded-xl border border-gray-200 bg-gray-50 p-4">
+      <%= image_tag(setting_og_image_src, alt: 'Default og image', class: 'w-full max-w-md rounded-lg object-cover', width: 1200, height: 630) %>
+      <% if @setting.og_image? %>
+        <%= link_to settings_path(section: 'assets', setting: { og_image: nil }),
+          class: "absolute top-3 right-3 bg-white/90 hover:bg-red-50 text-gray-600 hover:text-red-600 p-1.5 rounded-lg shadow transition-colors cursor-pointer",
+          data: { turbo_method: :patch, turbo_confirm: 'Delete current OG image?' } do %>
+          <%= icon('trash', css_class: 'w-4 h-4') %>
+        <% end %>
+      <% end %>
+    </div>
+    <%= f.file_field :og_image, accept: 'image/png,image/jpeg,image/gif,image/webp,image/heic', class: form_input_classes, data: { file_auto_submit_target: "input" } %>
+  </div>
+
+  <%= f.submit 'Save Assets', class: button_classes %>
+<% end %>