Adopt shared WebUI layout primitives

webui/src/features/dashboard/DashboardPage.tsx

@@ -1,3 +1,4 @@
+import { MetricGrid } from "@govoplan/core-webui";
 import {
   useEffect,
   useMemo,
@@ -491,7 +492,7 @@ export default function DashboardPage({
       }
     >
 
-        <div className="metric-grid dashboard-summary-grid">
+        <MetricGrid className="dashboard-summary-metrics">
           <MetricCard
             label="Active interface modules"
             value={modules.length}
@@ -516,7 +517,7 @@ export default function DashboardPage({
             tone="neutral"
             detail={layoutSourceLabel(layoutSource)}
           />
-        </div>
+        </MetricGrid>
 
         <LoadingFrame loading={loading} label="Loading Dashboard layout">
           {configuring ? (

webui/src/features/dashboard/widgets/InstalledModulesWidget.tsx

@@ -1,3 +1,4 @@
+import { DescriptionList } from "@govoplan/core-webui";
 import {
   StatusBadge,
   type DashboardWidgetConfiguration,
@@ -26,7 +27,7 @@ export default function InstalledModulesWidget({
 
   return (
     <>
-      <dl className="detail-list dashboard-compact-list">
+      <DescriptionList variant="inline" termWidth="compact">
         {visibleModules.map((module) =>
         <div key={module.id}>
             <dt><StatusBadge status="success" label={module.id} /></dt>
@@ -36,7 +37,7 @@ export default function InstalledModulesWidget({
             </dd>
           </div>
         )}
-      </dl>
+      </DescriptionList>
       {remaining > 0 && <p className="muted dashboard-widget-overflow">+{remaining} more active interface modules</p>}
     </>);
 }