agent: Apply homepage CRO improvements

2026-06-17 14:05:47 +05:30
parent de0426cad9
commit 5e81c4bab5
2 changed files with 151 additions and 163 deletions
@@ -0,0 +1,113 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1200 720" width="1200" height="720" role="img" aria-label="WorkRoot project dashboard preview">
+  <defs>
+    <linearGradient id="wr-accent" x1="0" y1="0" x2="1" y2="1">
+      <stop offset="0" stop-color="#22d3ee"/>
+      <stop offset="1" stop-color="#0891b2"/>
+    </linearGradient>
+    <linearGradient id="wr-bar" x1="0" y1="1" x2="0" y2="0">
+      <stop offset="0" stop-color="#0891b2"/>
+      <stop offset="1" stop-color="#22d3ee"/>
+    </linearGradient>
+    <linearGradient id="wr-area" x1="0" y1="0" x2="0" y2="1">
+      <stop offset="0" stop-color="#0891b2" stop-opacity="0.35"/>
+      <stop offset="1" stop-color="#0891b2" stop-opacity="0"/>
+    </linearGradient>
+  </defs>
+
+  <!-- App canvas -->
+  <rect width="1200" height="720" fill="#f1f5f9"/>
+
+  <!-- Sidebar -->
+  <rect width="240" height="720" fill="#0f172a"/>
+  <circle cx="44" cy="52" r="14" fill="url(#wr-accent)"/>
+  <rect x="68" y="44" width="104" height="16" rx="6" fill="#e2e8f0"/>
+  <!-- Nav items -->
+  <rect x="20" y="108" width="200" height="40" rx="10" fill="#0e7490"/>
+  <rect x="40" y="120" width="18" height="16" rx="4" fill="#67e8f9"/>
+  <rect x="70" y="121" width="120" height="14" rx="5" fill="#e2e8f0"/>
+  <g fill="#334155">
+    <rect x="40" y="172" width="18" height="16" rx="4"/>
+    <rect x="40" y="224" width="18" height="16" rx="4"/>
+    <rect x="40" y="276" width="18" height="16" rx="4"/>
+    <rect x="40" y="328" width="18" height="16" rx="4"/>
+  </g>
+  <g fill="#475569">
+    <rect x="70" y="173" width="110" height="14" rx="5"/>
+    <rect x="70" y="225" width="96" height="14" rx="5"/>
+    <rect x="70" y="277" width="124" height="14" rx="5"/>
+    <rect x="70" y="329" width="84" height="14" rx="5"/>
+  </g>
+
+  <!-- Top header -->
+  <rect x="240" width="960" height="80" fill="#ffffff"/>
+  <line x1="240" y1="80" x2="1200" y2="80" stroke="#e2e8f0" stroke-width="2"/>
+  <rect x="276" y="30" width="220" height="20" rx="7" fill="#0f172a"/>
+  <rect x="980" y="26" width="150" height="28" rx="14" fill="#f1f5f9"/>
+  <circle cx="1150" cy="40" r="18" fill="url(#wr-accent)"/>
+
+  <!-- Stat cards -->
+  <g>
+    <rect x="276" y="116" width="280" height="120" rx="16" fill="#ffffff" stroke="#e2e8f0" stroke-width="2"/>
+    <rect x="300" y="140" width="100" height="12" rx="5" fill="#94a3b8"/>
+    <text x="300" y="196" font-family="Plus Jakarta Sans, Segoe UI, sans-serif" font-size="44" font-weight="700" fill="#0f172a">20+</text>
+    <rect x="476" y="160" width="56" height="56" rx="14" fill="#ecfeff"/>
+    <rect x="492" y="180" width="24" height="16" rx="4" fill="#0891b2"/>
+  </g>
+  <g>
+    <rect x="588" y="116" width="280" height="120" rx="16" fill="#ffffff" stroke="#e2e8f0" stroke-width="2"/>
+    <rect x="612" y="140" width="120" height="12" rx="5" fill="#94a3b8"/>
+    <text x="612" y="196" font-family="Plus Jakarta Sans, Segoe UI, sans-serif" font-size="44" font-weight="700" fill="#0f172a">11</text>
+    <rect x="788" y="160" width="56" height="56" rx="14" fill="#fffbeb"/>
+    <rect x="804" y="180" width="24" height="16" rx="4" fill="#f59e0b"/>
+  </g>
+  <g>
+    <rect x="900" y="116" width="280" height="120" rx="16" fill="#ffffff" stroke="#e2e8f0" stroke-width="2"/>
+    <rect x="924" y="140" width="140" height="12" rx="5" fill="#94a3b8"/>
+    <text x="924" y="196" font-family="Plus Jakarta Sans, Segoe UI, sans-serif" font-size="44" font-weight="700" fill="#0f172a">50,000+</text>
+    <rect x="1100" y="160" width="56" height="56" rx="14" fill="#ecfeff"/>
+    <rect x="1116" y="180" width="24" height="16" rx="4" fill="#0891b2"/>
+  </g>
+
+  <!-- Chart card -->
+  <rect x="276" y="268" width="556" height="416" rx="16" fill="#ffffff" stroke="#e2e8f0" stroke-width="2"/>
+  <rect x="300" y="296" width="160" height="16" rx="6" fill="#0f172a"/>
+  <rect x="300" y="324" width="100" height="12" rx="5" fill="#94a3b8"/>
+  <!-- Area line -->
+  <path d="M300 560 L370 520 L440 540 L510 470 L580 500 L650 430 L720 450 L808 380"
+        fill="none" stroke="url(#wr-bar)" stroke-width="5" stroke-linecap="round" stroke-linejoin="round"/>
+  <path d="M300 560 L370 520 L440 540 L510 470 L580 500 L650 430 L720 450 L808 380 L808 650 L300 650 Z"
+        fill="url(#wr-area)"/>
+  <g fill="#0891b2">
+    <circle cx="370" cy="520" r="6"/>
+    <circle cx="510" cy="470" r="6"/>
+    <circle cx="650" cy="430" r="6"/>
+    <circle cx="808" cy="380" r="6"/>
+  </g>
+  <line x1="300" y1="650" x2="808" y2="650" stroke="#e2e8f0" stroke-width="2"/>
+
+  <!-- Activity / table card -->
+  <rect x="860" y="268" width="320" height="416" rx="16" fill="#ffffff" stroke="#e2e8f0" stroke-width="2"/>
+  <rect x="884" y="296" width="150" height="16" rx="6" fill="#0f172a"/>
+  <g>
+    <circle cx="900" cy="356" r="12" fill="#ecfeff"/>
+    <rect x="924" y="344" width="180" height="12" rx="5" fill="#334155"/>
+    <rect x="924" y="364" width="110" height="10" rx="5" fill="#94a3b8"/>
+  </g>
+  <g>
+    <circle cx="900" cy="412" r="12" fill="#fffbeb"/>
+    <rect x="924" y="400" width="160" height="12" rx="5" fill="#334155"/>
+    <rect x="924" y="420" width="130" height="10" rx="5" fill="#94a3b8"/>
+  </g>
+  <g>
+    <circle cx="900" cy="468" r="12" fill="#ecfeff"/>
+    <rect x="924" y="456" width="190" height="12" rx="5" fill="#334155"/>
+    <rect x="924" y="476" width="96" height="10" rx="5" fill="#94a3b8"/>
+  </g>
+  <g>
+    <circle cx="900" cy="524" r="12" fill="#fffbeb"/>
+    <rect x="924" y="512" width="150" height="12" rx="5" fill="#334155"/>
+    <rect x="924" y="532" width="120" height="10" rx="5" fill="#94a3b8"/>
+  </g>
+  <rect x="884" y="600" width="272" height="48" rx="12" fill="url(#wr-accent)"/>
+  <rect x="980" y="617" width="80" height="14" rx="6" fill="#ffffff"/>
+</svg>