3 files changed, 85 insertions, 0 deletions

diff --git a/app/views/page_translations/edit.html.erb b/app/views/page_translations/edit.html.erb
new file mode 100644
index 00000000..7371a42e
--- /dev/null
+++ b/app/views/page_translations/edit.html.erb
@@ -0,0 +1,39 @@
+<div class="translation_banner">
+  Editing the <strong><%= @locale.to_s.upcase %></strong> translation of <strong><%= title_for_node(@node) %></strong>.
+</div>
+
+<p class="field_hint">
+  Metadata such as images, tags, template, and author belong to the page
+  as a whole, not to a single translation — change those from the
+  <%= link_to 'default-locale editor', edit_node_path(@node) %>.
+</p>
+
+<div class="node_action_bar">
+  <%= button_to 'Unlock + Back', unlock_node_path(@node), method: :put,
+        form: { class: 'button_to state_changing' },
+        disabled: @node.autosave.present? %>
+  <%= submit_tag "Save #{@locale.to_s.upcase} translation", form: "translation_edit_form" %>
+  <%= submit_tag "Save + Unlock + Exit", form: "translation_edit_form" %>
+  <%= link_to "Preview ↗", preview_page_path(@page, :locale => @locale), target: "_blank", rel: "noopener", class: "preview_link" %>
+</div>
+
+<div id="page_editor">
+  <%= form_with url: node_translation_path(@node, @locale), method: :patch, local: true, id: "translation_edit_form" do |f| %>
+    <div id="content">
+      <div class="node_description">Title</div>
+      <div class="node_content">
+        <%= text_field_tag "page[title]", @translation&.title %>
+      </div>
+
+      <div class="node_description">Abstract</div>
+      <div class="node_content">
+        <%= text_area_tag "page[abstract]", @translation&.abstract %>
+      </div>
+
+      <div class="node_description">Body</div>
+      <div class="node_content">
+        <%= text_area_tag "page[body]", @translation&.body, :class => 'with_editor' %>
+      </div>
+    </div>
+  <% end %>
+</div>
diff --git a/app/views/page_translations/index.html.erb b/app/views/page_translations/index.html.erb
new file mode 100644
index 00000000..a8c4f5dc
--- /dev/null
+++ b/app/views/page_translations/index.html.erb
@@ -0,0 +1,19 @@
+<h1>Translations — <%= title_for_node(@node) %></h1>
+
+<div class="node_content node_info_group">
+  <div class="node_info_group_items">
+    <% @translations.each do |t| %>
+      <div class="node_info_item">
+        <span class="node_info_label"><%= t[:locale].to_s.upcase %></span>
+        <% if t[:exists] %>
+          <%= t[:title] %> — updated <%= t[:updated_at] %>
+          <% if t[:outdated] %><span class="warning">may be outdated</span><% end %>
+          <%= link_to 'Edit', edit_node_translation_path(@node, t[:locale]) %>
+        <% else %>
+          <span class="field_hint">Not yet translated.</span>
+          <%= link_to 'Add', edit_node_translation_path(@node, t[:locale]) %>
+        <% end %>
+      </div>
+    <% end %>
+  </div>
+</div>
diff --git a/app/views/page_translations/show.html.erb b/app/views/page_translations/show.html.erb
new file mode 100644
index 00000000..c5bd151f
--- /dev/null
+++ b/app/views/page_translations/show.html.erb
@@ -0,0 +1,27 @@
+<h1>Compare — <%= title_for_node(@node) %></h1>
+
+<div class="translation_compare">
+  <div class="translation_compare_column">
+    <h2><%= @locale.to_s.upcase %></h2>
+    <div class="node_description">Title</div>
+    <div class="node_content"><%= @translation&.title %></div>
+
+    <div class="node_description">Abstract</div>
+    <div class="node_content"><%= sanitize(@translation&.abstract.to_s) %></div>
+
+    <div class="node_description">Body</div>
+    <div class="node_content"><%= sanitize(@translation&.body.to_s) %></div>
+  </div>
+
+  <div class="translation_compare_column">
+    <h2><%= I18n.default_locale.to_s.upcase %> (default)</h2>
+    <div class="node_description">Title</div>
+    <div class="node_content"><%= @default_translation&.title %></div>
+
+    <div class="node_description">Abstract</div>
+    <div class="node_content"><%= sanitize(@default_translation&.abstract.to_s) %></div>
+
+    <div class="node_description">Body</div>
+    <div class="node_content"><%= sanitize(@default_translation&.body.to_s) %></div>
+  </div>
+</div>