How to customize Trek

Trek is designed to get you started fast with useful conventions, then get out of the way: most of the generated code lives in your application, so customizing it is just regular Rails work. Here are the most common entry points.

Admin panel branding

You can pick the title and subtitle used in the admin panel header.

# config/locales/en.yml
en:
  admin:
    brand:
      title: My Awesome Project
      subtitle: Back-office

Favicon & logo

Replace Trek's favicon with your own:

• in SVG format at app/assets/images/favicon.svg
• in PNG format (512 × 512 px) at public/favicon.png

Components

Trek's UI components accept options where it matters:

• Trek::Form::ActionsComponent — pick an aspect and add your own classnames to restyle form action bars.
• Trek::DialogComponent — set the title and the buttons of modal dialogs. The confirm dialog wired to data-turbo-confirm can also be customized per action from the confirming element's data attributes, with the delete wording as fallback:

= render Trek::ButtonComponent.new(
  text: "Run the prize draw",
  to: admin_event_draw_path(event), method: :post,
  data: {
    turbo_confirm: "Run the prize draw now? Winners will be picked and emails sent.",
    turbo_confirm_title: "Prize draw",
    turbo_confirm_button: "Run the draw",
    turbo_confirm_color: "grass",
  },
)

• Trek::Form::ContentEditorComponent — toggle the nodes, blocks and floating options to slim down the editor where full rich text isn't needed:

f.content_editor :intro, nodes: false, floating: false

• Trek::LayoutComponent — use the panel slot to add your own side panel to admin screens.

Models

The models generated by the installer and the scaffold are plain Active Record models in your app/models. Enable the commented-out hooks to opt into Trek features, for instance:

class Book < ApplicationRecord
  include Trek::Formattable
  format_attributes Trek::TypographyFormatter, :title

  include Trek::Translatable
  translate_attributes :title

  include RecordImageUploader::Attachment(:image)
end

See the concerns reference for the full list.

Policies

Each scaffolded resource gets its own policy in app/policies/admin. Adjust the rules and permitted_attributes per role — the policies reference shows the generated default.

Theming

Trek's admin supports light, dark and auto themes, selectable per user. The design tokens are based on Radix colors; override the CSS custom properties in your own stylesheet to adapt the palette.

The auto theme follows the system setting (prefers-color-scheme). The autoDarkTheme plugin in the generated postcss.config.js copies every rule targeting .dark-theme into a @media (prefers-color-scheme: dark) block, with .auto-theme in its place, so dark overrides in your own stylesheets (.dark-theme { --accent-9: … }, .dark-theme .card { … }) apply to the auto theme too.

Dependencies configuration

The installer configures Shrine, Postmark, ActionPolicy, Mobility and friends with sensible defaults — through initializers generated in your app. You can edit them at any time:

• config/initializers/shrine.rb — storage backends, upload limits
• config/credentials.yml.enc — Postmark API token (EDITOR="code --wait" bin/rails credentials:edit)
• config/i18n-tasks.yml — locale management rules