Use theme config templates with singular color definition (#4053)

* Attempt to templaterize the theme specific files

* Cleanup

* Slim down

* Combine render into -set

* Pull out the dynamic template rendering again, but simpler

* Fix vars

* Variables are lowercase

* Better presentation

* Fix missing colors

* Provide stripped values too

* Fix colors for regular hex format

* Bring back explicit btop themes

They're too involved to derive from a basic color set

* Make an atomic swap of the theme directories

* No longer used by walker to cancel

* Explain why

* Remove redundant const

* Consistent const naming

* No longe have $THEMES_DIR

* Correct the blue

* Set opencode colors too

* Fix colors for readability

* Move the templates together with the others in default

* Split user themes and default themes

* Fix paths

* Look for both user themes and default themes

Plus speed things up

* Migrate to the new setup where default themes live inside omarchy

* Explicitly store the name of the current theme

* Cleanup

* No longer need omarchy-theme-next since themes are now fully rendered, not symlinks

* Get current theme name from the new theme.name file

* Look for user background images in dedicated directory

* Need yq for toml

* Need yq to parse colors.toml

* Look for backgrounds matching the new theme.name

We no longer have symlinks

* Migrate existing user backgrounds to the new proper location

* Install user backgrounds in the correct path

* Fix quoting

* Just rely on the system theme for opencode and get ready for USRSIG2 being available to live reload

* Fix template generation for rgb colors

default/elephant/omarchy_themes.lua

@@ -4,67 +4,93 @@
 Name = "omarchythemes"
 NamePretty = "Omarchy Themes"
 
+-- Check if file exists using Lua (no subprocess)
+local function file_exists(path)
+  local f = io.open(path, "r")
+  if f then
+    f:close()
+    return true
+  end
+  return false
+end
+
+-- Get first matching file from directory using ls (single call for fallback)
+local function first_image_in_dir(dir)
+  local handle = io.popen("ls -1 '" .. dir .. "' 2>/dev/null | head -n 1")
+  if handle then
+    local file = handle:read("*l")
+    handle:close()
+    if file and file ~= "" then
+      return dir .. "/" .. file
+    end
+  end
+  return nil
+end
+
 -- The main function elephant will call
 function GetEntries()
   local entries = {}
-  local theme_dir = os.getenv("HOME") .. "/.config/omarchy/themes"
+  local user_theme_dir = os.getenv("HOME") .. "/.config/omarchy/themes"
+  local omarchy_path = os.getenv("OMARCHY_PATH") or ""
+  local default_theme_dir = omarchy_path .. "/themes"
 
-  -- First, get all theme directories
-  local find_dirs_cmd = "find -L '" .. theme_dir .. "' -mindepth 1 -maxdepth 1 -type d 2>/dev/null"
+  local seen_themes = {}
 
-  local handle = io.popen(find_dirs_cmd)
-  if not handle then
-    return entries
-  end
+  -- Helper function to process themes from a directory
+  local function process_themes_from_dir(theme_dir)
+    -- Single find call to get all theme directories
+    local handle = io.popen("find -L '" .. theme_dir .. "' -mindepth 1 -maxdepth 1 -type d 2>/dev/null")
+    if not handle then
+      return
+    end
 
-  for theme_path in handle:lines() do
-    local theme_name = theme_path:match(".*/(.+)$")
+    for theme_path in handle:lines() do
+      local theme_name = theme_path:match(".*/(.+)$")
 
-    if theme_name then
-      -- find preview image
-      local find_preview_cmd = "find -L '"
-        .. theme_path
-        .. "' -maxdepth 1 -type f \\( -name 'preview.png' -o -name 'preview.jpg' \\) 2>/dev/null | head -n 1"
-      local preview_handle = io.popen(find_preview_cmd)
-      local preview_path = nil
+      if theme_name and not seen_themes[theme_name] then
+        seen_themes[theme_name] = true
 
-      if preview_handle then
-        preview_path = preview_handle:read("*l")
-        preview_handle:close()
-      end
+        -- Check for preview images directly (no subprocess)
+        local preview_path = nil
+        local preview_png = theme_path .. "/preview.png"
+        local preview_jpg = theme_path .. "/preview.jpg"
 
-      -- If no preview found, use first image from backgrounds folder
-      if not preview_path or preview_path == "" then
-        local bg_cmd = "find -L '"
-          .. theme_path
-          .. "/backgrounds' -maxdepth 1 -type f \\( -iname '*.png' -o -iname '*.jpg' -o -iname '*.jpeg' \\) 2>/dev/null | head -n 1"
-        local bg_handle = io.popen(bg_cmd)
-        if bg_handle then
-          preview_path = bg_handle:read("*l")
-          bg_handle:close()
+        if file_exists(preview_png) then
+          preview_path = preview_png
+        elseif file_exists(preview_jpg) then
+          preview_path = preview_jpg
+        else
+          -- Fallback: get first image from backgrounds (one ls call)
+          preview_path = first_image_in_dir(theme_path .. "/backgrounds")
+        end
+
+        if preview_path and preview_path ~= "" then
+          local display_name = theme_name:gsub("_", " "):gsub("%-", " ")
+          display_name = display_name:gsub("(%a)([%w_']*)", function(first, rest)
+            return first:upper() .. rest:lower()
+          end)
+          display_name = display_name .. "  "
+
+          table.insert(entries, {
+            Text = display_name,
+            Preview = preview_path,
+            PreviewType = "file",
+            Actions = {
+              activate = "omarchy-theme-set " .. theme_name,
+            },
+          })
         end
       end
-
-      if preview_path and preview_path ~= "" then
-        local display_name = theme_name:gsub("_", " "):gsub("%-", " ")
-        display_name = display_name:gsub("(%a)([%w_']*)", function(first, rest)
-          return first:upper() .. rest:lower()
-        end)
-        display_name = display_name .. "  "
-
-        table.insert(entries, {
-          Text = display_name,
-          Preview = preview_path,
-          PreviewType = "file",
-          Actions = {
-            activate = "omarchy-theme-set " .. theme_name,
-          },
-        })
-      end
     end
+
+    handle:close()
   end
 
-  handle:close()
+  -- Process user themes first (they take precedence)
+  process_themes_from_dir(user_theme_dir)
+  -- Then process default themes (only if not already seen)
+  process_themes_from_dir(default_theme_dir)
+
   return entries
 end
 

default/themed/alacritty.toml.tpl

@@ -0,0 +1,47 @@
+[colors.primary]
+background = "{{ background }}"
+foreground = "{{ foreground }}"
+
+[colors.cursor]
+text = "{{ background }}"
+cursor = "{{ cursor }}"
+
+[colors.vi_mode_cursor]
+text = "{{ background }}"
+cursor = "{{ cursor }}"
+
+[colors.search.matches]
+foreground = "{{ background }}"
+background = "{{ color3 }}"
+
+[colors.search.focused_match]
+foreground = "{{ background }}"
+background = "{{ color1 }}"
+
+[colors.footer_bar]
+foreground = "{{ background }}"
+background = "{{ foreground }}"
+
+[colors.selection]
+text = "{{ selection_foreground }}"
+background = "{{ selection_background }}"
+
+[colors.normal]
+black = "{{ color0 }}"
+red = "{{ color1 }}"
+green = "{{ color2 }}"
+yellow = "{{ color3 }}"
+blue = "{{ color4 }}"
+magenta = "{{ color5 }}"
+cyan = "{{ color6 }}"
+white = "{{ color7 }}"
+
+[colors.bright]
+black = "{{ color8 }}"
+red = "{{ color9 }}"
+green = "{{ color10 }}"
+yellow = "{{ color11 }}"
+blue = "{{ color12 }}"
+magenta = "{{ color13 }}"
+cyan = "{{ color14 }}"
+white = "{{ color15 }}"

default/themed/btop.theme.tpl

@@ -0,0 +1,83 @@
+# Main background, empty for terminal default, need to be empty if you want transparent background
+theme[main_bg]="{{ background }}"
+
+# Main text color
+theme[main_fg]="{{ foreground }}"
+
+# Title color for boxes
+theme[title]="{{ foreground }}"
+
+# Highlight color for keyboard shortcuts
+theme[hi_fg]="{{ accent }}"
+
+# Background color of selected item in processes box
+theme[selected_bg]="{{ color8 }}"
+
+# Foreground color of selected item in processes box
+theme[selected_fg]="{{ accent }}"
+
+# Color of inactive/disabled text
+theme[inactive_fg]="{{ color8 }}"
+
+# Color of text appearing on top of graphs, i.e uptime and current network graph scaling
+theme[graph_text]="{{ foreground }}"
+
+# Background color of the percentage meters
+theme[meter_bg]="{{ color8 }}"
+
+# Misc colors for processes box including mini cpu graphs, details memory graph and details status text
+theme[proc_misc]="{{ foreground }}"
+
+# CPU, Memory, Network, Proc box outline colors
+theme[cpu_box]="{{ color5 }}"
+theme[mem_box]="{{ color2 }}"
+theme[net_box]="{{ color1 }}"
+theme[proc_box]="{{ accent }}"
+
+# Box divider line and small boxes line color
+theme[div_line]="{{ color8 }}"
+
+# Temperature graph color (Green -> Yellow -> Red)
+theme[temp_start]="{{ color2 }}"
+theme[temp_mid]="{{ color3 }}"
+theme[temp_end]="{{ color1 }}"
+
+# CPU graph colors (Teal -> Lavender)
+theme[cpu_start]="{{ color6 }}"
+theme[cpu_mid]="{{ color4 }}"
+theme[cpu_end]="{{ color5 }}"
+
+# Mem/Disk free meter (Mauve -> Lavender -> Blue)
+theme[free_start]="{{ color5 }}"
+theme[free_mid]="{{ color4 }}"
+theme[free_end]="{{ color6 }}"
+
+# Mem/Disk cached meter (Sapphire -> Lavender)
+theme[cached_start]="{{ color4 }}"
+theme[cached_mid]="{{ color6 }}"
+theme[cached_end]="{{ color5 }}"
+
+# Mem/Disk available meter (Peach -> Red)
+theme[available_start]="{{ color3 }}"
+theme[available_mid]="{{ color1 }}"
+theme[available_end]="{{ color1 }}"
+
+# Mem/Disk used meter (Green -> Sky)
+theme[used_start]="{{ color2 }}"
+theme[used_mid]="{{ color6 }}"
+theme[used_end]="{{ color4 }}"
+
+# Download graph colors (Peach -> Red)
+theme[download_start]="{{ color3 }}"
+theme[download_mid]="{{ color1 }}"
+theme[download_end]="{{ color1 }}"
+
+# Upload graph colors (Green -> Sky)
+theme[upload_start]="{{ color2 }}"
+theme[upload_mid]="{{ color6 }}"
+theme[upload_end]="{{ color4 }}"
+
+# Process box color gradient for threads, mem and cpu usage (Sapphire -> Mauve)
+theme[process_start]="{{ color6 }}"
+theme[process_mid]="{{ color4 }}"
+theme[process_end]="{{ color5 }}"

default/themed/ghostty.conf.tpl

@@ -0,0 +1,22 @@
+background = {{ background }}
+foreground = {{ foreground }}
+cursor-color = {{ cursor }}
+selection-background = {{ selection_background }}
+selection-foreground = {{ selection_foreground }}
+
+palette = 0={{ color0 }}
+palette = 1={{ color1 }}
+palette = 2={{ color2 }}
+palette = 3={{ color3 }}
+palette = 4={{ color4 }}
+palette = 5={{ color5 }}
+palette = 6={{ color6 }}
+palette = 7={{ color7 }}
+palette = 8={{ color8 }}
+palette = 9={{ color9 }}
+palette = 10={{ color10 }}
+palette = 11={{ color11 }}
+palette = 12={{ color12 }}
+palette = 13={{ color13 }}
+palette = 14={{ color14 }}
+palette = 15={{ color15 }}

default/themed/hyprland-preview-share-picker.css.tpl

@@ -0,0 +1,94 @@
+@define-color foreground {{ foreground }};
+@define-color background {{ background }};
+@define-color accent {{ accent }};
+@define-color muted {{ color8 }};
+@define-color card_bg {{ color0 }};
+@define-color text_dark {{ background }};
+@define-color accent_hover {{ color12 }};
+@define-color selected_tab {{ accent }};
+@define-color text {{ foreground }};
+
+* {
+  all: unset;
+  font-family: JetBrains Mono NF;
+  color: @foreground;
+  font-weight: bold;
+  font-size: 16px;
+}
+
+.window {
+  background: alpha(@background, 0.95);
+  border: solid 2px @accent;
+  margin: 4px;
+  padding: 18px;
+}
+
+tabs {
+    padding: 0.5rem 1rem;
+}
+
+tabs > tab {
+    margin-right: 1rem;
+}
+
+.tab-label {
+    color: @text;
+    transition: all 0.2s ease;
+}
+
+tabs > tab:checked > .tab-label, tabs > tab:active > .tab-label {
+    text-decoration: underline currentColor;
+    color: @selected_tab;
+}
+
+tabs > tab:focus > .tab-label {
+    color: @foreground;
+}
+
+.page {
+    padding: 1rem;
+}
+
+.image-label {
+    font-size: 12px;
+    padding: 0.25rem;
+}
+
+flowboxchild > .card, button > .card {
+    transition: all 0.2s ease;
+    border: solid 2px transparent;
+    border-color: @background;
+    border-radius: 5px;
+    background-color: @card_bg;
+    padding: 5px;
+}
+
+flowboxchild:hover > .card, button:hover > .card, flowboxchild:active > .card, flowboxchild:selected > .card, button:active > .card, button:selected > .card, button:focus > .card {
+    border: solid 2px @accent;
+}
+
+.image {
+    border-radius: 5px;
+}
+
+.region-button {
+    padding: 0.5rem 1rem;
+    border-radius: 5px;
+    background-color: @accent;
+    color: @text_dark;
+    transition: all 0.2s ease;
+}
+
+.region-button > label {
+    color: @text_dark;
+}
+
+.region-button:not(:disabled):hover, .region-button:not(:disabled):focus {
+    background-color: @accent_hover;
+    color: @text_dark;
+}
+
+.region-button:disabled {
+    background-color: @muted;
+    color: @background;
+}

default/themed/hyprland.conf.tpl

@@ -0,0 +1,9 @@
+$activeBorderColor = rgb({{ accent_strip }})
+
+general {
+    col.active_border = $activeBorderColor
+}
+
+group {
+    col.border_active = $activeBorderColor
+}

default/themed/hyprlock.conf.tpl

@@ -0,0 +1,5 @@
+$color = rgba({{ background_rgb }}, 1.0)
+$inner_color = rgba({{ background_rgb }}, 0.8)
+$outer_color = rgba({{ foreground_rgb }}, 1.0)
+$font_color = rgba({{ foreground_rgb }}, 1.0)
+$check_color = rgba({{ accent_rgb }}, 1.0)

default/themed/kitty.conf.tpl

@@ -0,0 +1,27 @@
+foreground {{ foreground }}
+background {{ background }}
+selection_foreground {{ selection_foreground }}
+selection_background {{ selection_background }}
+
+cursor {{ cursor }}
+cursor_text_color {{ background }}
+
+active_border_color {{ active_border_color }}
+active_tab_background {{ active_tab_background }}
+
+color0 {{ color0 }}
+color1 {{ color1 }}
+color2 {{ color2 }}
+color3 {{ color3 }}
+color4 {{ color4 }}
+color5 {{ color5 }}
+color6 {{ color6 }}
+color7 {{ color7 }}
+color8 {{ color8 }}
+color9 {{ color9 }}
+color10 {{ color10 }}
+color11 {{ color11 }}
+color12 {{ color12 }}
+color13 {{ color13 }}
+color14 {{ color14 }}
+color15 {{ color15 }}

default/themed/mako.ini.tpl

@@ -0,0 +1,5 @@
+include=~/.local/share/omarchy/default/mako/core.ini
+
+text-color={{ foreground }}
+border-color={{ foreground }}
+background-color={{ background }}

default/themed/swayosd.css.tpl

@@ -0,0 +1,5 @@
+@define-color background-color {{ background }};
+@define-color border-color {{ foreground }};
+@define-color label {{ foreground }};
+@define-color image {{ foreground }};
+@define-color progress {{ foreground }};

default/themed/walker.css.tpl

@@ -0,0 +1,6 @@
+@define-color selected-text {{ accent }};
+@define-color text {{ foreground }};
+@define-color base {{ background }};
+@define-color border {{ foreground }};
+@define-color foreground {{ foreground }};
+@define-color background {{ background }};

default/themed/waybar.css.tpl

@@ -0,0 +1,2 @@
+@define-color foreground {{ foreground }};
+@define-color background {{ background }};