Improve UI

app/views/clips/_form.html.erb

@@ -1,23 +0,0 @@
-<%= form_with model: clip do |form| %>
-  <table border="1">
-    <tr>
-      <td valign="top"><b><%= form.label :title %></b></td>
-      <td valign="top"><%= form.text_field :title %></td>
-    </tr>
-    <tr>
-      <td valign="top"><b><%= form.label :video %></b></td>
-      <td valign="top"><%= form.file_field :video, :accept => 'video/quicktime,video/mp4' %></td>
-    </tr>
-    <tr>
-      <td valign="top"><b><%= form.label :category %></b></td>
-      <td valign="top"><%= form.select :category_id, Category.all.collect{ |t| [ t.name, t.id ] }%></td>
-    </tr>
-    <tr>
-      <td valign="top"><b><%= form.label :tag %></b></td>
-      <td valign="top"><%= collection_select(:clip, :tag_ids, Tag.all, :id, :name, {}, { :multiple => true } )%></td>
-    </tr>
-    <tr>
-      <td colspan="2"><%= form.submit %></td>
-    </tr>
-  </table>
-<% end %>

app/views/clips/edit.html.erb

@@ -1,4 +1,26 @@
 <h1>Edit clip</h1>
 
-<%= render "form", clip: @clip %>
+<%= form_with model: @clip do |form| %>
+  <table border="1">
+    <tr>
+      <td valign="top"><b><%= form.label :title %></b></td>
+      <td valign="top"><%= form.text_field :title %></td>
+    </tr>
+    <tr>
+      <td valign="top"><b>Replace <%= form.label :video %></b></td>
+      <td valign="top"><%= form.file_field :video, :accept => 'video/quicktime,video/mp4' %></td>
+    </tr>
+    <tr>
+      <td valign="top"><b><%= form.label :category %></b></td>
+      <td valign="top"><%= form.select :category_id, Category.all.collect{ |t| [ t.name, t.id ] }%></td>
+    </tr>
+    <tr>
+      <td valign="top"><b><%= form.label :tag %></b></td>
+      <td valign="top"><%= collection_select(:clip, :tag_ids, Tag.all, :id, :name, {}, { :multiple => true } )%></td>
+    </tr>
+    <tr>
+      <td colspan="2"><%= form.submit %></td>
+    </tr>
+  </table>
+<% end %>
 <%= link_to "Cancel", @clip %>

app/views/clips/new.html.erb

@@ -1,4 +1,26 @@
 <h1>New Clip</h1>
 
-<%= render "form", clip: @clip %>
+<%= form_with model: @clip do |form| %>
+  <table border="1">
+    <tr>
+      <td valign="top"><b><%= form.label :title %></b></td>
+      <td valign="top"><%= form.text_field :title %></td>
+    </tr>
+    <tr>
+      <td valign="top"><b><%= form.label :video %></b></td>
+      <td valign="top"><%= form.file_field :video, :accept => 'video/quicktime,video/mp4' %></td>
+    </tr>
+    <tr>
+      <td valign="top"><b><%= form.label :category %></b></td>
+      <td valign="top"><%= form.select :category_id, Category.all.collect{ |t| [ t.name, t.id ] }%></td>
+    </tr>
+    <tr>
+      <td valign="top"><b><%= form.label :tag %></b></td>
+      <td valign="top"><%= collection_select(:clip, :tag_ids, Tag.all, :id, :name, {}, { :multiple => true } )%></td>
+    </tr>
+    <tr>
+      <td colspan="2"><%= form.submit %></td>
+    </tr>
+  </table>
+<% end %>
 <%= link_to "Cancel", clips_path %>

app/views/clips/show.html.erb

@@ -1,12 +1,44 @@
 <% cache @clip do %>
   <h1><%= @clip.title %></h1>
 <% end %>
-<% if @clip.video.attached? %>
-<%= video_tag @clip.video, :controls => true%><br>
-<% end %>
-<b>Category:</b> <%= link_to @clip.category.name, @clip.category %><br>
-<b>Tags:</b> <%= @clip.tags.map(&:name).join(', ') %><br>
-<% if authenticated? %>
-  <%= button_to "Edit", edit_clip_path(@clip), :method => "get" %>
-  <%= button_to "Delete", @clip, method: :delete, data: { turbo_confirm: "Are you sure?" } %>
-<% end %>
+<table>
+  <tr>
+    <% if @clip.video.attached? %>
+      <td>
+        <%= video_tag @clip.video, :controls => true%>
+      </td>
+    <% end %>
+    <td valign="top">
+      <table border="1">
+        <tr>
+          <td valign="top"><b>Category:</b></td>
+          <td><%= link_to @clip.category.name, @clip.category %></td>
+        </tr>
+        <tr>
+          <td valign="top"><b>Tags:</b></td>
+          <td><%= @clip.tags.map(&:name).join(', ') %></td>
+        </tr>
+        <tr>
+          <td valign="top"><b>Length:</b></td>
+          <td><%= seconds_to_time(@clip.video.metadata["duration"]) %></td>
+        </tr>
+        <tr>
+          <td valign="top"><b>Last Updated:</b></td>
+          <td><%= @clip.updated_at %></td>
+        </tr>
+        <tr>
+          <td valign="top"><b>Created:</b></td>
+          <td><%= @clip.created_at %></td>
+        </tr>
+        <tr>
+          <td colspan="2">
+            <% if authenticated? %>
+              <%= button_to "Edit", edit_clip_path(@clip), :method => "get" %>
+              <%= button_to "Delete", @clip, method: :delete, data: { turbo_confirm: "Are you sure?" } %>
+            <% end %>
+          </td>
+        </tr>
+      </table>
+    </td>
+  </tr>
+</table>