styled output

app.py

@@ -74,12 +74,56 @@ with gr.Blocks(title="Image + Text Compliance Check") as demo:
         hf_repo   = gr.Textbox(label="HF repo", value=DEFAULT_HF_REPO)
         hf_thresh = gr.Slider(label="ML threshold", minimum=0.5, maximum=0.99, step=0.01, value=float(DEFAULT_HF_THRESH))
 
-    out = gr.Code(label="Result JSON", language="json")
-    gr.Button("Run Compliance Check").click(
-        fn=on_run,
-        inputs=[image, ptxt, social, agent_name, agent_phone, company_name, company_phones_json, disclaimer,
-                enable_ml, hf_repo, hf_thresh],
-        outputs=[out],
+        out = gr.Code(label="Result JSON", language="json", visible=False)
+        
+    with gr.Row():
+        gr.Button("Run Compliance Check").click(
+            fn=on_run,
+            inputs=[image, ptxt, social, agent_name, agent_phone, company_name, company_phones_json, disclaimer,
+                    enable_ml, hf_repo, hf_thresh],
+            outputs=[out],
+        )
+
+    with gr.Row():
+        fair_housing_out = gr.Textbox(label="Fair Housing", interactive=False)
+        ptxt_out = gr.Textbox(label="Post Text", interactive=False)
+        img_out = gr.Textbox(label="Image Text", interactive=False)
+
+    def update_results(results_json):
+        results = json.loads(results_json)
+        
+        fh_compliant = results.get("Fair_Housing", {}).get("compliant", False)
+        ptxt_compliant = results.get("Ptxt", {}).get("compliant", False)
+        img_compliant = results.get("img", {}).get("compliant", False)
+
+        return {
+            fair_housing_out: gr.update(
+                value="Compliant" if fh_compliant else "Not Compliant",
+                style={
+                    "background-color": "green" if fh_compliant else "red",
+                    "color": "white",
+                }
+            ),
+            ptxt_out: gr.update(
+                value="Compliant" if ptxt_compliant else "Not Compliant",
+                style={
+                    "background-color": "green" if ptxt_compliant else "red",
+                    "color": "white",
+                }
+            ),
+            img_out: gr.update(
+                value="Compliant" if img_compliant else "Not Compliant",
+                style={
+                    "background-color": "green" if img_compliant else "red",
+                    "color": "white",
+                }
+            )
+        }
+
+    out.change(
+        fn=update_results,
+        inputs=[out],
+        outputs=[fair_housing_out, ptxt_out, img_out]
     )
 
 if __name__ == "__main__":