RubyGems - active_canvas - Versions diffs - 0.0.1 - Mend

active_canvas 0.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (80) hide show

checksums.yaml +7 -0
data/MIT-LICENSE +20 -0
data/README.md +318 -0
data/Rakefile +6 -0
data/app/assets/javascripts/active_canvas/editor/ai_panel.js +1607 -0
data/app/assets/javascripts/active_canvas/editor/asset_manager.js +498 -0
data/app/assets/javascripts/active_canvas/editor/blocks.js +1083 -0
data/app/assets/javascripts/active_canvas/editor/code_panel.js +572 -0
data/app/assets/javascripts/active_canvas/editor/component_toolbar.js +394 -0
data/app/assets/javascripts/active_canvas/editor/panels.js +460 -0
data/app/assets/javascripts/active_canvas/editor/utils.js +56 -0
data/app/assets/javascripts/active_canvas/editor.js +295 -0
data/app/assets/stylesheets/active_canvas/application.css +15 -0
data/app/assets/stylesheets/active_canvas/editor.css +2929 -0
data/app/controllers/active_canvas/admin/ai_controller.rb +181 -0
data/app/controllers/active_canvas/admin/application_controller.rb +56 -0
data/app/controllers/active_canvas/admin/media_controller.rb +61 -0
data/app/controllers/active_canvas/admin/page_types_controller.rb +57 -0
data/app/controllers/active_canvas/admin/page_versions_controller.rb +23 -0
data/app/controllers/active_canvas/admin/pages_controller.rb +133 -0
data/app/controllers/active_canvas/admin/partials_controller.rb +88 -0
data/app/controllers/active_canvas/admin/settings_controller.rb +256 -0
data/app/controllers/active_canvas/application_controller.rb +20 -0
data/app/controllers/active_canvas/pages_controller.rb +18 -0
data/app/controllers/concerns/active_canvas/current_user.rb +12 -0
data/app/controllers/concerns/active_canvas/rate_limitable.rb +75 -0
data/app/controllers/concerns/active_canvas/tailwind_compilation.rb +39 -0
data/app/helpers/active_canvas/application_helper.rb +4 -0
data/app/jobs/active_canvas/application_job.rb +4 -0
data/app/jobs/active_canvas/compile_tailwind_job.rb +64 -0
data/app/mailers/active_canvas/application_mailer.rb +6 -0
data/app/models/active_canvas/ai_model.rb +136 -0
data/app/models/active_canvas/application_record.rb +5 -0
data/app/models/active_canvas/media.rb +141 -0
data/app/models/active_canvas/page.rb +85 -0
data/app/models/active_canvas/page_type.rb +22 -0
data/app/models/active_canvas/page_version.rb +80 -0
data/app/models/active_canvas/partial.rb +73 -0
data/app/models/active_canvas/setting.rb +292 -0
data/app/services/active_canvas/ai_configuration.rb +40 -0
data/app/services/active_canvas/ai_models.rb +128 -0
data/app/services/active_canvas/ai_service.rb +289 -0
data/app/services/active_canvas/content_sanitizer.rb +112 -0
data/app/services/active_canvas/tailwind_compiler.rb +156 -0
data/app/views/active_canvas/admin/media/index.html.erb +401 -0
data/app/views/active_canvas/admin/media/show.html.erb +297 -0
data/app/views/active_canvas/admin/page_types/_form.html.erb +25 -0
data/app/views/active_canvas/admin/page_types/edit.html.erb +13 -0
data/app/views/active_canvas/admin/page_types/index.html.erb +29 -0
data/app/views/active_canvas/admin/page_types/new.html.erb +9 -0
data/app/views/active_canvas/admin/page_types/show.html.erb +18 -0
data/app/views/active_canvas/admin/page_versions/show.html.erb +469 -0
data/app/views/active_canvas/admin/pages/_form.html.erb +62 -0
data/app/views/active_canvas/admin/pages/content.html.erb +139 -0
data/app/views/active_canvas/admin/pages/edit.html.erb +335 -0
data/app/views/active_canvas/admin/pages/editor.html.erb +710 -0
data/app/views/active_canvas/admin/pages/index.html.erb +149 -0
data/app/views/active_canvas/admin/pages/new.html.erb +19 -0
data/app/views/active_canvas/admin/pages/show.html.erb +258 -0
data/app/views/active_canvas/admin/pages/versions.html.erb +333 -0
data/app/views/active_canvas/admin/partials/edit.html.erb +182 -0
data/app/views/active_canvas/admin/partials/editor.html.erb +703 -0
data/app/views/active_canvas/admin/partials/index.html.erb +131 -0
data/app/views/active_canvas/admin/settings/show.html.erb +1864 -0
data/app/views/active_canvas/pages/no_homepage.html.erb +45 -0
data/app/views/active_canvas/pages/show.html.erb +113 -0
data/app/views/layouts/active_canvas/admin/application.html.erb +960 -0
data/app/views/layouts/active_canvas/admin/editor.html.erb +826 -0
data/app/views/layouts/active_canvas/application.html.erb +55 -0
data/config/routes.rb +48 -0
data/db/migrate/20260202000001_create_active_canvas_tables.rb +113 -0
data/db/migrate/20260202000002_create_active_canvas_ai_models.rb +26 -0
data/lib/active_canvas/configuration.rb +232 -0
data/lib/active_canvas/engine.rb +44 -0
data/lib/active_canvas/version.rb +3 -0
data/lib/active_canvas.rb +26 -0
data/lib/generators/active_canvas/install/install_generator.rb +263 -0
data/lib/generators/active_canvas/install/templates/initializer.rb.tt +163 -0
data/lib/tasks/active_canvas_tasks.rake +69 -0
metadata +150 -0

data/app/views/active_canvas/admin/pages/index.html.erb ADDED Viewed

@@ -0,0 +1,149 @@
+<% content_for :page_title, "Pages" %>
+<!-- Stats -->
+<div class="stats-grid">
+  <div class="stat-card">
+    <div class="stat-icon stat-icon-primary">
+      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+        <path d="M14.5 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7.5L14.5 2z"/>
+        <polyline points="14 2 14 8 20 8"/>
+      </svg>
+    </div>
+    <div class="stat-content">
+      <h3><%= @pages.count %></h3>
+      <p>Total Pages</p>
+    </div>
+  </div>
+  <div class="stat-card">
+    <div class="stat-icon stat-icon-success">
+      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+        <path d="M22 11.08V12a10 10 0 1 1-5.93-9.14"/>
+        <polyline points="22 4 12 14.01 9 11.01"/>
+      </svg>
+    </div>
+    <div class="stat-content">
+      <h3><%= @pages.where(published: true).count %></h3>
+      <p>Published</p>
+    </div>
+  </div>
+  <div class="stat-card">
+    <div class="stat-icon stat-icon-warning">
+      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+        <path d="M12 20h9"/>
+        <path d="M16.5 3.5a2.121 2.121 0 0 1 3 3L7 19l-4 1 1-4L16.5 3.5z"/>
+      </svg>
+    </div>
+    <div class="stat-content">
+      <h3><%= @pages.where(published: false).count %></h3>
+      <p>Drafts</p>
+    </div>
+  </div>
+  <div class="stat-card">
+    <div class="stat-icon stat-icon-info">
+      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+        <rect x="3" y="3" width="18" height="18" rx="2" ry="2"/>
+        <circle cx="8.5" cy="8.5" r="1.5"/>
+        <polyline points="21 15 16 10 5 21"/>
+      </svg>
+    </div>
+    <div class="stat-content">
+      <h3><%= @media_count %></h3>
+      <p>Media (<%= number_to_human_size(@media_total_size) %>)</p>
+    </div>
+  </div>
+</div>
+<!-- Page Header -->
+<div class="page-header">
+  <div class="page-header-left">
+    <h2>All Pages</h2>
+    <p class="page-header-subtitle">Manage your website pages and content</p>
+  </div>
+</div>
+<!-- Pages Table -->
+<% if @pages.any? %>
+  <div class="card">
+    <table>
+      <thead>
+        <tr>
+          <th>Title</th>
+          <th>URL</th>
+          <th>Status</th>
+          <th>Last Updated</th>
+          <th></th>
+        </tr>
+      </thead>
+      <tbody>
+        <% @pages.each do |page| %>
+          <tr>
+            <td>
+              <div style="display: flex; flex-direction: column; gap: 0.125rem;">
+                <%= link_to page.title, admin_page_path(page) %>
+                <span style="font-size: 0.75rem; color: var(--text-muted);"><%= page.page_type.name %></span>
+              </div>
+            </td>
+            <td>
+              <% if page.slug.present? %>
+                <code>/<%= page.slug %></code>
+              <% else %>
+                <span style="color: var(--text-light);">—</span>
+              <% end %>
+            </td>
+            <td>
+              <% if page.published? %>
+                <span class="badge badge-success">
+                  <span class="badge-dot"></span>
+                  Published
+                </span>
+              <% else %>
+                <span class="badge badge-gray">
+                  <span class="badge-dot"></span>
+                  Draft
+                </span>
+              <% end %>
+            </td>
+            <td>
+              <span style="color: var(--text-muted);"><%= page.updated_at.strftime("%b %d, %Y at %l:%M %p") %></span>
+            </td>
+            <td class="actions">
+              <%= link_to editor_admin_page_path(page), class: "btn btn-primary btn-sm" do %>
+                <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+                  <polygon points="12 2 2 7 12 12 22 7 12 2"/>
+                  <polyline points="2 17 12 22 22 17"/>
+                  <polyline points="2 12 12 17 22 12"/>
+                </svg>
+                Design
+              <% end %>
+              <%= link_to edit_admin_page_path(page), class: "btn btn-secondary btn-sm" do %>
+                <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+                  <path d="M12 20h9"/>
+                  <path d="M16.5 3.5a2.121 2.121 0 0 1 3 3L7 19l-4 1 1-4L16.5 3.5z"/>
+                </svg>
+                Edit
+              <% end %>
+            </td>
+          </tr>
+        <% end %>
+      </tbody>
+    </table>
+  </div>
+<% else %>
+  <div class="card">
+    <div class="empty-state">
+      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
+        <path d="M14.5 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7.5L14.5 2z"/>
+        <polyline points="14 2 14 8 20 8"/>
+      </svg>
+      <h3>No pages yet</h3>
+      <p>Get started by creating your first page</p>
+      <%= link_to new_admin_page_path, class: "btn btn-primary" do %>
+        <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+          <line x1="12" y1="5" x2="12" y2="19"/>
+          <line x1="5" y1="12" x2="19" y2="12"/>
+        </svg>
+        Create Page
+      <% end %>
+    </div>
+  </div>
+<% end %>

data/app/views/active_canvas/admin/pages/new.html.erb ADDED Viewed

@@ -0,0 +1,19 @@
+<% content_for :page_title, "New Page" %>
+<div class="page-header">
+  <div class="page-header-left">
+    <h2>New Page</h2>
+    <p class="page-header-subtitle">Create a new page for your website</p>
+  </div>
+</div>
+<div class="card">
+  <div class="card-header">
+    <span class="card-title">Page Details</span>
+  </div>
+  <div class="card-body">
+    <%= form_with model: @page, url: admin_pages_path do |form| %>
+      <%= render "form", form: form, page: @page %>
+    <% end %>
+  </div>
+</div>

data/app/views/active_canvas/admin/pages/show.html.erb ADDED Viewed

@@ -0,0 +1,258 @@
+<% content_for :page_title, @page.title %>
+<!-- Page Header -->
+<div class="page-header">
+  <div class="page-header-left">
+    <div style="display: flex; align-items: center; gap: 0.75rem;">
+      <h2><%= @page.title %></h2>
+      <% if @page.published? %>
+        <span class="badge badge-success">
+          <span class="badge-dot"></span>
+          Published
+        </span>
+      <% else %>
+        <span class="badge badge-gray">
+          <span class="badge-dot"></span>
+          Draft
+        </span>
+      <% end %>
+    </div>
+    <p class="page-header-subtitle">
+      <% if @page.slug.present? %>
+        <code style="font-size: 0.8125rem; background: var(--bg-main); padding: 0.25rem 0.5rem; border-radius: 4px;">/<%= @page.slug %></code>
+      <% else %>
+        <span style="color: var(--text-muted);">No URL assigned</span>
+      <% end %>
+    </p>
+  </div>
+  <div class="page-header-actions">
+    <%= link_to editor_admin_page_path(@page), class: "btn btn-primary" do %>
+      <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+        <polygon points="12 2 2 7 12 12 22 7 12 2"/>
+        <polyline points="2 17 12 22 22 17"/>
+        <polyline points="2 12 12 17 22 12"/>
+      </svg>
+      Open Designer
+    <% end %>
+    <% if @page.published? && @page.slug.present? %>
+      <%= link_to public_page_path(@page.slug), target: "_blank", class: "btn btn-secondary" do %>
+        <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+          <path d="M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6"/>
+          <polyline points="15 3 21 3 21 9"/>
+          <line x1="10" y1="14" x2="21" y2="3"/>
+        </svg>
+        View Live
+      <% end %>
+    <% end %>
+  </div>
+</div>
+<!-- Two Column Layout -->
+<div style="display: grid; grid-template-columns: 2fr 1fr; gap: 1.5rem; align-items: start;">
+  <!-- Main Column -->
+  <div>
+    <!-- Quick Actions Card -->
+    <div class="card" style="margin-bottom: 1.5rem;">
+      <div style="padding: 1.25rem; display: flex; gap: 1rem; flex-wrap: wrap;">
+        <%= link_to editor_admin_page_path(@page), class: "btn btn-primary", style: "flex: 1; min-width: 140px; justify-content: center;" do %>
+          <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+            <polygon points="12 2 2 7 12 12 22 7 12 2"/>
+            <polyline points="2 17 12 22 22 17"/>
+            <polyline points="2 12 12 17 22 12"/>
+          </svg>
+          Open Designer
+        <% end %>
+        <%= link_to edit_admin_page_path(@page), class: "btn btn-secondary", style: "flex: 1; min-width: 140px; justify-content: center;" do %>
+          <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+            <path d="M12 20h9"/>
+            <path d="M16.5 3.5a2.121 2.121 0 0 1 3 3L7 19l-4 1 1-4L16.5 3.5z"/>
+          </svg>
+          Edit Settings
+        <% end %>
+        <%= link_to versions_admin_page_path(@page), class: "btn btn-secondary", style: "flex: 1; min-width: 140px; justify-content: center;" do %>
+          <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+            <circle cx="12" cy="12" r="10"/>
+            <polyline points="12 6 12 12 16 14"/>
+          </svg>
+          History
+          <% if @page.versions.any? %>
+            <span class="badge badge-gray" style="margin-left: 0.375rem; padding: 0.125rem 0.5rem; font-size: 0.6875rem;"><%= @page.versions.count %></span>
+          <% end %>
+        <% end %>
+      </div>
+    </div>
+    <!-- Content Preview -->
+    <div class="card" style="margin-bottom: 1.5rem;">
+      <div class="card-header">
+        <span class="card-title">Content Preview</span>
+        <% if @page.content.present? %>
+          <span style="font-size: 0.75rem; color: var(--text-muted);"><%= number_to_human_size(@page.content.bytesize) %></span>
+        <% end %>
+      </div>
+      <div style="padding: 1rem;">
+        <% if @page.content.present? %>
+          <div class="content-preview" style="max-height: 300px; overflow: auto;"><%= truncate(@page.content, length: 3000) %></div>
+        <% else %>
+          <div class="empty-state" style="padding: 2rem;">
+            <svg xmlns="http://www.w3.org/2000/svg" width="40" height="40" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" style="opacity: 0.4;">
+              <path d="M14.5 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7.5L14.5 2z"/>
+              <polyline points="14 2 14 8 20 8"/>
+            </svg>
+            <h3>No content yet</h3>
+            <p>Open the visual designer to start building this page</p>
+            <%= link_to editor_admin_page_path(@page), class: "btn btn-primary" do %>
+              <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+                <polygon points="12 2 2 7 12 12 22 7 12 2"/>
+                <polyline points="2 17 12 22 22 17"/>
+                <polyline points="2 12 12 17 22 12"/>
+              </svg>
+              Open Designer
+            <% end %>
+          </div>
+        <% end %>
+      </div>
+    </div>
+    <!-- SEO Overview -->
+    <% has_seo = @page.meta_title.present? || @page.meta_description.present? %>
+    <div class="card" style="margin-bottom: 1.5rem;">
+      <div class="card-header">
+        <span class="card-title">
+          <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" style="vertical-align: -2px; margin-right: 0.5rem;">
+            <circle cx="11" cy="11" r="8"/>
+            <path d="m21 21-4.3-4.3"/>
+          </svg>
+          SEO
+        </span>
+        <% if has_seo %>
+          <span class="badge badge-success"><span class="badge-dot"></span>Configured</span>
+        <% else %>
+          <%= link_to edit_admin_page_path(@page), class: "btn btn-secondary btn-sm" do %>
+            Configure
+          <% end %>
+        <% end %>
+      </div>
+      <% if has_seo %>
+        <div class="card-body">
+          <% if @page.meta_title.present? %>
+            <div style="margin-bottom: 1rem;">
+              <div style="font-size: 0.6875rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; color: var(--text-muted); margin-bottom: 0.25rem;">Meta Title</div>
+              <div style="font-size: 0.9375rem;"><%= @page.meta_title %></div>
+            </div>
+          <% end %>
+          <% if @page.meta_description.present? %>
+            <div>
+              <div style="font-size: 0.6875rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; color: var(--text-muted); margin-bottom: 0.25rem;">Meta Description</div>
+              <div style="font-size: 0.875rem; color: var(--text-muted);"><%= @page.meta_description %></div>
+            </div>
+          <% end %>
+        </div>
+      <% end %>
+    </div>
+  </div>
+  <!-- Sidebar Column -->
+  <div>
+    <!-- Page Details -->
+    <div class="card" style="margin-bottom: 1.5rem;">
+      <div class="card-header">
+        <span class="card-title">Details</span>
+      </div>
+      <div class="card-body" style="padding: 0;">
+        <div style="padding: 0.875rem 1rem; border-bottom: 1px solid var(--border);">
+          <div style="font-size: 0.6875rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; color: var(--text-muted); margin-bottom: 0.25rem;">Page Type</div>
+          <div style="font-size: 0.9375rem;"><%= @page.page_type.name %></div>
+        </div>
+        <div style="padding: 0.875rem 1rem; border-bottom: 1px solid var(--border);">
+          <div style="font-size: 0.6875rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; color: var(--text-muted); margin-bottom: 0.25rem;">Created</div>
+          <div style="font-size: 0.9375rem;"><%= @page.created_at.strftime("%b %d, %Y") %></div>
+        </div>
+        <div style="padding: 0.875rem 1rem;">
+          <div style="font-size: 0.6875rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; color: var(--text-muted); margin-bottom: 0.25rem;">Last Modified</div>
+          <div style="font-size: 0.9375rem;"><%= @page.updated_at.strftime("%b %d, %Y at %l:%M %p") %></div>
+        </div>
+      </div>
+    </div>
+    <% if ActiveCanvas::Partial.table_exists? %>
+    <!-- Header & Footer -->
+    <div class="card" style="margin-bottom: 1.5rem;">
+      <div class="card-header">
+        <span class="card-title">Layout</span>
+      </div>
+      <div class="card-body" style="padding: 0;">
+        <div style="padding: 0.875rem 1rem; border-bottom: 1px solid var(--border); display: flex; align-items: center; justify-content: space-between;">
+          <span style="font-size: 0.9375rem;">Header</span>
+          <% if @page.show_header? %>
+            <span class="badge badge-success"><span class="badge-dot"></span>Enabled</span>
+          <% else %>
+            <span class="badge badge-gray"><span class="badge-dot"></span>Disabled</span>
+          <% end %>
+        </div>
+        <div style="padding: 0.875rem 1rem; display: flex; align-items: center; justify-content: space-between;">
+          <span style="font-size: 0.9375rem;">Footer</span>
+          <% if @page.show_footer? %>
+            <span class="badge badge-success"><span class="badge-dot"></span>Enabled</span>
+          <% else %>
+            <span class="badge badge-gray"><span class="badge-dot"></span>Disabled</span>
+          <% end %>
+        </div>
+      </div>
+    </div>
+    <% end %>
+    <% if ActiveCanvas::Setting.css_framework == "tailwind" %>
+    <!-- Tailwind CSS Status -->
+    <div class="card" style="margin-bottom: 1.5rem;">
+      <div class="card-header">
+        <span class="card-title">
+          <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="#06b6d4" style="vertical-align: -1px; margin-right: 0.375rem;">
+            <path d="M12.001 4.8c-3.2 0-5.2 1.6-6 4.8 1.2-1.6 2.6-2.2 4.2-1.8.913.228 1.565.89 2.288 1.624C13.666 10.618 15.027 12 18.001 12c3.2 0 5.2-1.6 6-4.8-1.2 1.6-2.6 2.2-4.2 1.8-.913-.228-1.565-.89-2.288-1.624C16.337 6.182 14.976 4.8 12.001 4.8zm-6 7.2c-3.2 0-5.2 1.6-6 4.8 1.2-1.6 2.6-2.2 4.2-1.8.913.228 1.565.89 2.288 1.624 1.177 1.194 2.538 2.576 5.512 2.576 3.2 0 5.2-1.6 6-4.8-1.2 1.6-2.6 2.2-4.2 1.8-.913-.228-1.565-.89-2.288-1.624C10.337 13.382 8.976 12 6.001 12z"/>
+          </svg>
+          Tailwind
+        </span>
+      </div>
+      <div class="card-body" style="padding: 0;">
+        <% if @page.compiled_tailwind_css.present? %>
+          <div style="padding: 0.875rem 1rem; border-bottom: 1px solid var(--border);">
+            <div style="font-size: 0.6875rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; color: var(--text-muted); margin-bottom: 0.25rem;">CSS Size</div>
+            <div style="font-size: 0.9375rem; color: var(--success);"><%= number_to_human_size(@page.compiled_tailwind_css.bytesize) %></div>
+          </div>
+          <div style="padding: 0.875rem 1rem;">
+            <div style="font-size: 0.6875rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; color: var(--text-muted); margin-bottom: 0.25rem;">Compiled</div>
+            <div style="font-size: 0.9375rem;"><%= time_ago_in_words(@page.tailwind_compiled_at) %> ago</div>
+          </div>
+        <% else %>
+          <div style="padding: 1rem; text-align: center; color: var(--text-muted);">
+            <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" style="opacity: 0.5; margin-bottom: 0.5rem;">
+              <circle cx="12" cy="12" r="10"/>
+              <line x1="12" y1="8" x2="12" y2="12"/>
+              <line x1="12" y1="16" x2="12.01" y2="16"/>
+            </svg>
+            <div style="font-size: 0.8125rem;">Not compiled yet</div>
+            <div style="font-size: 0.75rem; margin-top: 0.25rem;">Save in Designer to compile</div>
+          </div>
+        <% end %>
+      </div>
+    </div>
+    <% end %>
+    <!-- Danger Zone -->
+    <div class="card" style="border-color: #fecaca;">
+      <div class="card-header" style="background: var(--danger-light); padding: 0.75rem 1rem;">
+        <span class="card-title" style="color: var(--danger); font-size: 0.8125rem;">Danger Zone</span>
+      </div>
+      <div class="card-body" style="padding: 1rem;">
+        <p style="font-size: 0.8125rem; color: var(--text-muted); margin-bottom: 0.75rem;">Permanently delete this page and all its content.</p>
+        <%= button_to admin_page_path(@page), method: :delete, class: "btn btn-danger btn-sm", style: "width: 100%;", data: { confirm: "Are you sure you want to delete this page? This action cannot be undone." } do %>
+          <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+            <polyline points="3 6 5 6 21 6"/>
+            <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"/>
+          </svg>
+          Delete Page
+        <% end %>
+      </div>
+    </div>
+  </div>
+</div>