Adopt shared WebUI layout primitives

webui/src/features/scheduling/SchedulingPage.tsx

@@ -14,7 +14,7 @@ import {
   Send,
   XCircle
 } from "lucide-react";
-import {
+import { ContentGrid, FormGrid,
   ActionBlockerHint,
   Button,
   Card,
@@ -994,7 +994,7 @@ export default function SchedulingPage({ settings, auth }: { settings: ApiSettin
                     void persistDraft();
                   }}>
                   <Card title={I18N.basicInformation}>
-                    <div className="form-grid">
+                    <FormGrid columns={1} collapseAt="standard" className="">
                       <FormField label={I18N.title}>
                         <input required maxLength={500} value={title} onChange={(event) => changeDraft(setTitle, event.target.value)} />
                       </FormField>
@@ -1004,7 +1004,7 @@ export default function SchedulingPage({ settings, auth }: { settings: ApiSettin
                       <FormField label={I18N.location}>
                         <input maxLength={500} value={location} onChange={(event) => changeDraft(setLocation, event.target.value)} />
                       </FormField>
-                    </div>
+                    </FormGrid>
                   </Card>
 
                   <Card title={I18N.calendarIntegration}>
@@ -1609,7 +1609,7 @@ function SchedulingSettings({
 }) {
   return (
     <Card title={I18N.generalSettings}>
-      <div className="settings-grid">
+      <ContentGrid columns={2} collapseAt="workspace" className="">
         <ToggleSwitch
           label={I18N.notifyOnAnswers}
           help={I18N.notifyOnAnswersHelp}
@@ -1677,7 +1677,7 @@ function SchedulingSettings({
               onValueChange={(value) => onChange("anonymousPassword", value)} />
           </FormField>
         </div>
-        </div>
+        </ContentGrid>
       {policyLocked ? (
         <DismissibleAlert tone="info" dismissible={false} compact>
           {I18N.policyLocked}

webui/src/features/scheduling/SchedulingPublicPage.tsx

@@ -1,6 +1,6 @@
 import { useEffect, useMemo, useState, type FormEvent } from "react";
 import { Link, useParams } from "react-router";
-import {
+import { FormGrid,
   Button,
   Card,
   DismissibleAlert,
@@ -181,7 +181,7 @@ export default function SchedulingPublicPage({ settings, auth }: SchedulingPubli
             <form className="scheduling-public-access-form" onSubmit={openRequest}>
               <p className="muted">{I18N.accessHelp}</p>
               {accessAttempted && error && <DismissibleAlert tone="danger">{error}</DismissibleAlert>}
-              <div className="form-grid two-col">
+              <FormGrid columns={2} collapseAt="standard" className="">
                 <FormField label={I18N.email}>
                   <input
                     type="email"
@@ -196,7 +196,7 @@ export default function SchedulingPublicPage({ settings, auth }: SchedulingPubli
                     value={password}
                     onValueChange={setPassword} />
                 </FormField>
-              </div>
+              </FormGrid>
               <div className="scheduling-public-actions">
                 <Button
                   type="submit"

webui/src/styles/scheduling.css

@@ -102,10 +102,6 @@
     padding-top: 12px;
   }
 
-  .scheduling-public-page .form-grid.two-col {
-    grid-template-columns: 1fr;
-  }
-
   .scheduling-public-summary {
     grid-template-columns: 1fr;
   }