@remotion/promo-pages 4.0.312 → 4.0.314

package/dist/components/icons/remix.js

@@ -0,0 +1,4 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export const ReactRouterIcon = (props) => {
+    return (_jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: "800px", height: "800px", viewBox: "0 -58 256 256", version: "1.1", preserveAspectRatio: "xMidYMid", ...props, children: _jsxs("g", { children: [_jsx("path", { d: "M78.0659341,92.5875806 C90.8837956,92.5875806 101.274726,82.1966508 101.274726,69.3787894 C101.274726,56.5609279 90.8837956,46.1699982 78.0659341,46.1699982 C65.2480726,46.1699982 54.8571429,56.5609279 54.8571429,69.3787894 C54.8571429,82.1966508 65.2480726,92.5875806 78.0659341,92.5875806 Z M23.2087913,139.005163 C36.0266526,139.005163 46.4175825,128.614233 46.4175825,115.796372 C46.4175825,102.97851 36.0266526,92.5875806 23.2087913,92.5875806 C10.3909298,92.5875806 0,102.97851 0,115.796372 C0,128.614233 10.3909298,139.005163 23.2087913,139.005163 Z M232.791209,139.005163 C245.60907,139.005163 256,128.614233 256,115.796372 C256,102.97851 245.60907,92.5875806 232.791209,92.5875806 C219.973347,92.5875806 209.582418,102.97851 209.582418,115.796372 C209.582418,128.614233 219.973347,139.005163 232.791209,139.005163 Z", fill: "currentcolor" }), _jsx("path", { d: "M156.565464,70.3568084 C155.823426,62.6028163 155.445577,56.1490255 149.505494,51.6131676 C141.982638,45.8687002 133.461166,49.5960243 122.964463,45.8072968 C112.650326,43.3121427 105,34.1545727 105,23.2394367 C105,10.4046502 115.577888,0 128.626373,0 C138.29063,0 146.599638,5.70747659 150.259573,13.8825477 C155.861013,24.5221258 152.220489,35.3500418 159.258242,40.8041273 C167.591489,47.2621895 178.826167,42.5329154 191.362109,48.6517412 C195.390112,50.5026944 198.799584,53.4384578 201.202056,57.0769224 C203.604528,60.7153869 205,65.0565524 205,69.7183101 C205,80.633446 197.349674,89.7910161 187.035538,92.2861702 C176.538834,96.0748977 168.017363,92.3475736 160.494506,98.092041 C152.03503,104.551712 156.563892,115.358642 149.669352,126.774447 C145.756163,134.291567 137.802119,139.43662 128.626373,139.43662 C115.577888,139.43662 105,129.03197 105,116.197184 C105,106.873668 110.581887,98.832521 118.637891,95.1306146 C131.173833,89.0117889 142.408511,93.7410629 150.741758,87.2830007 C155.549106,83.5574243 156.565464,77.8102648 156.565464,70.3568084 Z", fill: "currentcolor" })] }) }));
+};

package/dist/components/icons/skia.d.ts

@@ -0,0 +1,3 @@
+import type { SVGProps } from 'react';
+import React from 'react';
+export declare const SkiaIcon: React.FC<SVGProps<SVGSVGElement>>;

package/dist/components/icons/skia.js

@@ -0,0 +1,4 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+export const SkiaIcon = (props) => {
+    return (_jsx("svg", { ...props, xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 576 512", children: _jsx("path", { fill: "currentColor", d: "M288 400C288 461.9 237.9 512 176 512H32C14.33 512 0 497.7 0 480C0 462.3 14.33 448 32 448H36.81C54.44 448 66.4 429.1 64.59 411.6C64.2 407.8 64 403.9 64 400C64 338.1 114.1 288 176 288C178.8 288 181.5 288.1 184.3 288.3C184.1 285.7 183.1 282.1 183.1 280.3C183.1 244.6 201.1 210.1 229.1 189.1L474.3 12.25C499.7-6.279 534.9-3.526 557.2 18.74C579.4 41 582.2 76.16 563.7 101.6L386.1 345.1C365 374.9 331.4 392 295.7 392C293 392 290.3 391.9 287.7 391.7C287.9 394.5 287.1 397.2 287.1 400H288zM295.7 360C321.2 360 345.2 347.8 360.2 327.2L537.8 82.82C547.1 70.08 545.7 52.5 534.5 41.37C523.4 30.24 505.8 28.86 493.1 38.12L248.8 215.8C228.2 230.8 215.1 254.8 215.1 280.3C215.1 285.7 216.5 290.9 217.5 295.1L217.6 295.1C217.9 297.3 218.2 298.6 218.5 299.9L276.1 357.5C277.4 357.8 278.7 358.1 280 358.4L280 358.5C285.1 359.5 290.3 360 295.7 360L295.7 360zM253.5 380.1L195.9 322.5C194.5 322.2 193.2 321.8 191.9 321.6C186.7 320.5 181.4 320 176 320C131.8 320 96 355.8 96 400C96 402.8 96.14 405.6 96.43 408.3C98.15 425 93.42 441.9 83.96 455.1C74.31 468.5 58 480 36.81 480H176C220.2 480 256 444.2 256 400C256 394.6 255.5 389.3 254.4 384.1C254.2 382.8 253.9 381.5 253.5 380.1V380.1z" }) }));
+};

package/dist/components/icons/stargazer.d.ts

@@ -0,0 +1,3 @@
+import type { SVGProps } from 'react';
+import React from 'react';
+export declare const Stargazer: React.FC<SVGProps<SVGSVGElement>>;

package/dist/components/icons/stargazer.js

@@ -0,0 +1,4 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+export const Stargazer = (props) => {
+    return (_jsx("svg", { height: "1em", viewBox: "0 0 512 512", ...props, children: _jsx("path", { fill: "currentcolor", d: "M325.8 152.3c1.3 4.6 5.5 7.7 10.2 7.7s8.9-3.1 10.2-7.7L360 104l48.3-13.8c4.6-1.3 7.7-5.5 7.7-10.2s-3.1-8.9-7.7-10.2L360 56 346.2 7.7C344.9 3.1 340.7 0 336 0s-8.9 3.1-10.2 7.7L312 56 263.7 69.8c-4.6 1.3-7.7 5.5-7.7 10.2s3.1 8.9 7.7 10.2L312 104l13.8 48.3zM115.7 346.2L75.5 307l55.5-8.1c15.6-2.3 29.2-12.1 36.1-26.3l24.8-50.3 24.8 50.3c7 14.2 20.5 24 36.1 26.3l55.5 8.1-40.2 39.2c-11.3 11-16.4 26.9-13.8 42.4l9.5 55.4-49.5-26.1c-14-7.4-30.7-7.4-44.7 0L120 444l9.5-55.4c2.7-15.6-2.5-31.4-13.8-42.4zm54.7-188.8l-46.3 94L20.5 266.5C.9 269.3-7 293.5 7.2 307.4l74.9 73.2L64.5 483.9c-3.4 19.6 17.2 34.6 34.8 25.3l92.6-48.8 92.6 48.8c17.6 9.3 38.2-5.7 34.8-25.3L301.6 380.6l74.9-73.2c14.2-13.9 6.4-38.1-13.3-40.9L259.7 251.4l-46.3-94c-8.8-17.9-34.3-17.9-43.1 0zm258.4 85.8l11 38.6c1 3.6 4.4 6.2 8.2 6.2s7.1-2.5 8.2-6.2l11-38.6 38.6-11c3.6-1 6.2-4.4 6.2-8.2s-2.5-7.1-6.2-8.2l-38.6-11-11-38.6c-1-3.6-4.4-6.2-8.2-6.2s-7.1 2.5-8.2 6.2l-11 38.6-38.6 11c-3.6 1-6.2 4.4-6.2 8.2s2.5 7.1 6.2 8.2l38.6 11z" }) }));
+};

package/dist/components/icons/still.d.ts

@@ -0,0 +1,3 @@
+import type { SVGProps } from 'react';
+import React from 'react';
+export declare const StillIcon: React.FC<SVGProps<SVGSVGElement>>;

package/dist/components/icons/still.js

@@ -0,0 +1,4 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+export const StillIcon = (props) => {
+    return (_jsx("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 512 512", ...props, children: _jsx("path", { fill: "currentColor", d: "M324.9 157.8c-11.38-17.38-39.89-17.31-51.23-.0625L200.5 268.5L184.1 245.9C172.7 229.1 145.9 229.9 134.4 245.9l-64.52 89.16c-6.797 9.406-7.75 21.72-2.547 32C72.53 377.5 83.05 384 94.75 384h322.5c11.41 0 21.8-6.281 27.14-16.38c5.312-10 4.734-22.09-1.516-31.56L324.9 157.8zM95.8 352l62.39-87.38l29.91 41.34C191.2 310.2 196.4 313.2 201.4 312.6c5.25-.125 10.12-2.781 13.02-7.188l83.83-129.9L415 352H95.8zM447.1 32h-384C28.65 32-.0091 60.65-.0091 96v320c0 35.35 28.65 64 63.1 64h384c35.35 0 64-28.65 64-64V96C511.1 60.65 483.3 32 447.1 32zM480 416c0 17.64-14.36 32-32 32H64c-17.64 0-32-14.36-32-32V96c0-17.64 14.36-32 32-32h384c17.64 0 32 14.36 32 32V416zM144 192C170.5 192 192 170.5 192 144S170.5 96 144 96S96 117.5 96 144S117.5 192 144 192zM144 128c8.822 0 15.1 7.178 15.1 16S152.8 160 144 160S128 152.8 128 144S135.2 128 144 128z" }) }));
+};

package/dist/components/icons/tailwind.d.ts

@@ -0,0 +1,3 @@
+import type { SVGProps } from 'react';
+import React from 'react';
+export declare const Tailwind: React.FC<SVGProps<SVGSVGElement>>;

package/dist/components/icons/tailwind.js

@@ -0,0 +1,4 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export const Tailwind = (props) => {
+    return (_jsxs("svg", { viewBox: "0 0 51 31", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: [_jsx("path", { d: "M0 25.364C1.701 18.6 5.954 15.218 12.758 15.218C19.0815 15.218 21.9775 18.1395 24.4794 20.6634L24.48 20.664C26.015 22.213 27.403 23.613 29.344 24.096C32.746 24.941 35.723 23.673 38.275 20.291C36.574 27.055 32.321 30.436 25.517 30.436C19.1925 30.436 16.2975 27.5155 13.7956 24.9916L13.795 24.991C12.26 23.441 10.872 22.041 8.93 21.559C5.529 20.714 2.552 21.982 0 25.364Z", fill: "currentcolor" }), _jsx("path", { d: "M12 10.146C13.701 3.382 17.954 0 24.758 0C31.0815 0 33.9775 2.92151 36.4794 5.44536L36.48 5.446C38.015 6.995 39.403 8.395 41.344 8.878C44.746 9.723 47.723 8.455 50.275 5.073C48.574 11.837 44.321 15.218 37.517 15.218C31.1925 15.218 28.2975 12.2975 25.7956 9.77365L25.795 9.773C24.26 8.223 22.872 6.823 20.93 6.341C17.529 5.496 14.552 6.764 12 10.146Z", fill: "currentcolor" })] }));
+};

package/dist/components/icons/tiktok.d.ts

@@ -0,0 +1,3 @@
+import type { SVGProps } from 'react';
+import React from 'react';
+export declare const TikTok: React.FC<SVGProps<SVGSVGElement>>;

package/dist/components/icons/tiktok.js

@@ -0,0 +1,4 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+export const TikTok = (props) => {
+    return (_jsx("svg", { ...props, viewBox: "0 0 448 512", children: _jsx("path", { fill: "currentcolor", d: "M448 209.9a210.1 210.1 0 0 1 -122.8-39.3V349.4A162.6 162.6 0 1 1 185 188.3V278.2a74.6 74.6 0 1 0 52.2 71.2V0l88 0a121.2 121.2 0 0 0 1.9 22.2h0A122.2 122.2 0 0 0 381 102.4a121.4 121.4 0 0 0 67 20.1z" }) }));
+};

package/dist/components/icons/ts.d.ts

@@ -0,0 +1,3 @@
+import type { SVGProps } from 'react';
+import React from 'react';
+export declare const TypeScriptIcon: React.FC<SVGProps<SVGSVGElement>>;

package/dist/components/icons/ts.js

@@ -0,0 +1,4 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+export const TypeScriptIcon = (props) => {
+    return (_jsx("svg", { fill: "#000000", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", ...props, children: _jsx("path", { fill: "currentColor", d: "M3,5v14c0,1.105,0.895,2,2,2h14c1.105,0,2-0.895,2-2V5c0-1.105-0.895-2-2-2H5C3.895,3,3,3.895,3,5z M13.666,12.451h-2.118\tV19H9.841v-6.549H7.767V11h5.899V12.451z M13.998,18.626v-1.751c0,0,0.956,0.721,2.104,0.721c1.148,0,1.103-0.75,1.103-0.853\tc0-1.089-3.251-1.089-3.251-3.501c0-3.281,4.737-1.986,4.737-1.986l-0.059,1.559c0,0-0.794-0.53-1.692-0.53\tc-0.897,0-1.221,0.427-1.221,0.883c0,1.177,3.281,1.059,3.281,3.428C19,20.244,13.998,18.626,13.998,18.626z" }) }));
+};

package/dist/components/icons/tts.d.ts

@@ -0,0 +1,3 @@
+import type { SVGProps } from 'react';
+import React from 'react';
+export declare const TTSIcon: React.FC<SVGProps<SVGSVGElement>>;

package/dist/components/icons/tts.js

@@ -0,0 +1,4 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+export const TTSIcon = (props) => {
+    return (_jsx("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 512 512", ...props, children: _jsx("path", { fill: "currentColor", d: "M256 31.1c-141.4 0-255.1 93.13-255.1 208c0 47.62 19.91 91.25 52.91 126.3c-14.87 39.5-45.87 72.88-46.37 73.25c-6.623 7-8.373 17.25-4.623 26C5.816 474.3 14.38 480 24 480c61.49 0 109.1-25.75 139.1-46.25c28.1 9 60.16 14.25 92.9 14.25c141.4 0 255.1-93.13 255.1-207.1S397.4 31.1 256 31.1zM256 416c-28.25 0-56.24-4.25-83.24-12.75c-9.516-3.068-19.92-1.461-28.07 4.338c-22.1 16.25-58.54 35.29-102.7 39.66c11.1-15.12 29.75-40.5 40.74-69.63l.1289-.3398c4.283-11.27 1.791-23.1-6.43-32.82C47.51 313.1 32.06 277.6 32.06 240c0-97 100.5-176 223.1-176c123.5 0 223.1 79 223.1 176S379.5 416 256 416zM272 272h-128c-8.801 0-16 7.199-16 15.1C127.1 296.8 135.2 304 144 304h128c8.801 0 15.1-7.204 15.1-16C287.1 279.2 280.8 272 272 272zM368 176h-224c-8.801 0-16 7.199-16 15.1C127.1 200.8 135.2 208 144 208h224c8.801 0 15.1-7.204 15.1-16C383.1 183.2 376.8 176 368 176z" }) }));
+};

package/dist/components/icons/undo.d.ts

@@ -0,0 +1,3 @@
+import type { SVGProps } from 'react';
+import React from 'react';
+export declare const UndoIcon: React.FC<SVGProps<SVGSVGElement>>;

package/dist/components/icons/undo.js

@@ -0,0 +1,2 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+export const UndoIcon = (props) => (_jsx("svg", { viewBox: "0 0 512 512", ...props, children: _jsx("path", { fill: "currentcolor", d: "M48.5 224L40 224c-13.3 0-24-10.7-24-24L16 72c0-9.7 5.8-18.5 14.8-22.2s19.3-1.7 26.2 5.2L98.6 96.6c87.6-86.5 228.7-86.2 315.8 1c87.5 87.5 87.5 229.3 0 316.8s-229.3 87.5-316.8 0c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0c62.5 62.5 163.8 62.5 226.3 0s62.5-163.8 0-226.3c-62.2-62.2-162.7-62.5-225.3-1L185 183c6.9 6.9 8.9 17.2 5.2 26.2s-12.5 14.8-22.2 14.8L48.5 224z" }) }));

package/dist/components/icons/waveform.d.ts

@@ -0,0 +1,3 @@
+import type { SVGProps } from 'react';
+import React from 'react';
+export declare const Waveform: React.FC<SVGProps<SVGSVGElement>>;

package/dist/components/icons/waveform.js

@@ -0,0 +1,4 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+export const Waveform = (props) => {
+    return (_jsx("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 640 512", ...props, children: _jsx("path", { fill: "currentColor", d: "M224 96C215.2 96 208 103.2 208 111.1v288C208 408.8 215.2 416 223.1 416C232.8 416 240 408.8 240 400V111.1C240 103.2 232.8 96 224 96zM128 192C119.2 192 112 199.2 112 207.1V304C112 312.8 119.2 320 127.1 320S144 312.8 144 304V207.1C144 199.2 136.8 192 128 192zM32 224C23.2 224 16 231.2 16 239.1V272C16 280.8 23.2 288 31.1 288S48 280.8 48 272V239.1C48 231.2 40.8 224 32 224zM416 128C407.2 128 400 135.2 400 143.1v224C400 376.8 407.2 384 415.1 384S432 376.8 432 368V143.1C432 135.2 424.8 128 416 128zM608 224c-8.8 0-16 7.2-16 15.1V272C592 280.8 599.2 288 608 288s16-7.2 16-15.1V239.1C624 231.2 616.8 224 608 224zM512 64c-8.8 0-16 7.2-16 15.1V432C496 440.8 503.2 448 511.1 448C520.8 448 528 440.8 528 432V79.1C528 71.2 520.8 64 512 64zM320 0C311.2 0 304 7.2 304 15.1V496C304 504.8 311.2 512 319.1 512S336 504.8 336 496V15.1C336 7.2 328.8 0 320 0z" }) }));
+};

package/dist/homepage/Pricing.js

@@ -1819,7 +1819,7 @@ var CompanyPricing = () => {
             children: [
               /* @__PURE__ */ jsx4("div", {
                 className: "fontbrand font-bold text-lg",
-                children: "WebCodecs Conversion Units"
+                children: "WebCodecs Creation Units"
               }),
               /* @__PURE__ */ jsxs4("div", {
                 className: "text-muted fontbrand text-sm",
@@ -1831,7 +1831,7 @@ var CompanyPricing = () => {
                     href: "https://remotion.dev/webcodecs",
                     children: [
                       conversionsPerMonth,
-                      " client-side video conversions",
+                      " client-side video creations",
                       " "
                     ]
                   })

package/dist/main.d.ts

@@ -0,0 +1 @@
+import './index.css';

package/dist/main.js

@@ -0,0 +1,6 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { StrictMode } from 'react';
+import { createRoot } from 'react-dom/client';
+import { NewLanding } from './components/Homepage';
+import './index.css';
+createRoot(document.getElementById('root')).render(_jsx(StrictMode, { children: _jsx("div", { "data-theme": "light", children: _jsx(NewLanding, { colorMode: "light", setColorMode: () => { } }) }) }));

package/dist/tailwind.css

@@ -117,9 +117,6 @@
   .left-1\/2 {
     left: calc(1/2 * 100%);
   }
-  .left-\[50\%\] {
-    left: 50%;
-  }
   .z-0 {
     z-index: 0;
   }
@@ -213,9 +210,6 @@
   .ml-4 {
     margin-left: calc(var(--spacing) * 4);
   }
-  .ml-\[-50\%\] {
-    margin-left: -50%;
-  }
   .box-border {
     box-sizing: border-box;
   }
@@ -830,11 +824,6 @@
       left: auto;
     }
   }
-  .lg\:m-auto {
-    @media (width >= 64rem) {
-      margin: auto;
-    }
-  }
   .lg\:mx-3 {
     @media (width >= 64rem) {
       margin-inline: calc(var(--spacing) * 3);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@remotion/promo-pages",
-  "version": "4.0.312",
+  "version": "4.0.314",
   "publishConfig": {
     "access": "public"
   },
@@ -10,14 +10,14 @@
     "polished": "4.3.1",
     "zod": "3.22.3",
     "bun-plugin-tailwind": "0.0.15",
-    "@remotion/animated-emoji": "4.0.312",
-    "@remotion/paths": "4.0.312",
-    "@remotion/lambda": "4.0.312",
-    "@remotion/lottie": "4.0.312",
-    "@remotion/shapes": "4.0.312",
-    "create-video": "4.0.312",
-    "@remotion/player": "4.0.312",
-    "remotion": "4.0.312"
+    "@remotion/animated-emoji": "4.0.314",
+    "@remotion/lambda": "4.0.314",
+    "@remotion/paths": "4.0.314",
+    "@remotion/player": "4.0.314",
+    "@remotion/shapes": "4.0.314",
+    "create-video": "4.0.314",
+    "@remotion/lottie": "4.0.314",
+    "remotion": "4.0.314"
   },
   "devDependencies": {
     "@eslint/eslintrc": "3.1.0",
@@ -34,7 +34,7 @@
     "tailwind-merge": "2.5.2",
     "bun-plugin-tailwind": "0.0.13",
     "clsx": "2.1.1",
-    "@remotion/eslint-config-internal": "4.0.312"
+    "@remotion/eslint-config-internal": "4.0.314"
   },
   "repository": {
     "url": "https://github.com/remotion-dev/remotion/tree/main/packages/promo-pages"

package/src/components/homepage/BackgroundAnimation.tsx

@@ -52,7 +52,7 @@ export const BackgroundAnimation: React.FC = () => {
 	}, [css]);
 
 	return (
-		<div className=" w-full h-full left-[50%] ml-[-50%] min-w-0 lg:m-auto lg:relative lg:min-w-[700px] lg:max-w-[1200px] lg:ml-auto lg:left-auto pointer-events-none">
+		<div className=" w-full h-full min-w-0 m-auto lg:relative lg:min-w-[700px] lg:max-w-[1200px] lg:ml-auto lg:left-auto pointer-events-none">
 			<svg
 				className="translate-y-[-30%] lg:translate-y-[-50%]"
 				viewBox="0 0 1 1"

package/src/components/homepage/CommunityStatsItems.tsx

@@ -177,7 +177,7 @@ export const GitHubStars: React.FC = () => {
 					width="45px"
 				/>
 				<StatItemContent
-					content="21k"
+					content="22k"
 					width="80px"
 					fontSize="2.5rem"
 					fontWeight="bold"

package/src/components/homepage/FreePricing.tsx

@@ -239,7 +239,7 @@ export const CompanyPricing: React.FC = () => {
 			<div className={'flex flex-row items-center'}>
 				<div style={textUnitWrapper}>
 					<div className={'fontbrand font-bold text-lg'}>
-						WebCodecs Conversion Units
+						WebCodecs Creation Units
 					</div>
 					<div className={'text-muted fontbrand text-sm'}>
 						Allows for{' '}
@@ -247,7 +247,7 @@ export const CompanyPricing: React.FC = () => {
 							className="underline underline-offset-4 text-inherit"
 							href="https://remotion.dev/webcodecs"
 						>
-							{conversionsPerMonth} client-side video conversions{' '}
+							{conversionsPerMonth} client-side video creations{' '}
 						</a>
 					</div>
 				</div>

package/src/components/homepage/GitHubButton.tsx

@@ -16,7 +16,7 @@ export const GithubButton: React.FC = () => {
 		<div className="flex flex-row items-center text-base">
 			<GithubIcon /> <span>GitHub</span>{' '}
 			<div className="text-xs inline-block ml-2 leading-none mt-[3px] self-center">
-				{'21k'}
+				{'22k'}
 			</div>
 		</div>
 	);