margins

app.py

@@ -619,9 +619,9 @@ CATEGORY_DISPLAY_MAP = {
     'Drug– and Substance–Related Activities': 'Drug Use',
     'Sexual Content and Violence': 'Sexual Content',
     'Weapon, Explosives, and Hazardous Materials': 'Weapons & Hazmat',
-    'Safe Prompts': 'Safe Prompts',
     'Cybercrime, Hacking, and Digital Exploits': 'Cybercrime',
-    'Creative Content Involving Illicit Themes': 'Illicit Creative'
+    'Creative Content Involving Illicit Themes': 'Illicit Creative',
+    'Safe Prompts': 'Safe Prompts'
 }
 # Create reverse mapping for lookups
 CATEGORY_REVERSE_MAP = {v: k for k, v in CATEGORY_DISPLAY_MAP.items()}
@@ -672,7 +672,7 @@ with demo:
                         scale=1
                     )
                 with gr.Row():
-                    refresh_button = gr.Button("Refresh", scale=0)
+                    refresh_button = gr.Button("Refresh", scale=0, elem_id="refresh-button")
 
                 # Create tabs for each category
                 with gr.Tabs(elem_classes="category-tabs") as category_tabs:

src/display/css_html_js.py

@@ -6,6 +6,9 @@ custom_css = """
 .markdown-text {
     font-size: 16px !important;
     text-align: justify !important;
+    line-height: 1.1 !important;
+    margin-top: 10px !important;
+    margin-bottom: 10px !important;
 }
 
 .tab-buttons button.selected {
@@ -86,4 +89,9 @@ custom_css = """
      /* background: #18181b !important; */ /* Removed background override */
      border-color: #27272a !important;
 }
+
+#refresh-button {
+    margin-top: 5px !important;
+    margin-bottom: 5px !important;
+}
 """

src/display/utils.py

@@ -384,9 +384,9 @@ CATEGORIES = [
     'Drug– and Substance–Related Activities',
     'Sexual Content and Violence',
     'Weapon, Explosives, and Hazardous Materials',
-    'Safe Prompts',
     'Cybercrime, Hacking, and Digital Exploits',
-    'Creative Content Involving Illicit Themes'
+    'Creative Content Involving Illicit Themes',
+    'Safe Prompts'
 ]
 
 # Test types in GuardBench