diff --git a/apps/dashboard/src/components/counter.tsx b/apps/dashboard/src/components/counter.tsx
index 00c644e395..3635583e90 100644
--- a/apps/dashboard/src/components/counter.tsx
+++ b/apps/dashboard/src/components/counter.tsx
@@ -2,10 +2,7 @@
import { useEffect, useRef, useState } from "react";
-const CONFIG = {
- min: 0,
- max: 20000,
-};
+const max = 20000;
const Character = ({ className, key, value }) => {
return (
@@ -23,7 +20,7 @@ const Character = ({ className, key, value }) => {
const InnerCounter = ({ currency, pad, value, locale }) => {
const padCount = pad
- ? CONFIG.max.toFixed(2).toString().length - value.toString().length
+ ? max.toFixed(2).toString().length - value.toString().length
: 0;
const paddedValue = value
@@ -88,6 +85,12 @@ export function Counter({
const hasRunned = useRef(false);
const [value, setValue] = useState(initalValue - lastPeriodAmount);
+ useEffect(() => {
+ if (value !== initalValue) {
+ setValue(initalValue);
+ }
+ }, [initalValue]);
+
useEffect(() => {
if (!hasRunned.current) {
setValue((prev) => prev + lastPeriodAmount);
@@ -97,8 +100,8 @@ export function Counter({
return (
<>
-
-
+
+
>
);
}
diff --git a/apps/dashboard/src/styles/globals.css b/apps/dashboard/src/styles/globals.css
index 5e5919d719..c2efc5558d 100644
--- a/apps/dashboard/src/styles/globals.css
+++ b/apps/dashboard/src/styles/globals.css
@@ -13,6 +13,53 @@ body {
:root {
--sidebar-width: 662px;
+
+ /* Counter */
+ --transition: 1;
+ --line: hsl(0 0% 95% / 0.25);
+ --basic: ease;
+ --back:
+ linear( 0, -0.0077 5.2%, -0.0452 16.98%, -0.0493 22.35%, -0.0418 25.57%,
+ -0.0258 28.57%, -0.0007 31.42%, 0.0335 34.15%, 0.1242 39.03%, 0.2505 43.65%,
+ 0.3844 47.35%, 0.656 53.68%, 0.81 58.37%, 0.9282 63.52%, 0.9719 66.23%,
+ 1.0055 69.04%, 1.0255 71.4%, 1.0396 73.87%, 1.0477 76.48%, 1.05 79.27%,
+ 1.0419 84.36%, 1.0059 95.49%, 1 );
+ --expo:
+ linear( 0, 0.0053 17.18%, 0.0195 26.59%, 0.0326 30.31%, 0.0506 33.48%,
+ 0.0744 36.25%, 0.1046 38.71%, 0.1798 42.62%, 0.2846 45.93%, 0.3991 48.37%,
+ 0.6358 52.29%, 0.765 55.45%, 0.8622 59.3%, 0.8986 61.51%, 0.9279 63.97%,
+ 0.9481 66.34%, 0.9641 69.01%, 0.9856 75.57%, 0.9957 84.37%, 1 );
+ --sine:
+ linear( 0, 0.007 5.35%, 0.0282 10.75%, 0.0638 16.26%, 0.1144 21.96%,
+ 0.1833 28.16%, 0.2717 34.9%, 0.6868 62.19%, 0.775 68.54%, 0.8457 74.3%,
+ 0.9141 81.07%, 0.9621 87.52%, 0.9905 93.8%, 1 );
+ --power:
+ linear( 0, 0.0012 14.95%, 0.0089 22.36%, 0.0297 28.43%, 0.0668 33.43%,
+ 0.0979 36.08%, 0.1363 38.55%, 0.2373 43.07%, 0.3675 47.01%, 0.5984 52.15%,
+ 0.7121 55.23%, 0.8192 59.21%, 0.898 63.62%, 0.9297 66.23%, 0.9546 69.06%,
+ 0.9733 72.17%, 0.9864 75.67%, 0.9982 83.73%, 1 );
+ --circ:
+ linear( -0, 0.0033 5.75%, 0.0132 11.43%, 0.0296 16.95%, 0.0522 22.25%,
+ 0.0808 27.25%, 0.1149 31.89%, 0.1542 36.11%, 0.1981 39.85%, 0.2779 44.79%,
+ 0.3654 48.15%, 0.4422 49.66%, 0.5807 50.66%, 0.6769 53.24%, 0.7253 55.37%,
+ 0.7714 58.01%, 0.8142 61.11%, 0.8536 64.65%, 0.9158 72.23%, 0.9619 80.87%,
+ 0.9904 90.25%, 1 );
+ --bounce:
+ linear( 0, 0.0039, 0.0157, 0.0352, 0.0625 9.09%,
+ 0.1407, 0.25, 0.3908, 0.5625, 0.7654,
+ 1, 0.8907, 0.8125 45.45%, 0.7852, 0.7657,
+ 0.7539, 0.75, 0.7539, 0.7657, 0.7852,
+ 0.8125 63.64%, 0.8905, 1 72.73%, 0.9727, 0.9532,
+ 0.9414, 0.9375, 0.9414, 0.9531, 0.9726,
+ 1, 0.9883, 0.9844, 0.9883, 1 );
+ --elastic:
+ linear( 0, 0.0009 8.51%, -0.0047 19.22%, 0.0016 22.39%, 0.023 27.81%,
+ 0.0237 30.08%, 0.0144 31.81%, -0.0051 33.48%, -0.1116 39.25%, -0.1181 40.59%,
+ -0.1058 41.79%, -0.0455, 0.0701 45.34%, 0.9702 55.19%, 1.0696 56.97%,
+ 1.0987 57.88%, 1.1146 58.82%, 1.1181 59.83%, 1.1092 60.95%, 1.0057 66.48%,
+ 0.986 68.14%, 0.9765 69.84%, 0.9769 72.16%, 0.9984 77.61%, 1.0047 80.79%,
+ 0.9991 91.48%, 1 );
+ --ease: var(--back);
}
.skeleton-box {
@@ -92,54 +139,6 @@ body {
100% { transform: translateX(0rem); }
}
-:root {
- --transition: 1;
- --line: hsl(0 0% 95% / 0.25);
- --basic: ease;
- --back:
- linear( 0, -0.0077 5.2%, -0.0452 16.98%, -0.0493 22.35%, -0.0418 25.57%,
- -0.0258 28.57%, -0.0007 31.42%, 0.0335 34.15%, 0.1242 39.03%, 0.2505 43.65%,
- 0.3844 47.35%, 0.656 53.68%, 0.81 58.37%, 0.9282 63.52%, 0.9719 66.23%,
- 1.0055 69.04%, 1.0255 71.4%, 1.0396 73.87%, 1.0477 76.48%, 1.05 79.27%,
- 1.0419 84.36%, 1.0059 95.49%, 1 );
- --expo:
- linear( 0, 0.0053 17.18%, 0.0195 26.59%, 0.0326 30.31%, 0.0506 33.48%,
- 0.0744 36.25%, 0.1046 38.71%, 0.1798 42.62%, 0.2846 45.93%, 0.3991 48.37%,
- 0.6358 52.29%, 0.765 55.45%, 0.8622 59.3%, 0.8986 61.51%, 0.9279 63.97%,
- 0.9481 66.34%, 0.9641 69.01%, 0.9856 75.57%, 0.9957 84.37%, 1 );
- --sine:
- linear( 0, 0.007 5.35%, 0.0282 10.75%, 0.0638 16.26%, 0.1144 21.96%,
- 0.1833 28.16%, 0.2717 34.9%, 0.6868 62.19%, 0.775 68.54%, 0.8457 74.3%,
- 0.9141 81.07%, 0.9621 87.52%, 0.9905 93.8%, 1 );
- --power:
- linear( 0, 0.0012 14.95%, 0.0089 22.36%, 0.0297 28.43%, 0.0668 33.43%,
- 0.0979 36.08%, 0.1363 38.55%, 0.2373 43.07%, 0.3675 47.01%, 0.5984 52.15%,
- 0.7121 55.23%, 0.8192 59.21%, 0.898 63.62%, 0.9297 66.23%, 0.9546 69.06%,
- 0.9733 72.17%, 0.9864 75.67%, 0.9982 83.73%, 1 );
- --circ:
- linear( -0, 0.0033 5.75%, 0.0132 11.43%, 0.0296 16.95%, 0.0522 22.25%,
- 0.0808 27.25%, 0.1149 31.89%, 0.1542 36.11%, 0.1981 39.85%, 0.2779 44.79%,
- 0.3654 48.15%, 0.4422 49.66%, 0.5807 50.66%, 0.6769 53.24%, 0.7253 55.37%,
- 0.7714 58.01%, 0.8142 61.11%, 0.8536 64.65%, 0.9158 72.23%, 0.9619 80.87%,
- 0.9904 90.25%, 1 );
- --bounce:
- linear( 0, 0.0039, 0.0157, 0.0352, 0.0625 9.09%,
- 0.1407, 0.25, 0.3908, 0.5625, 0.7654,
- 1, 0.8907, 0.8125 45.45%, 0.7852, 0.7657,
- 0.7539, 0.75, 0.7539, 0.7657, 0.7852,
- 0.8125 63.64%, 0.8905, 1 72.73%, 0.9727, 0.9532,
- 0.9414, 0.9375, 0.9414, 0.9531, 0.9726,
- 1, 0.9883, 0.9844, 0.9883, 1 );
- --elastic:
- linear( 0, 0.0009 8.51%, -0.0047 19.22%, 0.0016 22.39%, 0.023 27.81%,
- 0.0237 30.08%, 0.0144 31.81%, -0.0051 33.48%, -0.1116 39.25%, -0.1181 40.59%,
- -0.1058 41.79%, -0.0455, 0.0701 45.34%, 0.9702 55.19%, 1.0696 56.97%,
- 1.0987 57.88%, 1.1146 58.82%, 1.1181 59.83%, 1.1092 60.95%, 1.0057 66.48%,
- 0.986 68.14%, 0.9765 69.84%, 0.9769 72.16%, 0.9984 77.61%, 1.0047 80.79%,
- 0.9991 91.48%, 1 );
- --ease: var(--back);
-}
-
.counter h2 {
transform-style: flat;
}
@@ -181,30 +180,25 @@ body {
font-variant: tabular-nums;
font-size: var(--font-size);
overflow: hidden;
- mask: linear-gradient(transparent, white calc(1lh * var(--mask-size)) calc(100% - (1lh * var(--mask-size))), transparent);
+ mask: linear-gradient(transparent, hsl(var(--background)) calc(1lh * var(--mask-size)) calc(100% - (1lh * var(--mask-size))), transparent);
transform-style: flat;
}
.character__track span {
height: 1lh;
- font-weight: 120;
transform-style: flat;
}
.character,
.character__track span {
/* background: linear-gradient(hsl(0 0% 98%) 50%, hsl(0 0% 45%)); */
- background-color: white;
+ background-color: hsl(var(--foreground));
background-attachment: fixed;
background-clip: text;
color: transparent;
transform-style: flat;
}
-.character {
- font-weight: 20;
-}
-
.character__track {
display: grid;
translate: 0 calc((var(--v) + 1) * (var(--line-height) * -1));
@@ -232,7 +226,6 @@ body {
.fraction {
font-size: calc(var(--font-size) * 0.75);
opacity: 0.75;
- font-weight: 40;
height: var(--line-height);
}
@@ -258,9 +251,6 @@ body {
position: absolute;
bottom: 0%;
left: 0%;
- font-family: "Geist Sans", sans-serif;
- font-weight: 120;
-
background: linear-gradient(hsl(0 0% 98%) 50%, hsl(0 0% 45%));
background-attachment: fixed;
background-clip: text;
@@ -309,9 +299,11 @@ body {
.counter:last-of-type .character__track span {
transition: opacity 0.5s;
}
+
.counter:last-of-type [data-value]::after {
transition: opacity 0.5s;
}
+
.counter:last-of-type legend {
transition: color 0.5s 1s;
}
diff --git a/bun.lockb b/bun.lockb
index d3513c697a..63d53870e6 100755
Binary files a/bun.lockb and b/bun.lockb differ
diff --git a/packages/supabase/package.json b/packages/supabase/package.json
index 73b16e5f51..da37c0c3b2 100644
--- a/packages/supabase/package.json
+++ b/packages/supabase/package.json
@@ -12,7 +12,7 @@
},
"dependencies": {
"@supabase/ssr": "^0.0.10",
- "@supabase/supabase-js": "^2.39.0",
+ "@supabase/supabase-js": "^2.39.1",
"supabase": "^1.123.4"
},
"devDependencies": {