open_blog 0.1.0

data/lib/generators/open_blog/install/templates/theme/syntax.css

@@ -0,0 +1,358 @@
+.ob-highlight table td { padding: 5px; }
+.ob-highlight table pre { margin: 0; }
+.ob-highlight, .ob-highlight .w {
+  color: #24292f;
+  background-color: #f6f8fa;
+}
+.ob-highlight .k, .ob-highlight .kd, .ob-highlight .kn, .ob-highlight .kp, .ob-highlight .kr, .ob-highlight .kt, .ob-highlight .kv {
+  color: #cf222e;
+}
+.ob-highlight .gr {
+  color: #f6f8fa;
+}
+.ob-highlight .gd {
+  color: #82071e;
+  background-color: #ffebe9;
+}
+.ob-highlight .nb {
+  color: #953800;
+}
+.ob-highlight .nc {
+  color: #953800;
+}
+.ob-highlight .no {
+  color: #953800;
+}
+.ob-highlight .nn {
+  color: #953800;
+}
+.ob-highlight .sr {
+  color: #116329;
+}
+.ob-highlight .na {
+  color: #116329;
+}
+.ob-highlight .nt {
+  color: #116329;
+}
+.ob-highlight .gi {
+  color: #116329;
+  background-color: #dafbe1;
+}
+.ob-highlight .ges {
+  font-weight: bold;
+  font-style: italic;
+}
+.ob-highlight .kc {
+  color: #0550ae;
+}
+.ob-highlight .l, .ob-highlight .ld, .ob-highlight .m, .ob-highlight .mb, .ob-highlight .mf, .ob-highlight .mh, .ob-highlight .mi, .ob-highlight .il, .ob-highlight .mo, .ob-highlight .mx {
+  color: #0550ae;
+}
+.ob-highlight .sb {
+  color: #0550ae;
+}
+.ob-highlight .bp {
+  color: #0550ae;
+}
+.ob-highlight .ne {
+  color: #0550ae;
+}
+.ob-highlight .nl {
+  color: #0550ae;
+}
+.ob-highlight .py {
+  color: #0550ae;
+}
+.ob-highlight .nv, .ob-highlight .vc, .ob-highlight .vg, .ob-highlight .vi, .ob-highlight .vm {
+  color: #0550ae;
+}
+.ob-highlight .o, .ob-highlight .ow {
+  color: #0550ae;
+}
+.ob-highlight .gh {
+  color: #0550ae;
+  font-weight: bold;
+}
+.ob-highlight .gu {
+  color: #0550ae;
+  font-weight: bold;
+}
+.ob-highlight .s, .ob-highlight .sa, .ob-highlight .sc, .ob-highlight .dl, .ob-highlight .sd, .ob-highlight .s2, .ob-highlight .se, .ob-highlight .sh, .ob-highlight .sx, .ob-highlight .s1, .ob-highlight .ss {
+  color: #0a3069;
+}
+.ob-highlight .nd {
+  color: #8250df;
+}
+.ob-highlight .nf, .ob-highlight .fm {
+  color: #8250df;
+}
+.ob-highlight .err {
+  color: #f6f8fa;
+  background-color: #82071e;
+}
+.ob-highlight .c, .ob-highlight .ch, .ob-highlight .cd, .ob-highlight .cm, .ob-highlight .cp, .ob-highlight .cpf, .ob-highlight .c1, .ob-highlight .cs {
+  color: #6e7781;
+}
+.ob-highlight .gl {
+  color: #6e7781;
+}
+.ob-highlight .gt {
+  color: #6e7781;
+}
+.ob-highlight .ni {
+  color: #24292f;
+}
+.ob-highlight .si {
+  color: #24292f;
+}
+.ob-highlight .ge {
+  color: #24292f;
+  font-style: italic;
+}
+.ob-highlight .gs {
+  color: #24292f;
+  font-weight: bold;
+}
+
+[data-theme="dark"] .ob-highlight table td { padding: 5px; }
+[data-theme="dark"] .ob-highlight table pre { margin: 0; }
+[data-theme="dark"] .ob-highlight, [data-theme="dark"] .ob-highlight .w {
+  color: #c9d1d9;
+  background-color: #161b22;
+}
+[data-theme="dark"] .ob-highlight .k, [data-theme="dark"] .ob-highlight .kd, [data-theme="dark"] .ob-highlight .kn, [data-theme="dark"] .ob-highlight .kp, [data-theme="dark"] .ob-highlight .kr, [data-theme="dark"] .ob-highlight .kt, [data-theme="dark"] .ob-highlight .kv {
+  color: #ff7b72;
+}
+[data-theme="dark"] .ob-highlight .gr {
+  color: #f0f6fc;
+}
+[data-theme="dark"] .ob-highlight .gd {
+  color: #ffdcd7;
+  background-color: #67060c;
+}
+[data-theme="dark"] .ob-highlight .nb {
+  color: #ffa657;
+}
+[data-theme="dark"] .ob-highlight .nc {
+  color: #ffa657;
+}
+[data-theme="dark"] .ob-highlight .no {
+  color: #ffa657;
+}
+[data-theme="dark"] .ob-highlight .nn {
+  color: #ffa657;
+}
+[data-theme="dark"] .ob-highlight .sr {
+  color: #7ee787;
+}
+[data-theme="dark"] .ob-highlight .na {
+  color: #7ee787;
+}
+[data-theme="dark"] .ob-highlight .nt {
+  color: #7ee787;
+}
+[data-theme="dark"] .ob-highlight .gi {
+  color: #aff5b4;
+  background-color: #033a16;
+}
+[data-theme="dark"] .ob-highlight .ges {
+  font-weight: bold;
+  font-style: italic;
+}
+[data-theme="dark"] .ob-highlight .kc {
+  color: #79c0ff;
+}
+[data-theme="dark"] .ob-highlight .l, [data-theme="dark"] .ob-highlight .ld, [data-theme="dark"] .ob-highlight .m, [data-theme="dark"] .ob-highlight .mb, [data-theme="dark"] .ob-highlight .mf, [data-theme="dark"] .ob-highlight .mh, [data-theme="dark"] .ob-highlight .mi, [data-theme="dark"] .ob-highlight .il, [data-theme="dark"] .ob-highlight .mo, [data-theme="dark"] .ob-highlight .mx {
+  color: #79c0ff;
+}
+[data-theme="dark"] .ob-highlight .sb {
+  color: #79c0ff;
+}
+[data-theme="dark"] .ob-highlight .bp {
+  color: #79c0ff;
+}
+[data-theme="dark"] .ob-highlight .ne {
+  color: #79c0ff;
+}
+[data-theme="dark"] .ob-highlight .nl {
+  color: #79c0ff;
+}
+[data-theme="dark"] .ob-highlight .py {
+  color: #79c0ff;
+}
+[data-theme="dark"] .ob-highlight .nv, [data-theme="dark"] .ob-highlight .vc, [data-theme="dark"] .ob-highlight .vg, [data-theme="dark"] .ob-highlight .vi, [data-theme="dark"] .ob-highlight .vm {
+  color: #79c0ff;
+}
+[data-theme="dark"] .ob-highlight .o, [data-theme="dark"] .ob-highlight .ow {
+  color: #79c0ff;
+}
+[data-theme="dark"] .ob-highlight .gh {
+  color: #1f6feb;
+  font-weight: bold;
+}
+[data-theme="dark"] .ob-highlight .gu {
+  color: #1f6feb;
+  font-weight: bold;
+}
+[data-theme="dark"] .ob-highlight .s, [data-theme="dark"] .ob-highlight .sa, [data-theme="dark"] .ob-highlight .sc, [data-theme="dark"] .ob-highlight .dl, [data-theme="dark"] .ob-highlight .sd, [data-theme="dark"] .ob-highlight .s2, [data-theme="dark"] .ob-highlight .se, [data-theme="dark"] .ob-highlight .sh, [data-theme="dark"] .ob-highlight .sx, [data-theme="dark"] .ob-highlight .s1, [data-theme="dark"] .ob-highlight .ss {
+  color: #a5d6ff;
+}
+[data-theme="dark"] .ob-highlight .nd {
+  color: #d2a8ff;
+}
+[data-theme="dark"] .ob-highlight .nf, [data-theme="dark"] .ob-highlight .fm {
+  color: #d2a8ff;
+}
+[data-theme="dark"] .ob-highlight .err {
+  color: #f0f6fc;
+  background-color: #8e1519;
+}
+[data-theme="dark"] .ob-highlight .c, [data-theme="dark"] .ob-highlight .ch, [data-theme="dark"] .ob-highlight .cd, [data-theme="dark"] .ob-highlight .cm, [data-theme="dark"] .ob-highlight .cp, [data-theme="dark"] .ob-highlight .cpf, [data-theme="dark"] .ob-highlight .c1, [data-theme="dark"] .ob-highlight .cs {
+  color: #8b949e;
+}
+[data-theme="dark"] .ob-highlight .gl {
+  color: #8b949e;
+}
+[data-theme="dark"] .ob-highlight .gt {
+  color: #8b949e;
+}
+[data-theme="dark"] .ob-highlight .ni {
+  color: #c9d1d9;
+}
+[data-theme="dark"] .ob-highlight .si {
+  color: #c9d1d9;
+}
+[data-theme="dark"] .ob-highlight .ge {
+  color: #c9d1d9;
+  font-style: italic;
+}
+[data-theme="dark"] .ob-highlight .gs {
+  color: #c9d1d9;
+  font-weight: bold;
+}
+
+@media (prefers-color-scheme: dark) {
+html:not([data-theme="light"]) .ob-highlight table td { padding: 5px; }
+html:not([data-theme="light"]) .ob-highlight table pre { margin: 0; }
+html:not([data-theme="light"]) .ob-highlight, html:not([data-theme="light"]) .ob-highlight .w {
+  color: #c9d1d9;
+  background-color: #161b22;
+}
+html:not([data-theme="light"]) .ob-highlight .k, html:not([data-theme="light"]) .ob-highlight .kd, html:not([data-theme="light"]) .ob-highlight .kn, html:not([data-theme="light"]) .ob-highlight .kp, html:not([data-theme="light"]) .ob-highlight .kr, html:not([data-theme="light"]) .ob-highlight .kt, html:not([data-theme="light"]) .ob-highlight .kv {
+  color: #ff7b72;
+}
+html:not([data-theme="light"]) .ob-highlight .gr {
+  color: #f0f6fc;
+}
+html:not([data-theme="light"]) .ob-highlight .gd {
+  color: #ffdcd7;
+  background-color: #67060c;
+}
+html:not([data-theme="light"]) .ob-highlight .nb {
+  color: #ffa657;
+}
+html:not([data-theme="light"]) .ob-highlight .nc {
+  color: #ffa657;
+}
+html:not([data-theme="light"]) .ob-highlight .no {
+  color: #ffa657;
+}
+html:not([data-theme="light"]) .ob-highlight .nn {
+  color: #ffa657;
+}
+html:not([data-theme="light"]) .ob-highlight .sr {
+  color: #7ee787;
+}
+html:not([data-theme="light"]) .ob-highlight .na {
+  color: #7ee787;
+}
+html:not([data-theme="light"]) .ob-highlight .nt {
+  color: #7ee787;
+}
+html:not([data-theme="light"]) .ob-highlight .gi {
+  color: #aff5b4;
+  background-color: #033a16;
+}
+html:not([data-theme="light"]) .ob-highlight .ges {
+  font-weight: bold;
+  font-style: italic;
+}
+html:not([data-theme="light"]) .ob-highlight .kc {
+  color: #79c0ff;
+}
+html:not([data-theme="light"]) .ob-highlight .l, html:not([data-theme="light"]) .ob-highlight .ld, html:not([data-theme="light"]) .ob-highlight .m, html:not([data-theme="light"]) .ob-highlight .mb, html:not([data-theme="light"]) .ob-highlight .mf, html:not([data-theme="light"]) .ob-highlight .mh, html:not([data-theme="light"]) .ob-highlight .mi, html:not([data-theme="light"]) .ob-highlight .il, html:not([data-theme="light"]) .ob-highlight .mo, html:not([data-theme="light"]) .ob-highlight .mx {
+  color: #79c0ff;
+}
+html:not([data-theme="light"]) .ob-highlight .sb {
+  color: #79c0ff;
+}
+html:not([data-theme="light"]) .ob-highlight .bp {
+  color: #79c0ff;
+}
+html:not([data-theme="light"]) .ob-highlight .ne {
+  color: #79c0ff;
+}
+html:not([data-theme="light"]) .ob-highlight .nl {
+  color: #79c0ff;
+}
+html:not([data-theme="light"]) .ob-highlight .py {
+  color: #79c0ff;
+}
+html:not([data-theme="light"]) .ob-highlight .nv, html:not([data-theme="light"]) .ob-highlight .vc, html:not([data-theme="light"]) .ob-highlight .vg, html:not([data-theme="light"]) .ob-highlight .vi, html:not([data-theme="light"]) .ob-highlight .vm {
+  color: #79c0ff;
+}
+html:not([data-theme="light"]) .ob-highlight .o, html:not([data-theme="light"]) .ob-highlight .ow {
+  color: #79c0ff;
+}
+html:not([data-theme="light"]) .ob-highlight .gh {
+  color: #1f6feb;
+  font-weight: bold;
+}
+html:not([data-theme="light"]) .ob-highlight .gu {
+  color: #1f6feb;
+  font-weight: bold;
+}
+html:not([data-theme="light"]) .ob-highlight .s, html:not([data-theme="light"]) .ob-highlight .sa, html:not([data-theme="light"]) .ob-highlight .sc, html:not([data-theme="light"]) .ob-highlight .dl, html:not([data-theme="light"]) .ob-highlight .sd, html:not([data-theme="light"]) .ob-highlight .s2, html:not([data-theme="light"]) .ob-highlight .se, html:not([data-theme="light"]) .ob-highlight .sh, html:not([data-theme="light"]) .ob-highlight .sx, html:not([data-theme="light"]) .ob-highlight .s1, html:not([data-theme="light"]) .ob-highlight .ss {
+  color: #a5d6ff;
+}
+html:not([data-theme="light"]) .ob-highlight .nd {
+  color: #d2a8ff;
+}
+html:not([data-theme="light"]) .ob-highlight .nf, html:not([data-theme="light"]) .ob-highlight .fm {
+  color: #d2a8ff;
+}
+html:not([data-theme="light"]) .ob-highlight .err {
+  color: #f0f6fc;
+  background-color: #8e1519;
+}
+html:not([data-theme="light"]) .ob-highlight .c, html:not([data-theme="light"]) .ob-highlight .ch, html:not([data-theme="light"]) .ob-highlight .cd, html:not([data-theme="light"]) .ob-highlight .cm, html:not([data-theme="light"]) .ob-highlight .cp, html:not([data-theme="light"]) .ob-highlight .cpf, html:not([data-theme="light"]) .ob-highlight .c1, html:not([data-theme="light"]) .ob-highlight .cs {
+  color: #8b949e;
+}
+html:not([data-theme="light"]) .ob-highlight .gl {
+  color: #8b949e;
+}
+html:not([data-theme="light"]) .ob-highlight .gt {
+  color: #8b949e;
+}
+html:not([data-theme="light"]) .ob-highlight .ni {
+  color: #c9d1d9;
+}
+html:not([data-theme="light"]) .ob-highlight .si {
+  color: #c9d1d9;
+}
+html:not([data-theme="light"]) .ob-highlight .ge {
+  color: #c9d1d9;
+  font-style: italic;
+}
+html:not([data-theme="light"]) .ob-highlight .gs {
+  color: #c9d1d9;
+  font-weight: bold;
+}
+}
+.ob-highlight .gr { color: #cf222e; }
+.ob-highlight .c, .ob-highlight .ch, .ob-highlight .cd, .ob-highlight .cm, .ob-highlight .cp, .ob-highlight .cpf, .ob-highlight .c1, .ob-highlight .cs, .ob-highlight .gl, .ob-highlight .gt { color: #57606a; }
+[data-theme="dark"] .ob-highlight .gh, [data-theme="dark"] .ob-highlight .gu { color: #79c0ff; }
+@media (prefers-color-scheme: dark) {
+  html:not([data-theme="light"]) .ob-highlight .gh, html:not([data-theme="light"]) .ob-highlight .gu { color: #79c0ff; }
+}

data/lib/generators/open_blog/install/templates/theme/theme.css

@@ -0,0 +1,120 @@
+@import "./blog.css";
+@import "./syntax.css";
+@source "../../../views/open_blog";
+@source "../../../views/layouts/open_blog.html.erb";
+
+/* open-blog:tokens:start */
+:root {
+  --ob-surface: #ffffff;
+  --ob-surface-raised: #f8fafc;
+  --ob-surface-sunken: #f1f5f9;
+  --ob-heading: #0f172a;
+  --ob-text: #334155;
+  --ob-text-muted: #475569;
+  --ob-text-subtle: #526176;
+  --ob-border: #cbd5e1;
+  --ob-border-strong: #64748b;
+  --ob-accent: #1d4ed8;
+  --ob-accent-hover: #1e40af;
+  --ob-accent-soft: #dbeafe;
+  --ob-accent-contrast: #ffffff;
+  --ob-code-bg: #f6f8fa;
+  --ob-code-border: #94a3b8;
+  --ob-notice-bg: #eff6ff;
+  --ob-notice-border: #60a5fa;
+  --ob-notice-text: #1e3a8a;
+  --ob-note: #1d4ed8;
+  --ob-tip: #166534;
+  --ob-warning: #854d0e;
+  --ob-shadow: 0 8px 24px #0f172a1a;
+  --ob-font-display: ui-sans-serif, system-ui, sans-serif;
+  --ob-font-body: ui-sans-serif, system-ui, sans-serif;
+  --ob-font-mono: ui-monospace, SFMono-Regular, Consolas, monospace;
+  --ob-radius-card: 1rem;
+  --ob-radius-media: 0.75rem;
+  --ob-radius-pill: 999px;
+  --ob-prose-size: 1.125rem;
+  --ob-prose-leading: 1.8;
+  --ob-content-width: 56rem;
+  --ob-page-width: 72rem;
+}
+:root[data-theme="dark"] {
+  --ob-surface: #0f172a;
+  --ob-surface-raised: #1e293b;
+  --ob-surface-sunken: #020617;
+  --ob-heading: #f8fafc;
+  --ob-text: #e2e8f0;
+  --ob-text-muted: #cbd5e1;
+  --ob-text-subtle: #94a3b8;
+  --ob-border: #475569;
+  --ob-border-strong: #94a3b8;
+  --ob-accent: #93c5fd;
+  --ob-accent-hover: #bfdbfe;
+  --ob-accent-soft: #172554;
+  --ob-accent-contrast: #0f172a;
+  --ob-code-bg: #161b22;
+  --ob-code-border: #64748b;
+  --ob-notice-bg: #172554;
+  --ob-notice-border: #60a5fa;
+  --ob-notice-text: #dbeafe;
+  --ob-note: #93c5fd;
+  --ob-tip: #86efac;
+  --ob-warning: #fde047;
+}
+@media (prefers-color-scheme: dark) {
+  :root:not([data-theme="light"]) {
+  --ob-surface: #0f172a;
+  --ob-surface-raised: #1e293b;
+  --ob-surface-sunken: #020617;
+  --ob-heading: #f8fafc;
+  --ob-text: #e2e8f0;
+  --ob-text-muted: #cbd5e1;
+  --ob-text-subtle: #94a3b8;
+  --ob-border: #475569;
+  --ob-border-strong: #94a3b8;
+  --ob-accent: #93c5fd;
+  --ob-accent-hover: #bfdbfe;
+  --ob-accent-soft: #172554;
+  --ob-accent-contrast: #0f172a;
+  --ob-code-bg: #161b22;
+  --ob-code-border: #64748b;
+  --ob-notice-bg: #172554;
+  --ob-notice-border: #60a5fa;
+  --ob-notice-text: #dbeafe;
+  --ob-note: #93c5fd;
+  --ob-tip: #86efac;
+  --ob-warning: #fde047;
+  }
+}
+/* open-blog:tokens:end */
+
+:root { color-scheme: light dark; }
+:root[data-theme="light"] { color-scheme: light; }
+:root[data-theme="dark"] { color-scheme: dark; }
+
+@theme inline {
+  --color-ob-surface: var(--ob-surface);
+  --color-ob-surface-raised: var(--ob-surface-raised);
+  --color-ob-surface-sunken: var(--ob-surface-sunken);
+  --color-ob-heading: var(--ob-heading);
+  --color-ob-text: var(--ob-text);
+  --color-ob-text-muted: var(--ob-text-muted);
+  --color-ob-text-subtle: var(--ob-text-subtle);
+  --color-ob-border: var(--ob-border);
+  --color-ob-border-strong: var(--ob-border-strong);
+  --color-ob-accent: var(--ob-accent);
+  --color-ob-accent-hover: var(--ob-accent-hover);
+  --color-ob-accent-soft: var(--ob-accent-soft);
+  --color-ob-accent-contrast: var(--ob-accent-contrast);
+  --color-ob-code-bg: var(--ob-code-bg);
+  --color-ob-code-border: var(--ob-code-border);
+  --color-ob-notice-bg: var(--ob-notice-bg);
+  --color-ob-notice-border: var(--ob-notice-border);
+  --color-ob-notice-text: var(--ob-notice-text);
+  --color-ob-note: var(--ob-note);
+  --color-ob-tip: var(--ob-tip);
+  --color-ob-warning: var(--ob-warning);
+  --font-ob-display: var(--ob-font-display);
+  --font-ob-body: var(--ob-font-body);
+  --font-ob-mono: var(--ob-font-mono);
+}

data/lib/generators/open_blog/install/templates/views/layouts/open_blog.html.erb

@@ -0,0 +1,16 @@
+<!DOCTYPE html>
+<%= tag.html(lang: open_blog_lang, **open_blog_theme_attributes) do %>
+  <head>
+    <meta charset="utf-8">
+    <%= open_blog_head(@open_blog_page) %>
+    <%= open_blog_theme_script %>
+    <%= open_blog_stylesheets %>
+    <%= javascript_importmap_tags %>
+    <%= open_blog_structured_data(@open_blog_page) %>
+  </head>
+  <body class="ob-page">
+    <%= render "open_blog/shared/header" %>
+    <main id="open-blog-main" class="ob-main"><%= yield %></main>
+    <%= render "open_blog/shared/footer" %>
+  </body>
+<% end %>

data/lib/generators/open_blog/install/templates/views/open_blog/authors/show.html.erb

@@ -0,0 +1,17 @@
+<% author = @open_blog_page.record %>
+<%= render "open_blog/shared/breadcrumbs" %>
+<header class="ob-author-heading">
+  <%= open_blog_avatar(author) %>
+  <h1><%= author.name %></h1>
+  <% if author.bio.present? %><p class="ob-author-bio"><%= author.bio %></p><% end %>
+  <% if author.profile_urls.any? %>
+    <ul class="ob-author-profiles">
+      <% author.profile_urls.each do |url| %>
+        <% if OpenBlog::Renderer::Sanitizer.safe_url?(url) %><li><%= link_to url, url, rel: "me noopener" %></li><% end %>
+      <% end %>
+    </ul>
+  <% end %>
+</header>
+<% if @posts.empty? %><p class="ob-empty"><%= open_blog_translate("lists.empty") %></p><% end %>
+<div class="ob-post-grid"><%= render partial: "open_blog/shared/post_card", collection: @posts, as: :post %></div>
+<%= render "open_blog/shared/pagination" %>

data/lib/generators/open_blog/install/templates/views/open_blog/categories/show.html.erb

@@ -0,0 +1,13 @@
+<%= render "open_blog/shared/breadcrumbs" %>
+<header class="ob-list-heading">
+  <h1><%= @open_blog_page.record.name %></h1>
+  <p class="ob-list-description"><%= open_blog_page_description(@open_blog_page) %></p>
+</header>
+<div class="ob-list-layout">
+  <%= render "open_blog/shared/sidebar" %>
+  <div class="ob-list-main">
+    <% if @posts.empty? %><p class="ob-empty"><%= open_blog_translate("lists.empty") %></p><% end %>
+    <div class="ob-post-grid"><%= render partial: "open_blog/shared/post_card", collection: @posts, as: :post %></div>
+    <%= render "open_blog/shared/pagination" %>
+  </div>
+</div>

data/lib/generators/open_blog/install/templates/views/open_blog/errors/not_found.html.erb

@@ -0,0 +1,11 @@
+<header class="ob-error-heading">
+  <h1><%= open_blog_translate("titles.#{@open_blog_page.kind}") %></h1>
+  <p><%= open_blog_translate("errors.#{@open_blog_page.kind}") %></p>
+  <%= link_to open_blog_translate("navigation.all_posts"), open_blog_index_path %>
+</header>
+<% if @posts.any? %>
+  <section class="ob-recent-posts" aria-labelledby="ob-recent-heading">
+    <h2 id="ob-recent-heading"><%= open_blog_translate("headings.recent") %></h2>
+    <div class="ob-post-grid"><%= render partial: "open_blog/shared/post_card", collection: @posts, as: :post, locals: { heading: :h3 } %></div>
+  </section>
+<% end %>

data/lib/generators/open_blog/install/templates/views/open_blog/errors/preview_expired.html.erb

@@ -0,0 +1,5 @@
+<header class="ob-error-heading">
+  <h1><%= open_blog_translate("titles.preview_expired") %></h1>
+  <p><%= open_blog_translate("preview.stopped") %></p>
+  <%= link_to open_blog_translate("navigation.all_posts"), open_blog_index_path %>
+</header>

data/lib/generators/open_blog/install/templates/views/open_blog/icons/_check.svg.erb

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="20" height="20" fill="none" stroke="currentColor" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false" class="ob-icon"><path d="m4 12 5 5L20 6"/></svg>

data/lib/generators/open_blog/install/templates/views/open_blog/icons/_copy.svg.erb

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="20" height="20" fill="none" stroke="currentColor" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false" class="ob-icon"><rect x="8" y="8" width="13" height="13" rx="2"/><path d="M16 5V3H3v13h2"/></svg>

data/lib/generators/open_blog/install/templates/views/open_blog/icons/_link.svg.erb

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="20" height="20" fill="none" stroke="currentColor" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false" class="ob-icon"><path d="m9 15 6-6M8 16l-1 1a4 4 0 0 1-6-6l4-4a4 4 0 0 1 6 0m2 10a4 4 0 0 0 6 0l4-4a4 4 0 0 0-6-6l-1 1" transform="translate(1 0) scale(.9 1)"/></svg>

data/lib/generators/open_blog/install/templates/views/open_blog/icons/_monitor.svg.erb

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="20" height="20" fill="none" stroke="currentColor" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false" class="ob-icon"><rect x="3" y="4" width="18" height="13" rx="2"/><path d="M8 21h8m-4-4v4"/></svg>

data/lib/generators/open_blog/install/templates/views/open_blog/icons/_moon.svg.erb

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="20" height="20" fill="none" stroke="currentColor" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false" class="ob-icon"><path d="M20 15a8 8 0 0 1-11-11A9 9 0 1 0 20 15Z"/></svg>

data/lib/generators/open_blog/install/templates/views/open_blog/icons/_share.svg.erb

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="20" height="20" fill="none" stroke="currentColor" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false" class="ob-icon"><circle cx="18" cy="5" r="3"/><circle cx="6" cy="12" r="3"/><circle cx="18" cy="19" r="3"/><path d="m9 10 6-4m-6 8 6 4"/></svg>

data/lib/generators/open_blog/install/templates/views/open_blog/icons/_sun.svg.erb

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="20" height="20" fill="none" stroke="currentColor" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false" class="ob-icon"><circle cx="12" cy="12" r="4"/><path d="M12 2v2m0 16v2M2 12h2m16 0h2M5 5l1.5 1.5m11 11L19 19M5 19l1.5-1.5m11-11L19 5"/></svg>

data/lib/generators/open_blog/install/templates/views/open_blog/pages/show.html.erb

@@ -0,0 +1,5 @@
+<%= render "open_blog/shared/breadcrumbs" %>
+<article class="ob-post">
+  <h1 class="ob-title"><%= @page.title %></h1>
+  <div class="ob-prose"><%= OpenBlog::Renderer.render_string(@page.body_markdown, format: :markdown) %></div>
+</article>

data/lib/generators/open_blog/install/templates/views/open_blog/posts/_faq.html.erb

@@ -0,0 +1 @@
+<%= open_blog_faq(post) %>

data/lib/generators/open_blog/install/templates/views/open_blog/posts/_highlights.html.erb

@@ -0,0 +1,7 @@
+<section class="ob-highlights" aria-labelledby="ob-highlights-heading">
+  <h2 id="ob-highlights-heading"><%= open_blog_translate("headings.highlights") %></h2>
+  <ul>
+    <li><%= open_blog_reading_time(post) %></li>
+    <% if OpenBlog::ReaderDates.published_at(post) || OpenBlog::ReaderDates.modified_at(post) %><li><%= open_blog_dates(post) %></li><% end %>
+  </ul>
+</section>

data/lib/generators/open_blog/install/templates/views/open_blog/posts/_preview_bar.html.erb

@@ -0,0 +1 @@
+<div class="ob-notice" data-open-blog-preview><%= open_blog_translate("preview.heading") %></div>

data/lib/generators/open_blog/install/templates/views/open_blog/posts/_series_nav.html.erb

@@ -0,0 +1,12 @@
+<% if post.series %>
+  <% neighbors = OpenBlog::ReaderQueries.series_neighbors(post) %>
+  <nav class="ob-series-nav" aria-label="<%= open_blog_translate("navigation.series") %>">
+    <h2><%= link_to post.series.name, open_blog_list_path(:series, post.series) %></h2>
+    <% if neighbors[:previous] %>
+      <p><%= link_to "#{open_blog_translate('navigation.previous_post')}: #{neighbors[:previous].title}", neighbors[:previous].path, rel: "prev" %></p>
+    <% end %>
+    <% if neighbors[:next] %>
+      <p><%= link_to "#{open_blog_translate('navigation.next_post')}: #{neighbors[:next].title}", neighbors[:next].path, rel: "next" %></p>
+    <% end %>
+  </nav>
+<% end %>

data/lib/generators/open_blog/install/templates/views/open_blog/posts/_tags.html.erb

@@ -0,0 +1,5 @@
+<% if post.tags.any? %>
+  <nav class="ob-tags" aria-label="<%= open_blog_translate("navigation.tags") %>">
+    <ul><% post.tags.each do |tag| %><li><%= link_to tag.name, open_blog_list_path(:tag, tag) %></li><% end %></ul>
+  </nav>
+<% end %>

data/lib/generators/open_blog/install/templates/views/open_blog/posts/_toc.html.erb

@@ -0,0 +1 @@
+<%= open_blog_toc(post) %>

data/lib/generators/open_blog/install/templates/views/open_blog/posts/index.html.erb

@@ -0,0 +1,13 @@
+<header class="ob-index-heading">
+  <h1><%= OpenBlog.config.blog_title %></h1>
+  <% if OpenBlog.config.blog_tagline.present? %><p class="ob-tagline"><%= OpenBlog.config.blog_tagline %></p><% end %>
+</header>
+<div class="ob-list-layout">
+  <%= render "open_blog/shared/sidebar" %>
+  <div class="ob-list-main">
+    <% if @featured %><%= render "open_blog/shared/featured_card", post: @featured %><% end %>
+    <% if @posts.empty? && !@featured %><p class="ob-empty"><%= open_blog_translate("lists.empty") %></p><% end %>
+    <div class="ob-post-grid"><%= render partial: "open_blog/shared/post_card", collection: @posts, as: :post %></div>
+    <%= render "open_blog/shared/pagination" %>
+  </div>
+</div>

data/lib/generators/open_blog/install/templates/views/open_blog/posts/show.html.erb

@@ -0,0 +1,29 @@
+<% post = @open_blog_page.record %>
+<%= render "open_blog/posts/preview_bar" if @open_blog_page.kind == :preview %>
+<div class="ob-reading-progress" hidden aria-hidden="true" data-controller="open-blog--reading-progress">
+  <div class="ob-reading-progress-fill" data-open-blog--reading-progress-target="progress"></div>
+</div>
+<%= render "open_blog/shared/breadcrumbs" %>
+<div class="ob-post">
+  <% if post.category %><%= link_to post.category.name, open_blog_list_path(:category, post.category), class: "ob-post-category" %><% end %>
+  <%= open_blog_post_content(post) do %>
+    <%= open_blog_title(post) %>
+    <% if post.description.present? %><p class="ob-lede"><%= post.description %></p><% end %>
+    <%= open_blog_notices(post) %>
+    <%= render "open_blog/posts/highlights", post: post %>
+    <%= open_blog_byline(post) %>
+    <%= open_blog_cover(post) %>
+    <%= render "open_blog/posts/toc", post: post %>
+    <%= open_blog_disclosure(post) %>
+    <%= open_blog_body(post) %>
+    <%= open_blog_corrections(post) %>
+    <%= render "open_blog/posts/faq", post: post %>
+  <% end %>
+  <%= render "open_blog/posts/tags", post: post %>
+  <%= render "open_blog/shared/share", post: post %>
+  <%= open_blog_responsible_party_link %>
+  <%= render "open_blog/shared/author_box", post: post %>
+  <%= render "open_blog/posts/series_nav", post: post %>
+  <%= render "open_blog/shared/call_to_action" %>
+  <%= render "open_blog/shared/related_posts" %>
+</div>