ruby_cms 0.1.1 → 0.1.2

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: ebf960fc18b9e0b70b1745056eaadd2e352b95c940d4e3cb5cbda3c37c6d816b
-  data.tar.gz: 2828ff26dbd77bfcbac8ee44e4d94241a6498c6d476187910d8e272afdef240c
+  metadata.gz: e1a4b15129e38c223a849cc78aff0bd173af8a104a07acc0f7195298475f4420
+  data.tar.gz: a9ea71bfc0ddcb2a89ba1ec85acd3fd7f9cc03799aa91e0e1eb805a081b1b6aa
 SHA512:
-  metadata.gz: f4f531ef56ebe15593ced939e0a459b812e183563e78aa729b39dddbaea82f0d8f786ece925e9c591d567608fe59cf60fa14faa2a93a26f1a52d3d8c71b3eb15
-  data.tar.gz: 0d4de8e1de20b7d4fe9c6746ddcab2ec89b59de49cbc6016412c58467b16855f7e3112a1981b78904d9f9454da720d560869b2446500dcc8c457b107b7853431
+  metadata.gz: a2b7113dbd5bae7fd3233398459efca6c3f497f54d22f63d9a4b7db0577d27cb4db73abf4ebb93b3f981ca5f33d34f458af08bc75bf74bb0dfb1f5cf02783625
+  data.tar.gz: 33442c384ce70c04a1a7420632225e3a282c9929b29d28a76b92dcb76dd19d5ab15957e0c4b70bfca34dcb59b1f5ab72d7c2e388b0d2b50913dc9f67d3a30350

data/CHANGELOG.md

@@ -1,5 +1,10 @@
 ## [Unreleased]
 
+## [0.1.2] - 2026-03-23
+
+- Update settings page and the bulk action table
+- Combined the permissions
+
 ## [0.1.1] - 2026-03-18
 
 - Fix admin templates calling `AdminPage(...)` instead of the `admin_page` helper

data/README.md

@@ -1,53 +1,33 @@
 # RubyCMS
 
-Reusable Rails engine: admin-only auth, permissions, admin shell, content blocks, and visual editor.
+Reusable Rails engine for a CMS-style admin: permissions, admin UI shell, content blocks, and a visual editor.
 
-**Vision:** The CMS manages content (content blocks, visual editor); the programmer builds the SaaS product (auth, billing, dashboards, etc.). You define pages and templates in your app; you edit content using the visual editor.
+Vision: your app owns product features (pages, models, business logic); RubyCMS manages content workflows and admin screens.
 
 ## Features
 
-- **Visual Editor** - Inline editing of content blocks
-- **Content Blocks** - Reusable content snippets with rich text support
-- **Permissions** - Fine-grained permission system
-- **Users** - User management with permission assignments
-- **Visitor Error Tracking** - Automatic exception logging with admin interface
-- **Page View Tracking** - Ahoy-based analytics for page views and events
+* Visual editor (inline editing for `content_block` regions)
+* Content blocks (rich text + placeholders + list items)
+* Permissions and users (admin access control)
+* Visitor error tracking (`/admin/visitor_errors`)
+* Analytics via Ahoy (page views + events)
 
-## Documentation
-
-- **[Installation](#installation)** - Get started with RubyCMS
-- **[Usage](#usage)** - Basic usage examples
-
-## Installation {#installation}
-
-### 1. Create a Rails app (or use an existing one)
-
-```bash
-rails new my_cms_app -d sqlite3
-cd my_cms_app
-```
-
-### 2. Install RubyCMS
+## Quick Start
 
 ```bash
 rails g ruby_cms:install
 ```
 
-This generator:
-
-- configures RubyCMS (`config/initializers/ruby_cms.rb`) and mounts the engine,
-- ensures authentication is present (generates `User`, `Session`, and `Authentication` on Rails 8+ apps that need it),
-- installs Action Text / Active Storage when missing and runs the required `db:migrate`,
-- creates the RubyCMS tables and seeds permissions,
-- guides you through picking or creating the first admin user and granting CMS permissions.
-
-### 3. Resolve route conflicts
+The generator sets up:
 
-If the app already has `/admin` routes, remove or change them so RubyCMS can use `/admin`. The install adds `mount RubyCms::Engine => "/"`; keep it after your main routes (e.g. `root`, `resources`) so it doesn’t override them.
+* `config/initializers/ruby_cms.rb`
+* mounts the engine (`/admin/...` on the host app)
+* migrations + RubyCMS tables
+* seed permissions + initial admin setup
 
-## Usage
+If your host app already has `/admin` routes, adjust/remove them so RubyCMS can use `/admin`.
 
-### Content blocks
+## Using Content Blocks
 
 In any view:
 
@@ -56,20 +36,26 @@ In any view:
 <%= content_block("footer", cache: true) %>
 ```
 
-**Important:** For **placeholders** (input `placeholder`, `alt`, meta tags), use `wrap: false` or `content_block_text`. The `content_block` helper normally wraps content in a `<span>` for the visual editor; that HTML must not go into placeholder attributes:
+<details>
+<summary>Placeholders (attributes like `placeholder`, `alt`, meta tags)</summary>
+
+`content_block` wraps output for the visual editor, so do not put it inside HTML attributes.
+Use `wrap: false` (or `content_block_text`):
 
 ```erb
-<%= text_field_tag :name, nil, placeholder: content_block("contact.name_placeholder", wrap: false, fallback: "Your name") %>
-<%= text_area_tag :message, nil, placeholder: content_block("contact.message_placeholder", wrap: false, fallback: "Your message...") %>
+<%= text_field_tag :name, nil,
+  placeholder: content_block("contact.name_placeholder", wrap: false, fallback: "Your name") %>
+
+<%= text_area_tag :message, nil,
+  placeholder: content_block_text("contact.message_placeholder", fallback: "Your message...") %>
 ```
 
-Or use `content_block_text` (equivalent to `content_block(..., wrap: false)`):
+</details>
 
-```erb
-<%= text_field_tag :name, nil, placeholder: content_block_text("contact.name_placeholder", fallback: "Your name") %>
-```
+<details>
+<summary>List items (badges, tags, arrays)</summary>
 
-For **lists** (badges, tags) that you need to iterate over, use `content_block_list_items`—it returns an array instead of HTML:
+Use `content_block_list_items` to get an Array:
 
 ```erb
 <% content_block_list_items("education.item.badges", fallback: item[:badges]).each do |badge| %>
@@ -79,157 +65,75 @@ For **lists** (badges, tags) that you need to iterate over, use `content_block_l
 
 Store list content as JSON (`["Ruby", "Rails"]`) or newline-separated text in the CMS.
 
-Create and edit blocks under **Admin → Content blocks**.
-
-### Seeding content blocks from YAML
-
-1. In `config/initializers/ruby_cms.rb`, set the translation namespace (the install generator sets this by default):
-
-   ```ruby
-   c.content_blocks_translation_namespace = "content_blocks"
-   ```
-
-2. Add content under that key in your locale files (e.g. `config/locales/en.yml`):
-
-   ```yaml
-   en:
-     content_blocks:
-       hero_title: "Welcome to my site"
-       about_intro: "We build things."
-       footer_copyright: "© 2025"
-   ```
-
-3. Run the seed task to import into the database (creates/updates blocks, marks them published):
-
-   ```bash
-   rails ruby_cms:content_blocks:seed
-   ```
-
-   Or call it from `db/seeds.rb`:
-
-   ```ruby
-   Rake::Task["ruby_cms:content_blocks:seed"].invoke
-   ```
-
-   ENV overrides: `published=false` to import as unpublished; `create_missing=false` or `update_existing=false` to limit what is changed.
+</details>
 
-### Visual editor
+Create/edit blocks in **Admin -> Content blocks**.
 
-1. **Preview templates** come from `config.ruby_cms.preview_templates` in `config/initializers/ruby_cms.rb`.
+## Visual Editor
 
-   ```ruby
-   c.preview_templates = { "home" => "pages/home", "about" => "pages/about" }
-   c.preview_data = ->(page_key, view) { { products: Product.limit(5) } }
-   ```
+Configure preview templates + (optional) preview data in `config/initializers/ruby_cms.rb`:
 
-2. Create the view templates (e.g. `app/views/pages/home.html.erb`) and use the `content_block("key")` helper for editable regions. Wrap editable elements in `<div class="ruby_cms-content-block" data-content-key="...">`.
-
-3. Open **Admin → Visual editor**, pick a page, and click any content block in the preview to edit in the modal.
-
-4. **postMessage**: The preview iframe and parent communicate via postMessage for content block editing and updates.
-
-### Visitor Error Tracking
-
-RubyCMS automatically captures unhandled exceptions from public pages (non-admin) and logs them to the `ruby_cms_visitor_errors` table.
-
-**Note**: Error logging is disabled in development environment (errors are skipped and only re-raised for normal Rails error pages).
-
-#### How it works
-
-1. The install generator adds `RubyCms::VisitorErrorCapture` to your `ApplicationController` with `rescue_from StandardError`
-2. When an exception occurs in production/staging, it's logged with full context (backtrace, request params, IP, user agent, etc.)
-3. The exception is re-raised so users still see the standard error page
-4. Admin users can view and manage errors at `/admin/visitor_errors`
+```ruby
+c.preview_templates = { "home" => "pages/home", "about" => "pages/about" }
+c.preview_data = ->(page_key, view) { { products: Product.limit(5) } }
+```
 
-#### What gets logged
+Then open **Admin -> Visual editor**, pick a page key, and click content blocks in the preview.
 
-- Error class and message
-- Request path and method
-- IP address and user agent
-- Session ID
-- First 10 lines of backtrace
-- Sanitized request params (passwords/tokens excluded)
+## Admin UI Pages (custom admin templates)
 
-#### Admin interface
+RubyCMS exposes an `admin_page` helper:
 
-Visit `/admin/visitor_errors` to:
+```erb
+<%= admin_page(title: "My Page", subtitle: "Optional") do %>
+  <p>Hello from RubyCMS admin.</p>
+<% end %>
+```
 
-- View all errors with filtering by path, error type, and resolved status
-- See full error details including backtrace and request context
-- Mark errors as resolved (single or bulk)
-- Delete errors (bulk action)
+## Visitor Error Tracking
 
-### Page View Tracking (Ahoy)
+Public (non-admin) exceptions are captured and shown in **`/admin/visitor_errors`**.
 
-RubyCMS includes Ahoy for visit and event tracking. The install generator sets up Ahoy with server-side tracking (no JavaScript required).
+In development, logging is typically disabled and exceptions are re-raised normally.
 
-#### Tracking page views
+## Page View Tracking (Ahoy)
 
-Include `RubyCms::PageTracking` in your public controllers to automatically track page views:
+Include `RubyCms::PageTracking` in public controllers:
 
 ```ruby
 class PagesController < ApplicationController
   include RubyCms::PageTracking
 
   def home
-    # @page_name is set to controller_name by default
-    # Override if needed: @page_name = "home"
+    # @page_name can be set; defaults vary by controller
   end
 end
 ```
 
-Page views are stored in `ahoy_events` with:
+## Seeding Content Blocks from YAML
 
-- `name: "page_view"`
-- `page_name`: Controller-specific identifier
-- `request_path`: Full request path
-- `visit`: Associated Ahoy visit (includes IP, user agent, browser, etc.)
-
-#### What Ahoy tracks
-
-**Visits** (`ahoy_visits` table):
-
-- Visit token (unique per session)
-- IP address and user agent
-- Browser, OS, device type
-- Landing page and referrer
-- UTM parameters
-- User ID (when authenticated)
-
-**Events** (`ahoy_events` table):
-
-- Event name (e.g., "page_view")
-- Timestamp
-- Associated visit
-- Custom properties (page_name, request_path, etc.)
-- User ID (when authenticated)
-
-#### Accessing analytics data
-
-Query the Ahoy tables directly or use the Ahoy gem's built-in methods:
+If you want to import blocks from locales, set:
 
 ```ruby
-# Get all page views
-Ahoy::Event.where(name: "page_view")
-
-# Page views for a specific page
-Ahoy::Event.where(name: "page_view", page_name: "home")
+c.content_blocks_translation_namespace = "content_blocks"
+```
 
-# Unique visitors (visits)
-Ahoy::Visit.count
+Example `config/locales/en.yml`:
 
-# Page views by page
-Ahoy::Event.where(name: "page_view")
-          .group(:page_name)
-          .count
+```yaml
+en:
+  content_blocks:
+    hero_title: "Welcome to my site"
 ```
 
-#### Architecture notes
+Import:
 
-**Visitor Errors** and **Ahoy** are independent systems:
+```bash
+rails ruby_cms:content_blocks:seed
+```
 
-- Visitor Errors log exceptions via `ApplicationController#rescue_from`
-- Ahoy tracks visits/events via Rack middleware and controller callbacks
-- No direct relationship between the two systems
+## Common Rake Tasks
 
----
+* `rails ruby_cms:seed_permissions`
+* `rails ruby_cms:setup_admin`
+* `rails ruby_cms:content_blocks:seed`

data/app/components/ruby_cms/admin/admin_page.rb

@@ -68,8 +68,8 @@ module RubyCms
       end
 
       def render_breadcrumbs
-        nav(class: "text-sm text-gray-500", aria_label: "Breadcrumb") do
-          ol(class: "flex items-center flex-wrap gap-x-2 gap-y-1") do
+        nav(class: "text-sm text-muted-foreground", aria_label: "Breadcrumb") do
+          ol(class: "flex items-center flex-wrap gap-y-1") do
             @breadcrumbs.each_with_index do |crumb, index|
               render_breadcrumb_item(crumb, index == @breadcrumbs.size - 1)
             end
@@ -84,15 +84,15 @@ module RubyCms
       end
 
       def render_breadcrumb_current(crumb)
-        span(class: "font-medium text-gray-900", aria_current: "page") do
+        span(class: "font-medium text-foreground", aria_current: "page") do
           crumb[:label] || crumb[:text]
         end
       end
 
       def render_breadcrumb_link(crumb)
-        a(href: crumb[:url] || crumb[:path], class: "hover:text-gray-700") do
+        a(href: crumb[:url] || crumb[:path], class: "hover:text-foreground transition-colors") do
           span { crumb[:label] || crumb[:text] }
-          span(class: "px-2 text-gray-300") { "/" }
+          span(class: "mx-1.5 text-muted-foreground/40 select-none") { "/" }
         end
       end
 
@@ -118,8 +118,8 @@ module RubyCms
         return unless @title || @subtitle
 
         div(class: "min-w-0") do
-          h1(class: "text-lg font-semibold text-gray-900 truncate") { @title } if @title
-          p(class: "text-sm text-gray-500 mt-0.5") { @subtitle } if @subtitle
+          h1(class: "text-lg font-semibold tracking-tight text-foreground truncate") { @title } if @title
+          p(class: "text-sm text-muted-foreground mt-0.5") { @subtitle } if @subtitle
         end
       end
 
@@ -217,8 +217,8 @@ module RubyCms
 
       def build_action_attributes(action)
         base = "inline-flex items-center justify-center rounded-lg px-3 py-2 " \
-               "text-sm font-medium transition"
-        secondary = "bg-white text-gray-700 ring-1 ring-gray-200 hover:bg-gray-50"
+               "text-sm font-medium transition-colors"
+        secondary = "bg-white text-foreground border border-border shadow-sm hover:bg-muted"
         variant = action_primary?(action) ? primary_action_classes : secondary
         attrs = { class: build_classes(base, variant, action[:class]) }
         attrs[:data] = action[:data] if action[:data]
@@ -251,7 +251,7 @@ module RubyCms
         div(class: "flex-1 flex flex-col min-h-0") do
           if @content_card
             div(
-              class: "bg-white rounded-lg border border-gray-200/80 shadow-sm " \
+              class: "bg-white rounded-xl border border-border/60 shadow-sm ring-1 ring-black/[0.03] " \
                      "p-5 sm:p-6 flex-1 flex flex-col min-h-0"
             ) { yield if block_given? }
           elsif block_given?
@@ -276,15 +276,15 @@ module RubyCms
         form_with(url: opts[:url] || "#", method: :get, class: "w-full sm:w-auto",
                   data: { turbo_frame: opts[:turbo_frame] || "admin_table_content" }) do
           div(class: "relative flex items-center") do
-            span(class: "absolute left-3 text-gray-400 pointer-events-none") do
+            span(class: "absolute left-3 text-muted-foreground pointer-events-none") do
               svg_icon_path("M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z")
             end
             input(
               type: "search",
               name: opts[:name] || "q",
               placeholder: opts[:placeholder] || "Search",
-              class: "w-full sm:w-72 pl-10 pr-3 py-2 text-sm rounded-lg bg-white ring-1 " \
-                     "ring-gray-200 focus:outline-none focus:ring-2 focus:ring-teal-200",
+              class: "h-9 w-full sm:w-72 pl-10 pr-3 text-sm rounded-lg bg-white border border-border " \
+                     "shadow-sm focus:outline-none focus:ring-2 focus:ring-primary/20",
               value: opts[:value],
               data: { action: "input->turbo-frame#submit" }
             )
@@ -325,20 +325,20 @@ module RubyCms
       def icon_color_class_map
         {
           "blue" => "text-blue-600 hover:bg-blue-50",
-          "green" => "text-green-600 hover:bg-green-50",
-          "red" => "text-red-600 hover:bg-red-50",
-          "purple" => "text-purple-600 hover:bg-purple-50",
-          "gray" => "text-gray-700 hover:bg-gray-50",
+          "green" => "text-emerald-600 hover:bg-emerald-50",
+          "red" => "text-destructive hover:bg-destructive/10",
+          "purple" => "text-violet-600 hover:bg-violet-50",
+          "gray" => "text-muted-foreground hover:bg-muted",
           "teal" => "text-teal-600 hover:bg-teal-50"
         }
       end
 
       def icon_base_classes
-        "inline-flex items-center justify-center w-9 h-9 rounded-lg"
+        "inline-flex items-center justify-center size-9 rounded-md transition-colors"
       end
 
       def primary_action_classes
-        "bg-teal-600 text-white hover:bg-teal-700"
+        "bg-primary text-primary-foreground hover:bg-primary/90 shadow-sm"
       end
     end
   end

data/app/components/ruby_cms/admin/admin_page_header.rb

@@ -0,0 +1,81 @@
+# frozen_string_literal: true
+
+module RubyCms
+  module Admin
+    # Reusable page header for admin pages.
+    # Renders breadcrumbs, title, optional subtitle, and action slot.
+    #
+    # Usage from ERB:
+    #
+    #   <%= render RubyCms::Admin::AdminPageHeader.new(
+    #     title: "Sports",
+    #     breadcrumbs: [
+    #       { label: "Admin", url: admin_root_path },
+    #       { label: "Sports" }
+    #     ]
+    #   ) do %>
+    #     <%= link_to new_admin_sport_path, class: "..." do %>
+    #       + Add
+    #     <% end %>
+    #   <% end %>
+    #
+    class AdminPageHeader < BaseComponent
+      def initialize(title:, breadcrumbs: [], subtitle: nil, **options)
+        super()
+        @title = title
+        @breadcrumbs = Array(breadcrumbs)
+        @subtitle = subtitle
+        @header_class = options[:class]
+      end
+
+      def view_template(&block)
+        header(class: build_classes("flex-shrink-0 mb-4", @header_class)) do
+          render_breadcrumbs if @breadcrumbs.any?
+
+          div(class: "flex flex-wrap items-center justify-between gap-4") do
+            render_title_section
+            render_actions(&block) if block
+          end
+        end
+      end
+
+      private
+
+      def render_title_section
+        div(class: "min-w-0") do
+          h1(class: "text-lg font-semibold tracking-tight text-foreground") { @title }
+          p(class: "text-sm text-muted-foreground mt-0.5") { @subtitle } if @subtitle
+        end
+      end
+
+      def render_breadcrumbs
+        nav(class: "mb-1 text-sm text-muted-foreground", aria_label: "Breadcrumb") do
+          ol(class: "flex items-center flex-wrap gap-y-1") do
+            @breadcrumbs.each_with_index do |crumb, index|
+              render_breadcrumb_item(crumb, last: index == @breadcrumbs.size - 1)
+            end
+          end
+        end
+      end
+
+      def render_breadcrumb_item(crumb, last:)
+        li(class: "flex items-center") do
+          label = crumb[:label] || crumb[:text]
+
+          if last
+            span(class: "font-medium text-foreground") { label }
+          else
+            a(href: crumb[:url] || crumb[:path] || "#", class: "hover:text-foreground transition-colors") { label }
+            span(class: "mx-1.5 text-muted-foreground/40 select-none") { "/" }
+          end
+        end
+      end
+
+      def render_actions(&block)
+        div(class: "flex items-center gap-3 flex-shrink-0") do
+          yield
+        end
+      end
+    end
+  end
+end

data/app/components/ruby_cms/admin/admin_resource_card.rb

@@ -0,0 +1,55 @@
+# frozen_string_literal: true
+
+module RubyCms
+  module Admin
+    # Reusable card wrapper for admin resource pages (combined show/edit).
+    # Provides a two-column layout with form fields on the left and a
+    # details sidebar on the right, plus an actions footer.
+    #
+    # Intended to be wrapped in a form_with tag by the view so the
+    # submit button in the actions footer works naturally.
+    #
+    # Usage:
+    #
+    #   <%= form_with model: [:admin, @sport], local: true do |form| %>
+    #     <div class="<%= RubyCms::Admin::AdminResourceCard::CARD_CLASS %>">
+    #       <div class="<%= RubyCms::Admin::AdminResourceCard::GRID_CLASS %>">
+    #         <div class="<%= RubyCms::Admin::AdminResourceCard::MAIN_CLASS %>">
+    #           form fields...
+    #         </div>
+    #         <div class="<%= RubyCms::Admin::AdminResourceCard::SIDEBAR_CLASS %>">
+    #           details...
+    #         </div>
+    #       </div>
+    #       <div class="<%= RubyCms::Admin::AdminResourceCard::ACTIONS_CLASS %>">
+    #         cancel / save
+    #       </div>
+    #     </div>
+    #   <% end %>
+    #
+    class AdminResourceCard < BaseComponent
+      CARD_CLASS = "bg-card shadow-sm rounded-xl border border-border/60 ring-1 ring-black/[0.03] overflow-hidden"
+      GRID_CLASS = "grid grid-cols-1 lg:grid-cols-3"
+      MAIN_CLASS = "lg:col-span-2 p-6 space-y-6"
+      SIDEBAR_CLASS = "border-t lg:border-t-0 lg:border-l border-border/60 bg-muted/20 p-6 space-y-6"
+      ACTIONS_CLASS = "flex items-center justify-end gap-3 border-t border-border/60 px-6 py-4 bg-muted/20"
+
+      INPUT_CLASS = "block w-full rounded-lg border border-border bg-background px-3 py-2 text-sm text-foreground shadow-sm placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-primary/30 focus:border-primary transition-colors"
+      LABEL_CLASS = "block text-sm font-medium text-foreground mb-1.5"
+      HINT_CLASS = "mt-1 text-xs text-muted-foreground"
+      FILE_INPUT_CLASS = "block w-full text-sm text-muted-foreground file:mr-3 file:py-1.5 file:px-3 file:rounded-lg file:border-0 file:text-sm file:font-medium file:bg-primary/10 file:text-primary hover:file:bg-primary/20 transition-colors"
+
+      SECTION_CLASS = "rounded-xl border border-border/60 bg-muted/30 p-5"
+      SECTION_TITLE_CLASS = "text-sm font-semibold text-foreground tracking-tight mb-4"
+      DETAIL_LABEL_CLASS = "text-xs font-medium text-muted-foreground uppercase tracking-wider"
+      DETAIL_VALUE_CLASS = "mt-1 text-sm text-foreground"
+
+      CANCEL_CLASS = "inline-flex items-center px-4 py-2 text-sm font-medium rounded-lg border border-border bg-background text-foreground hover:bg-muted transition-colors"
+      SUBMIT_CLASS = "inline-flex items-center px-4 py-2 text-sm font-medium rounded-lg bg-primary text-primary-foreground hover:bg-primary/90 shadow-sm transition-colors"
+
+      def view_template(&block)
+        div(class: CARD_CLASS, &block)
+      end
+    end
+  end
+end

data/app/components/ruby_cms/admin/bulk_action_table/bulk_action_table.rb

@@ -58,7 +58,7 @@ module RubyCms
         def render_table_content(&block)
           div(
             class: build_classes(
-              "rounded-lg border border-gray-200/80 bg-white shadow-sm overflow-hidden " \
+              "rounded-xl border border-border/60 bg-white shadow-sm ring-1 ring-black/[0.03] overflow-hidden " \
               "flex flex-col",
               @user_attrs[:class]
             ),
@@ -66,7 +66,7 @@ module RubyCms
           ) do
             render_header
             render_table_wrapper(&block)
-            div(class: "border-t border-gray-200/80 bg-white") do
+            div(class: "border-t border-border/60 bg-white") do
               render_bulk_actions if @has_bulk_actions
               render_pagination if @pagination && @pagination_path
             end
@@ -84,7 +84,7 @@ module RubyCms
               turbo_frame: @turbo_frame
             )
           elsif @header
-            div(class: "px-6 py-4 border-b border-gray-200/80 bg-white") do
+            div(class: "px-6 py-4 border-b border-border/60 bg-white") do
               if @header.respond_to?(:call)
                 raw(@header.call) # rubocop:disable Rails/OutputSafety -- legacy capture support
               elsif @header.kind_of?(String)
@@ -96,7 +96,7 @@ module RubyCms
 
         def render_table_wrapper(&)
           div(class: "w-full overflow-x-auto") do
-            table(class: "min-w-full text-sm") do
+            table(class: "min-w-full text-sm caption-bottom") do
               yield if block_given?
             end
           end

data/app/components/ruby_cms/admin/bulk_action_table/bulk_action_table_actions.rb

@@ -33,7 +33,7 @@ module RubyCms
         end
 
         def view_template
-          div(class: "flex items-center justify-end gap-1") do
+          div(class: "flex items-center justify-end gap-1 pr-2") do
             render_edit_button if @edit_path
 
             render_delete_button if @delete_path
@@ -45,8 +45,8 @@ module RubyCms
         def render_edit_button
           link_options = {
             href: @edit_path,
-            class: "inline-flex h-8 w-8 items-center justify-center rounded-md text-gray-500 " \
-                   "hover:bg-gray-100 hover:text-gray-900 transition-colors"
+            class: "inline-flex size-8 items-center justify-center rounded-md text-muted-foreground " \
+                   "hover:bg-muted hover:text-foreground transition-colors"
           }
           link_options[:data] = { turbo_frame: @turbo_frame } if @turbo_frame
 
@@ -71,8 +71,8 @@ module RubyCms
           item_id = @item_id || extract_item_id_from_path
           button(
             type: "button",
-            class: "inline-flex h-8 w-8 items-center justify-center rounded-md text-rose-600 " \
-                   "hover:bg-rose-50 hover:text-rose-700 transition-colors",
+            class: "inline-flex size-8 items-center justify-center rounded-md text-muted-foreground " \
+                   "hover:bg-destructive/10 hover:text-destructive transition-colors",
             data: {
               action: "click->#{@controller_name}#showIndividualDeleteDialog",
               "#{@controller_name}-item-id-param": item_id,

data/app/components/ruby_cms/admin/bulk_action_table/bulk_action_table_body.rb

@@ -7,7 +7,7 @@ module RubyCms
       # Simple wrapper for <tbody> content
       class BulkActionTableBody < BaseComponent
         def view_template(&)
-          tbody(class: "divide-y divide-gray-100", &)
+          tbody(class: "[&_tr:last-child]:border-0 [&_td]:text-sm", &)
         end
       end
     end