Resolve ui stuff

webapp/src/components/Alerts.tsx

@@ -10,6 +10,7 @@ import {
   type AlertRule,
   type CompareOp,
 } from '../lib/api'
+import { sectionHeaderClassName, sectionHeaderLeftClassName } from './CollapsibleSection'
 import { HelpIcon } from './HelpIcon'
 import { queryInputClassName } from './FilterBar'
 
@@ -264,12 +265,14 @@ export function Alerts() {
   }
 
   return (
-    <div className="border-b border-border p-3 text-sm">
-      <div className="mb-2 flex items-center gap-1.5 text-xs text-text-subtle">
-        Alerts
-        <HelpIcon sectionId="alerts" label="Help: Alerts" />
+    <div className="border-b border-border text-sm">
+      <div className={sectionHeaderClassName}>
+        <div className={sectionHeaderLeftClassName}>
+          Alerts
+          <HelpIcon sectionId="alerts" label="Help: Alerts" />
+        </div>
       </div>
-      <div className="flex gap-4">
+      <div className="flex gap-4 p-3">
         <form onSubmit={handleSubmit} className="w-96 shrink-0 space-y-2">
           <div>
             <label className="mb-1 block text-xs text-text-subtle">Name</label>