keystone_ui-colors 0.2.0 → 0.3.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: a6fe78366470d37cb8598bfa4181561c42eca52a409dd7648246c397584daad9
-  data.tar.gz: dbbcf12bbc4fd745c85cf35a94d0608cabfa9565e7a92e87eb22a5a5faa17f01
+  metadata.gz: 56e2aecbc1dd2315bbc0add8ae80c083a23e42aa0e59fd8b05828d9cd4f93860
+  data.tar.gz: 19f53163686417b9b497fa0ffb27bc69946d3b46a84fc0efb6961561a13b2706
 SHA512:
-  metadata.gz: 9764dcad37f39f954cc377abf737bad185b2ee9e1e0ce301982bd6a52d286a0069ca8513b5afb918df2411475b40040646c5e605a6c384edf8b88e3f3c5c4d9b
-  data.tar.gz: 60f59e26247a9580e2422d873f0e8cb4d4daa2b9aecd5dda755972b76f7dbfb46be9cf07bed75954fb2ee591a0699ac94285e65ebf445611a8f8443e84ada4a9
+  metadata.gz: d85fa52f7c4552d4196bcf36d4bf517358f89adeb55bdcdd5fa8491629782a64945e0e15124eef204b9297ed3b2149831aeedf29f68586803a34c91bb49644c7
+  data.tar.gz: c4bcbef319b118827f8812c9c230761179817fd258582fa21356f1a611f832d89b3793a10f3105d748f805b60280856f683c54fdb0b0867fade78b799a80a2be

data/README.md

@@ -82,7 +82,9 @@ KeystoneUi::Colors.configure do |config|
   config.default_template = :ocean             # Fallback theme
   config.default_accent = "blue"               # Fallback accent color
   config.default_surface = "zinc"              # Fallback surface color
-  config.default_mode = "light"                # Fallback theme mode: "light", "dark" or "system"
+  config.default_mode = "light"                # Fallback theme mode: "light", "dark", "system" or "custom"
+  config.default_background = "#ffffff"        # Custom mode background when nothing else sets one
+  config.default_text = "#18181b"              # Custom mode text colour when nothing else sets one
   config.layout = "application"                # Layout for settings page
 end
 ```
@@ -91,8 +93,8 @@ All values shown are defaults and can be omitted.
 
 ## Light and Dark Mode
 
-Users choose Light, Dark or System on the settings page, and the choice is saved
-with their palette. keystone_ui renders each page in, strongest first:
+Users choose Light, Dark, System or Custom on the settings page, and the choice is
+saved with their palette. keystone_ui renders each page in, strongest first:
 
 1. The choice made with keystone_ui's `ui_theme_toggle` in this browser.
 2. The mode the signed-in user saved.
@@ -102,16 +104,44 @@ Saving a mode on the settings page clears the toggle's choice in that browser, s
 saved mode takes effect. Pages are marked through keystone_ui's
 `keystone_theme_attributes` helper on the layout's `html` tag.
 
+## Custom Mode
+
+A page in Custom mode is drawn from a background colour and a text colour, which
+the gem writes as `--color-custom-background` and `--color-custom-text` with the
+rest of the palette. keystone_ui-styles draws white in the background and every
+gray and zinc shade as a blend of the text into it.
+
+- A preset theme supplies both colours.
+- With custom colours, the surface colour the user picks is the background and
+  the Text Color picker sets the text.
+- Anything not set falls back to `config.default_background` and
+  `config.default_text`.
+
+## Keeping a Page on the Host's Colours
+
+A controller that declares `keystone_host_colors` renders its pages in the host's
+configured accent, surface, custom colours and mode, whatever the signed-in user
+saved. It takes the same `only:` and `except:` options as `before_action`.
+
+```ruby
+class HomeController < ApplicationController
+  keystone_host_colors
+end
+```
+
+A choice made with keystone_ui's `ui_theme_toggle` in that browser still sets
+light or dark on these pages.
+
 ## Preset Themes
 
-| Name     | Accent  | Surface | Description                    |
-|----------|---------|---------|--------------------------------|
-| Default  | *(configured)* | *(configured)* | Uses config defaults |
-| Ocean    | blue    | slate   | Cool blues with slate undertones |
-| Forest   | emerald | stone   | Natural greens with warm stone   |
-| Twilight | violet  | zinc    | Deep violet with clean zinc      |
-| Coral    | rose    | neutral | Warm rose with neutral balance   |
-| Arctic   | cyan    | gray    | Bright cyan with crisp gray      |
+| Name     | Accent  | Surface | Custom background | Custom text | Description                    |
+|----------|---------|---------|-------------------|-------------|--------------------------------|
+| Default  | *(configured)* | *(configured)* | *(configured)* | *(configured)* | Uses config defaults |
+| Ocean    | blue    | slate   | `#e0f2fe` | `#0c4a6e` | Cool blues with slate undertones |
+| Forest   | emerald | stone   | `#ecfdf5` | `#064e3b` | Natural greens with warm stone   |
+| Twilight | violet  | zinc    | `#1e1b4b` | `#ede9fe` | Deep violet with clean zinc      |
+| Coral    | rose    | neutral | `#fff1f2` | `#4c0519` | Warm rose with neutral balance   |
+| Arctic   | cyan    | gray    | `#ecfeff` | `#164e63` | Bright cyan with crisp gray      |
 
 ## Available Colors
 
@@ -187,7 +217,7 @@ Accepts named colors (`"blue"`) or hex values (`"#3b82f6"`) for `accent` and `su
 
 ## Updating
 
-Run the update generator to get the latest Stimulus controller and any new migrations, then migrate:
+Run the update generator to get the latest Stimulus controller and any new migrations (such as the text colour column), then migrate:
 
 ```bash
 bin/rails generate keystone_ui:colors:update

data/app/controllers/concerns/keystone_ui/colors/current_palette.rb

@@ -11,23 +11,26 @@ module KeystoneUi
         helper_method :keystone_palette_css, :keystone_theme_mode if respond_to?(:helper_method)
       end
 
+      class_methods do
+        def keystone_host_colors(**options)
+          before_action :apply_host_palette, **options
+        end
+      end
+
       def set_current_palette
         owner = send(KeystoneUi::Colors.configuration.current_owner_method)
 
-        unless owner
-          @keystone_theme_mode = KeystoneUi::Colors.configuration.default_mode
-          build_palette_css(
-            KeystoneUi::Colors.configuration.default_accent,
-            KeystoneUi::Colors.configuration.default_surface
-          )
-          return
-        end
+        return apply_host_palette unless owner
 
         cached = session[:keystone_ui_colors_palette]
 
         if cached && !stale_cache?(owner, cached)
           @keystone_theme_mode = cached[:mode] || KeystoneUi::Colors.configuration.default_mode
-          build_palette_css(cached[:accent], cached[:surface])
+          build_palette_css(
+            cached[:accent],
+            cached[:surface],
+            KeystoneUi::Colors::CustomColours.new(template_name: cached[:template_name], surface: cached[:surface], text: cached[:text])
+          )
           return
         end
 
@@ -36,18 +39,30 @@ module KeystoneUi
         accent = preference&.accent || KeystoneUi::Colors.configuration.default_accent
         surface = preference&.surface || KeystoneUi::Colors.configuration.default_surface
 
-        build_palette_css(accent, surface)
+        custom = KeystoneUi::Colors::CustomColours.new(template_name: preference&.template_name, surface: surface, text: preference&.text)
+        build_palette_css(accent, surface, custom)
 
         if preference
           session[:keystone_ui_colors_palette] = {
             accent: preference.accent,
             surface: preference.surface,
             mode: preference.mode,
+            template_name: preference.template_name,
+            text: preference.text,
             updated_at: preference.updated_at.to_i
           }
         end
       end
 
+      def apply_host_palette
+        @keystone_theme_mode = KeystoneUi::Colors.configuration.default_mode
+        build_palette_css(
+          KeystoneUi::Colors.configuration.default_accent,
+          KeystoneUi::Colors.configuration.default_surface,
+          KeystoneUi::Colors::CustomColours.new(template_name: nil, surface: nil, text: nil)
+        )
+      end
+
       def keystone_palette_css
         @keystone_palette_css
       end
@@ -58,13 +73,15 @@ module KeystoneUi
 
       private
 
-      def build_palette_css(accent, surface)
+      def build_palette_css(accent, surface, custom = nil)
         accent_shades = resolve_shades(accent, :accent)
         surface_shades = resolve_shades(surface, :surface)
 
         lines = []
         accent_shades.each { |shade, hex| lines << "  --color-accent-#{shade}: #{hex};" }
         surface_shades.each { |shade, hex| lines << "  --color-surface-#{shade}: #{hex};" }
+        lines << "  --color-custom-background: #{custom.background};" if custom
+        lines << "  --color-custom-text: #{custom.text};" if custom
 
         @keystone_palette_css = ":root {\n#{lines.join("\n")}\n}"
       end
@@ -78,6 +95,8 @@ module KeystoneUi
       end
 
       def stale_cache?(owner, cached)
+        return true unless cached.key?(:text)
+
         updated_at = KeystoneUi::Colors::ThemePreference
           .where(owner: owner)
           .pick(:updated_at)

data/app/controllers/keystone_ui/colors/settings_controller.rb

@@ -4,7 +4,6 @@ module KeystoneUi
   module Colors
     class SettingsController < ApplicationController
       def show
-        @preference = theme_preference
       end
 
       def destroy
@@ -13,40 +12,24 @@ module KeystoneUi
       end
 
       def update
-        @preference = theme_preference
-
-        if preference_params[:template_name].present?
-          template = Templates[preference_params[:template_name]]
-          @preference.assign_attributes(
-            accent: template[:accent].to_s,
-            surface: template[:surface].to_s,
-            template_name: preference_params[:template_name],
-            mode: preference_params[:mode]
-          )
-        else
-          @preference.assign_attributes(preference_params)
-        end
-
-        if @preference.save
-          cookies.delete(KeystoneUi::ThemeChoice::COOKIE)
-          redirect_to keystone_ui_colors.settings_path, notice: "Color settings updated."
-        else
-          render :show, status: :unprocessable_entity
-        end
+        result = PickColours.new(person: current_owner, account: nil, values: preference_params).call
+
+        return render :show, status: :unprocessable_entity unless result.ok?
+
+        ForgetTheThemeChoice.new(controller: self).call
+        redirect_to keystone_ui_colors.settings_path, notice: "Color settings updated."
       end
 
       private
 
+      helper_method :current_owner
+
       def current_owner
         send(KeystoneUi::Colors.configuration.current_owner_method)
       end
 
-      def theme_preference
-        ThemePreference.find_or_initialize_by(owner: current_owner)
-      end
-
       def preference_params
-        params.require(:theme_preference).permit(:accent, :surface, :template_name, :mode)
+        params.permit(:accent, :surface, :text, :template_name, :mode).to_h.symbolize_keys
       end
     end
   end

data/app/javascript/keystone_ui/colors/theme_settings_controller.js

@@ -1,11 +1,12 @@
 import { Controller } from "@hotwired/stimulus"
 
 export default class extends Controller {
-  static targets = ["accentPicker", "surfacePicker", "customRadio", "templateLabel"]
+  static targets = ["accentPicker", "surfacePicker", "textPicker", "customRadio", "templateLabel"]
 
   connect() {
     this.accentPickerTarget.addEventListener("change", () => this.customColorChanged())
     this.surfacePickerTarget.addEventListener("change", () => this.customColorChanged())
+    this.textPickerTarget.addEventListener("change", () => this.customColorChanged())
   }
 
   selectTemplate(event) {
@@ -13,9 +14,11 @@ export default class extends Controller {
     const label = input.closest("[data-template]")
     const accentHex = input.dataset.accentHex
     const surfaceHex = input.dataset.surfaceHex
+    const textHex = input.dataset.textHex
 
     this.setPickerValue(this.accentPickerTarget, accentHex)
     this.setPickerValue(this.surfacePickerTarget, surfaceHex)
+    this.setPickerValue(this.textPickerTarget, textHex)
 
     this.highlightTemplate(label.dataset.template)
   }

data/app/models/keystone_ui/colors/custom_colours.rb

@@ -0,0 +1,26 @@
+# frozen_string_literal: true
+
+module KeystoneUi
+  module Colors
+    class CustomColours
+      def initialize(template_name:, surface:, text:)
+        @template_name = template_name
+        @surface = surface
+        @text = text
+      end
+
+      def background
+        return Templates[@template_name][:background] if @template_name.present?
+        return @surface if @surface&.start_with?("#")
+
+        KeystoneUi::Colors.configuration.default_background
+      end
+
+      def text
+        return Templates[@template_name][:text] if @template_name.present?
+
+        @text.presence || KeystoneUi::Colors.configuration.default_text
+      end
+    end
+  end
+end

data/app/models/keystone_ui/colors/forget_the_theme_choice.rb

@@ -0,0 +1,15 @@
+# frozen_string_literal: true
+
+module KeystoneUi
+  module Colors
+    class ForgetTheThemeChoice
+      def initialize(controller:)
+        @controller = controller
+      end
+
+      def call
+        @controller.request.cookie_jar.delete(KeystoneUi::ThemeChoice::COOKIE)
+      end
+    end
+  end
+end

data/app/models/keystone_ui/colors/kept.rb

@@ -0,0 +1,11 @@
+# frozen_string_literal: true
+
+module KeystoneUi
+  module Colors
+    class Kept
+      def ok? = true
+
+      def message = nil
+    end
+  end
+end

data/app/models/keystone_ui/colors/pick_colours.rb

@@ -0,0 +1,39 @@
+# frozen_string_literal: true
+
+module KeystoneUi
+  module Colors
+    class PickColours
+      def initialize(values:, person: nil, account: nil, owner: nil)
+        @owner = person || owner
+        @account = account
+        @values = values
+      end
+
+      def call
+        preference.assign_attributes(chosen_colours)
+
+        return Refusal.new(preference.errors.full_messages.first) unless preference.save
+
+        Kept.new
+      end
+
+      private
+
+      def preference
+        @preference ||= ThemePreference.find_or_initialize_by(owner: @owner)
+      end
+
+      def chosen_colours
+        return { accent: @values[:accent], surface: @values[:surface], text: @values[:text], mode: @values[:mode] }.compact if @values[:template_name].blank?
+
+        template = Templates[@values[:template_name]]
+        {
+          accent: template[:accent].to_s,
+          surface: template[:surface].to_s,
+          template_name: @values[:template_name],
+          mode: @values[:mode]
+        }.compact
+      end
+    end
+  end
+end

data/app/models/keystone_ui/colors/refusal.rb

@@ -0,0 +1,15 @@
+# frozen_string_literal: true
+
+module KeystoneUi
+  module Colors
+    class Refusal
+      attr_reader :message
+
+      def initialize(message)
+        @message = message
+      end
+
+      def ok? = false
+    end
+  end
+end

data/app/models/keystone_ui/colors/theme_preference.rb

@@ -13,12 +13,13 @@ module KeystoneUi
 
       HEX_COLOR = /\A#[0-9a-fA-F]{6}\z/
 
-      MODES = %w[light dark system].freeze
+      MODES = %w[light dark system custom].freeze
 
       validate :accent_is_valid
       validate :surface_is_valid
       validates :template_name, inclusion: { in: Templates.names.map(&:to_s) }, allow_blank: true
       validates :mode, inclusion: { in: MODES }, allow_nil: true
+      validates :text, format: { with: HEX_COLOR }, allow_blank: true
 
       def apply_template!(name)
         template = Templates[name]

data/app/views/keystone_ui/colors/settings/_picker.html.erb

@@ -0,0 +1,107 @@
+<%
+  preference = KeystoneUi::Colors::ThemePreference.find_or_initialize_by(owner: person)
+
+  current_accent_hex = if preference.accent&.start_with?("#")
+    preference.accent
+  else
+    KeystoneUi::Colors::Palettes.accent(preference.accent || "blue")[500]
+  end
+
+  current_surface_hex = if preference.surface&.start_with?("#")
+    preference.surface
+  else
+    KeystoneUi::Colors::Palettes.surface(preference.surface || "zinc")[500]
+  end
+
+  current_text_hex = KeystoneUi::Colors::CustomColours.new(
+    template_name: preference.template_name,
+    surface: preference.surface,
+    text: preference.text
+  ).text
+
+  selected_template = preference.template_name
+  custom_selected = preference.accent&.start_with?("#") || (selected_template.blank? && preference.persisted?)
+%>
+
+<%= ui_panel(padding: :lg) do %>
+  <%= form_with(
+    url: submit_url,
+    method: :patch,
+    data: { turbo: false, controller: "keystone-ui--colors--theme-settings", selected_template: selected_template }
+  ) do |form| %>
+    <div style="display: flex; flex-direction: column; gap: 2rem;">
+      <%= ui_section(title: "Theme", spacing: :sm) do %>
+        <div style="display: flex; flex-wrap: wrap; gap: 0.5rem;">
+          <% KeystoneUi::Colors::Templates.names.each do |name| %>
+            <% template = KeystoneUi::Colors::Templates[name] %>
+            <% accent_hex = KeystoneUi::Colors::Palettes.accent(template[:accent])[500] %>
+            <% surface_hex = KeystoneUi::Colors::Palettes.surface(template[:surface])[500] %>
+            <%= ui_option_card(
+              name: "template_name",
+              value: name,
+              selected: selected_template == name.to_s,
+              input_data: {
+                action: "keystone-ui--colors--theme-settings#selectTemplate",
+                "accent-hex": accent_hex,
+                "surface-hex": surface_hex,
+                "text-hex": template[:text]
+              },
+              label_data: {
+                "keystone-ui--colors--theme-settings-target": "templateLabel",
+                template: name
+              }
+            ) do %>
+              <span style="display: inline-block; width: 1rem; height: 1rem; border-radius: 9999px; background-color: <%= accent_hex %>;"></span>
+              <span style="display: inline-block; width: 1rem; height: 1rem; border-radius: 0.25rem; background-color: <%= surface_hex %>;"></span>
+              <span><%= template[:label] %></span>
+            <% end %>
+          <% end %>
+          <%= ui_option_card(
+            name: "template_name",
+            value: "",
+            selected: custom_selected,
+            input_data: {
+              "keystone-ui--colors--theme-settings-target": "customRadio"
+            },
+            label_data: {
+              "keystone-ui--colors--theme-settings-target": "templateLabel",
+              template: "custom"
+            }
+          ) do %>
+            <span>Custom</span>
+          <% end %>
+        </div>
+      <% end %>
+
+      <%= ui_section(title: "Accent Color", spacing: :sm) do %>
+        <div data-keystone-ui--colors--theme-settings-target="accentPicker">
+          <%= ui_color_picker(name: "accent", value: current_accent_hex) %>
+        </div>
+      <% end %>
+
+      <%= ui_section(title: "Surface", spacing: :sm) do %>
+        <div data-keystone-ui--colors--theme-settings-target="surfacePicker">
+          <%= ui_color_picker(name: "surface", value: current_surface_hex) %>
+        </div>
+      <% end %>
+
+      <%= ui_section(title: "Text Color", spacing: :sm) do %>
+        <div data-keystone-ui--colors--theme-settings-target="textPicker">
+          <%= ui_color_picker(name: "text", value: current_text_hex) %>
+        </div>
+      <% end %>
+
+      <%= ui_section(title: "Mode", spacing: :sm) do %>
+        <div style="display: flex; flex-wrap: wrap; gap: 0.5rem;">
+          <% KeystoneUi::Colors::ThemePreference::MODES.each do |mode| %>
+            <%= ui_radio_card(name: "mode", value: mode, label: mode.capitalize, checked: (preference.mode || KeystoneUi::Colors.configuration.default_mode) == mode) %>
+          <% end %>
+        </div>
+      <% end %>
+
+      <div>
+        <%= ui_button(label: "Save", type: :submit) %>
+      </div>
+    </div>
+  <% end %>
+<% end %>

data/app/views/keystone_ui/colors/settings/show.html.erb

@@ -4,96 +4,4 @@
   <%= ui_alert(message: flash[:notice], type: :success) %>
 <% end %>
 
-<%
-  current_accent_hex = if @preference.accent&.start_with?("#")
-    @preference.accent
-  else
-    KeystoneUi::Colors::Palettes.accent(@preference.accent || "blue")[500]
-  end
-
-  current_surface_hex = if @preference.surface&.start_with?("#")
-    @preference.surface
-  else
-    KeystoneUi::Colors::Palettes.surface(@preference.surface || "zinc")[500]
-  end
-
-  selected_template = @preference.template_name
-  custom_selected = @preference.accent&.start_with?("#") || (selected_template.blank? && @preference.persisted?)
-%>
-
-<%= ui_panel(padding: :lg) do %>
-  <%= form_with(
-    url: keystone_ui_colors.settings_path,
-    method: :patch,
-    scope: :theme_preference,
-    data: { turbo: false, controller: "keystone-ui--colors--theme-settings", selected_template: selected_template }
-  ) do |form| %>
-    <div style="display: flex; flex-direction: column; gap: 2rem;">
-      <%= ui_section(title: "Theme", spacing: :sm) do %>
-        <div style="display: flex; flex-wrap: wrap; gap: 0.5rem;">
-          <% KeystoneUi::Colors::Templates.names.each do |name| %>
-            <% template = KeystoneUi::Colors::Templates[name] %>
-            <% accent_hex = KeystoneUi::Colors::Palettes.accent(template[:accent])[500] %>
-            <% surface_hex = KeystoneUi::Colors::Palettes.surface(template[:surface])[500] %>
-            <%= ui_option_card(
-              name: "theme_preference[template_name]",
-              value: name,
-              selected: selected_template == name.to_s,
-              input_data: {
-                action: "keystone-ui--colors--theme-settings#selectTemplate",
-                "accent-hex": accent_hex,
-                "surface-hex": surface_hex
-              },
-              label_data: {
-                "keystone-ui--colors--theme-settings-target": "templateLabel",
-                template: name
-              }
-            ) do %>
-              <span style="display: inline-block; width: 1rem; height: 1rem; border-radius: 9999px; background-color: <%= accent_hex %>;"></span>
-              <span style="display: inline-block; width: 1rem; height: 1rem; border-radius: 0.25rem; background-color: <%= surface_hex %>;"></span>
-              <span><%= template[:label] %></span>
-            <% end %>
-          <% end %>
-          <%= ui_option_card(
-            name: "theme_preference[template_name]",
-            value: "",
-            selected: custom_selected,
-            input_data: {
-              "keystone-ui--colors--theme-settings-target": "customRadio"
-            },
-            label_data: {
-              "keystone-ui--colors--theme-settings-target": "templateLabel",
-              template: "custom"
-            }
-          ) do %>
-            <span>Custom</span>
-          <% end %>
-        </div>
-      <% end %>
-
-      <%= ui_section(title: "Accent Color", spacing: :sm) do %>
-        <div data-keystone-ui--colors--theme-settings-target="accentPicker">
-          <%= ui_color_picker(name: "theme_preference[accent]", value: current_accent_hex) %>
-        </div>
-      <% end %>
-
-      <%= ui_section(title: "Surface", spacing: :sm) do %>
-        <div data-keystone-ui--colors--theme-settings-target="surfacePicker">
-          <%= ui_color_picker(name: "theme_preference[surface]", value: current_surface_hex) %>
-        </div>
-      <% end %>
-
-      <%= ui_section(title: "Mode", spacing: :sm) do %>
-        <div style="display: flex; flex-wrap: wrap; gap: 0.5rem;">
-          <% KeystoneUi::Colors::ThemePreference::MODES.each do |mode| %>
-            <%= ui_radio_card(name: "theme_preference[mode]", value: mode, label: mode.capitalize, checked: (@preference.mode || KeystoneUi::Colors.configuration.default_mode) == mode) %>
-          <% end %>
-        </div>
-      <% end %>
-
-      <div>
-        <%= ui_button(label: "Save", type: :submit) %>
-      </div>
-    </div>
-  <% end %>
-<% end %>
+<%= render partial: "keystone_ui/colors/settings/picker", locals: {person: current_owner, account: nil, submit_url: keystone_ui_colors.settings_path} %>

data/lib/generators/keystone_ui/colors/install/templates/create_keystone_ui_colors_theme_preferences.rb.erb

@@ -5,6 +5,7 @@ class CreateKeystoneUiColorsThemePreferences < ActiveRecord::Migration[<%= Activ
       t.string :surface, null: false
       t.string :template_name
       t.string :mode
+      t.string :text
       t.references :owner, polymorphic: true, null: false
       t.timestamps
     end

data/lib/generators/keystone_ui/colors/update/templates/add_text_to_keystone_ui_colors_theme_preferences.rb.erb

@@ -0,0 +1,5 @@
+class AddTextToKeystoneUiColorsThemePreferences < ActiveRecord::Migration[<%= ActiveRecord::Migration.current_version %>]
+  def change
+    add_column :keystone_ui_colors_theme_preferences, :text, :string
+  end
+end

data/lib/generators/keystone_ui/colors/update/update_generator.rb

@@ -20,6 +20,13 @@ module KeystoneUi
           )
         end
 
+        def add_text_migration
+          migration_template(
+            File.expand_path("templates/add_text_to_keystone_ui_colors_theme_preferences.rb.erb", __dir__),
+            "db/migrate/add_text_to_keystone_ui_colors_theme_preferences.rb"
+          )
+        end
+
         def copy_stimulus_controller
           copy_file "theme_settings_controller.js",
             "app/javascript/controllers/keystone_ui/colors/theme_settings_controller.js"

data/lib/keystone_ui/colors/configuration.rb

@@ -3,7 +3,7 @@
 module KeystoneUi
   module Colors
     class Configuration
-      attr_accessor :current_owner_method, :authentication_method, :default_template, :default_accent, :default_surface, :default_mode, :layout
+      attr_accessor :current_owner_method, :authentication_method, :default_template, :default_accent, :default_surface, :default_mode, :default_background, :default_text, :layout
 
       def initialize
         @current_owner_method = :current_user
@@ -12,6 +12,8 @@ module KeystoneUi
         @default_accent = "blue"
         @default_surface = "zinc"
         @default_mode = "light"
+        @default_background = "#ffffff"
+        @default_text = "#18181b"
         @layout = "application"
       end
     end

data/lib/keystone_ui/colors/engine.rb

@@ -13,6 +13,10 @@ module KeystoneUi
         end
       end
 
+      initializer "keystone_ui.colors.tailwind" do
+        KeystoneUi.configuration.tailwind_sources << root.join("app/views/**/*.erb").to_s
+      end
+
       initializer "keystone_ui.colors.url_helpers" do
         ActiveSupport.on_load(:action_controller) do
           helper Rails.application.routes.url_helpers

data/lib/keystone_ui/colors/templates.rb

@@ -7,30 +7,40 @@ module KeystoneUi
         ocean: {
           accent: :blue,
           surface: :slate,
+          background: "#e0f2fe",
+          text: "#0c4a6e",
           label: "Ocean",
           description: "Cool blues with slate undertones"
         },
         forest: {
           accent: :emerald,
           surface: :stone,
+          background: "#ecfdf5",
+          text: "#064e3b",
           label: "Forest",
           description: "Natural greens with warm stone"
         },
         twilight: {
           accent: :violet,
           surface: :zinc,
+          background: "#1e1b4b",
+          text: "#ede9fe",
           label: "Twilight",
           description: "Deep violet with clean zinc"
         },
         coral: {
           accent: :rose,
           surface: :neutral,
+          background: "#fff1f2",
+          text: "#4c0519",
           label: "Coral",
           description: "Warm rose with neutral balance"
         },
         arctic: {
           accent: :cyan,
           surface: :gray,
+          background: "#ecfeff",
+          text: "#164e63",
           label: "Arctic",
           description: "Bright cyan with crisp gray"
         }
@@ -54,6 +64,8 @@ module KeystoneUi
         {
           accent: KeystoneUi::Colors.configuration.default_accent,
           surface: KeystoneUi::Colors.configuration.default_surface,
+          background: KeystoneUi::Colors.configuration.default_background,
+          text: KeystoneUi::Colors.configuration.default_text,
           label: "Default",
           description: "Default theme"
         }

data/lib/keystone_ui/colors/version.rb

@@ -2,6 +2,6 @@
 
 module KeystoneUi
   module Colors
-    VERSION = "0.2.0"
+    VERSION = "0.3.0"
   end
 end

metadata

@@ -1,14 +1,13 @@
 --- !ruby/object:Gem::Specification
 name: keystone_ui-colors
 version: !ruby/object:Gem::Version
-  version: 0.2.0
+  version: 0.3.0
 platform: ruby
 authors:
 - Tyler Schneider
-autorequire:
 bindir: bin
 cert_chain: []
-date: 2026-09-14 00:00:00.000000000 Z
+date: 1980-01-02 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: keystone_ui
@@ -16,14 +15,14 @@ dependencies:
     requirements:
     - - ">="
       - !ruby/object:Gem::Version
-        version: 0.10.0
+        version: 0.11.0
   type: :runtime
   prerelease: false
   version_requirements: !ruby/object:Gem::Requirement
     requirements:
     - - ">="
       - !ruby/object:Gem::Version
-        version: 0.10.0
+        version: 0.11.0
 - !ruby/object:Gem::Dependency
   name: railties
   requirement: !ruby/object:Gem::Requirement
@@ -83,12 +82,19 @@ files:
 - app/helpers/keystone_ui/colors/palette_helper.rb
 - app/javascript/keystone_ui/colors/theme_settings_controller.js
 - app/models/keystone_ui/colors/application_record.rb
+- app/models/keystone_ui/colors/custom_colours.rb
+- app/models/keystone_ui/colors/forget_the_theme_choice.rb
+- app/models/keystone_ui/colors/kept.rb
+- app/models/keystone_ui/colors/pick_colours.rb
+- app/models/keystone_ui/colors/refusal.rb
 - app/models/keystone_ui/colors/theme_preference.rb
+- app/views/keystone_ui/colors/settings/_picker.html.erb
 - app/views/keystone_ui/colors/settings/show.html.erb
 - config/routes.rb
 - lib/generators/keystone_ui/colors/install/install_generator.rb
 - lib/generators/keystone_ui/colors/install/templates/create_keystone_ui_colors_theme_preferences.rb.erb
 - lib/generators/keystone_ui/colors/update/templates/add_mode_to_keystone_ui_colors_theme_preferences.rb.erb
+- lib/generators/keystone_ui/colors/update/templates/add_text_to_keystone_ui_colors_theme_preferences.rb.erb
 - lib/generators/keystone_ui/colors/update/update_generator.rb
 - lib/keystone_ui-colors.rb
 - lib/keystone_ui/colors.rb
@@ -107,7 +113,6 @@ metadata:
   bug_tracker_uri: https://github.com/DYB-Development/keystone_ui-colors/issues
   documentation_uri: https://github.com/DYB-Development/keystone_ui-colors#readme
   rubygems_mfa_required: 'true'
-post_install_message:
 rdoc_options: []
 require_paths:
 - lib
@@ -122,8 +127,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
     - !ruby/object:Gem::Version
       version: '0'
 requirements: []
-rubygems_version: 3.5.16
-signing_key:
+rubygems_version: 4.0.20
 specification_version: 4
 summary: Per-user color palette settings for Keystone UI.
 test_files: []