save

component-library/src/pages/home.tsx

@@ -271,7 +271,7 @@ const audiences = [
 
 const scaleFlows = [
   {
-    vector: vectors.tealBars,
+    render: renders.barChartManyFew,
     label: "1 Gebäude",
     sub: "Ein Eigentümer kann ein Mehrfamilienhaus konfigurieren.",
     steps: [
@@ -281,7 +281,7 @@ const scaleFlows = [
     ],
   },
   {
-    vector: vectors.consumptionRing,
+    render: renders.barChartManyFull,
     label: "50 Gebäude",
     sub: "Eine Hausverwaltung kann denselben Prozess auf viele Gebäude übertragen.",
     steps: [
@@ -440,11 +440,11 @@ export default function HomePage() {
               {scaleFlows.map((flow) => (
                 <div key={flow.label} className="flex flex-col gap-5 p-6 sm:p-8">
                   <div className="flex items-center gap-4">
-                    <img
-                      src={flow.vector}
+                    <AssetRender
+                      render={flow.render}
                       alt=""
-                      className="size-14"
-                      loading="lazy"
+                      className="flex size-14 shrink-0 items-center justify-center"
+                      imgClassName="w-14"
                     />
                     <div>
                       <h3 className="text-xl font-extrabold tracking-tight text-navy">