pre cardcolor

webui/src/components/OverseerPreferencePanel/index.jsx

@@ -1,5 +1,6 @@
 import { useSessionActions, useSessionSelector } from '../../context/SessionContext.jsx';
 import { useSettingsNamespace } from '../../settings/index.js';
+import CardFrame from '../CardFrame/index.jsx';
 
 export default function OverseerPreferencePanel() {
   const { identifySession } = useSessionActions();
@@ -21,10 +22,7 @@ export default function OverseerPreferencePanel() {
   };
 
   return (
-    <section className="surface p-1 text-xs text-slate-200 text-center">
-      <div className="panel-title-row">
-        <span className="panel-title-text">Overseer vote</span>
-      </div>
+    <CardFrame title="Overseer vote" bodyClassName="space-y-0.5 text-center text-xs text-slate-200">
       <label
         className={`flex items-center justify-center gap-1.5 rounded px-1 py-0.5 ${
           enabled ? 'bg-emerald-600/80 text-emerald-50' : 'bg-slate-600/70 text-slate-100'
@@ -47,6 +45,6 @@ export default function OverseerPreferencePanel() {
           {running ? 'Running!' : 'Stopped by vote.'}
         </span>
       </div>
-    </section>
+    </CardFrame>
   );
 }