From 6e03e747ffc2c5754925e70bc0090dc3f689602b Mon Sep 17 00:00:00 2001
From: Abel Luck <abel@guardianproject.info>
Date: Mon, 30 Mar 2026 17:21:10 +0200
Subject: [PATCH] fix toggloe checkbox active state

---
 repub/static/app.css          |  7 +++++++
 repub/static/app.tailwind.css |  1 +
 tests/test_web.py             | 21 ++++++++++++++++++++-
 3 files changed, 28 insertions(+), 1 deletion(-)

diff --git a/repub/static/app.css b/repub/static/app.css
index dae085d..0a0f270 100644
--- a/repub/static/app.css
+++ b/repub/static/app.css
@@ -392,6 +392,10 @@
     --tw-translate-x: calc(var(--spacing) * 0);
     translate: var(--tw-translate-x) var(--tw-translate-y);
   }
+  .translate-x-5 {
+    --tw-translate-x: calc(var(--spacing) * 5);
+    translate: var(--tw-translate-x) var(--tw-translate-y);
+  }
   .cursor-not-allowed {
     cursor: not-allowed;
   }
@@ -541,6 +545,9 @@
   .bg-amber-400 {
     background-color: var(--color-amber-400);
   }
+  .bg-amber-500 {
+    background-color: var(--color-amber-500);
+  }
   .bg-emerald-100 {
     background-color: var(--color-emerald-100);
   }
diff --git a/repub/static/app.tailwind.css b/repub/static/app.tailwind.css
index 97c0bcf..742b073 100644
--- a/repub/static/app.tailwind.css
+++ b/repub/static/app.tailwind.css
@@ -1 +1,2 @@
 @import "tailwindcss" source("../");
+@source inline("bg-amber-500 translate-x-5");
diff --git a/tests/test_web.py b/tests/test_web.py
index eff5922..3fd92fd 100644
--- a/tests/test_web.py
+++ b/tests/test_web.py
@@ -6,7 +6,7 @@ from datetime import UTC, datetime, timedelta
 from pathlib import Path
 from typing import Any, cast
 
-from repub.components import status_badge
+from repub.components import status_badge, toggle_field
 from repub.datastar import RefreshBroker, render_sse_event, render_stream
 from repub.jobs import load_dashboard_view
 from repub.model import (
@@ -38,6 +38,25 @@ def test_status_badge_uses_green_done_tone() -> None:
     assert "Succeeded" in badge
 
 
+def test_toggle_field_active_state_utilities_exist_in_built_css() -> None:
+    markup = str(
+        toggle_field(
+            label="Enabled",
+            description="Enable this source",
+            signal_name="enabled",
+            checked=True,
+        )
+    )
+    css = (
+        Path(__file__).resolve().parents[1] / "repub" / "static" / "app.css"
+    ).read_text(encoding="utf-8")
+
+    assert "data-class:bg-amber-500" in markup
+    assert "data-class:translate-x-5" in markup
+    assert ".bg-amber-500" in css
+    assert ".translate-x-5" in css
+
+
 def test_runs_page_renders_completed_execution_end_time_as_relative_hoverable_time() -> (
     None
 ):