blsmedia/sign
2
0
Fork 0
Code Issues Packages Releases Activity

chore: updated styling of tooltips and margins

Browse Source 
Signed-off-by: Adithya Krishna <adithya@documenso.com>
This commit is contained in:
Adithya Krishna
2024-03-05 14:57:29 +05:30
parent 0c8a89a2ea
commit 691255da3f
3 changed files with 9 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
apps/marketing/src/app/(marketing)/open/monthly-new-users-chart.tsx
View File

@@ -14,7 +14,7 @@ export type MonthlyNewUsersChartProps = {
export const MonthlyNewUsersChart = ({ className, data }: MonthlyNewUsersChartProps) => { export const MonthlyNewUsersChart = ({ className, data }: MonthlyNewUsersChartProps) => {
const formattedData = [...data].reverse().map(({ month, count }) => { const formattedData = [...data].reverse().map(({ month, count }) => {
return { return {
month: DateTime.fromFormat(month, 'yyyy-MM').toFormat('LLL'), month: DateTime.fromFormat(month, 'yyyy-MM').toFormat('LLLL'),
count: Number(count), count: Number(count),
}; };
}); });
@@ -32,6 +32,9 @@ export const MonthlyNewUsersChart = ({ className, data }: MonthlyNewUsersChartPr
<YAxis /> <YAxis />
<Tooltip <Tooltip
labelStyle={{
color: 'hsl(var(--primary-foreground))',
}}
formatter={(value) => [Number(value).toLocaleString('en-US'), 'New Users']} formatter={(value) => [Number(value).toLocaleString('en-US'), 'New Users']}
cursor={{ fill: 'hsl(var(--primary) / 10%)' }} cursor={{ fill: 'hsl(var(--primary) / 10%)' }}
/> />

5
apps/marketing/src/app/(marketing)/open/monthly-total-users-chart.tsx
View File

@@ -14,7 +14,7 @@ export type MonthlyTotalUsersChartProps = {
export const MonthlyTotalUsersChart = ({ className, data }: MonthlyTotalUsersChartProps) => { export const MonthlyTotalUsersChart = ({ className, data }: MonthlyTotalUsersChartProps) => {
const formattedData = [...data].reverse().map(({ month, cume_count: count }) => { const formattedData = [...data].reverse().map(({ month, cume_count: count }) => {
return { return {
month: DateTime.fromFormat(month, 'yyyy-MM').toFormat('LLL'), month: DateTime.fromFormat(month, 'yyyy-MM').toFormat('LLLL'),
count: Number(count), count: Number(count),
}; };
}); });
@@ -32,6 +32,9 @@ export const MonthlyTotalUsersChart = ({ className, data }: MonthlyTotalUsersCha
<YAxis /> <YAxis />
<Tooltip <Tooltip
labelStyle={{
color: 'hsl(var(--primary-foreground))',
}}
formatter={(value) => [Number(value).toLocaleString('en-US'), 'Total Users']} formatter={(value) => [Number(value).toLocaleString('en-US'), 'Total Users']}
cursor={{ fill: 'hsl(var(--primary) / 10%)' }} cursor={{ fill: 'hsl(var(--primary) / 10%)' }}
/> />

2
apps/marketing/src/app/(marketing)/open/typefully.tsx
View File

@@ -22,7 +22,7 @@ export const Typefully = ({ className, ...props }: TypefullyProps) => {
<div className={cn('flex flex-col', className)} {...props}> <div className={cn('flex flex-col', className)} {...props}>
<h3 className="px-4 text-lg font-semibold">Twitter Stats</h3> <h3 className="px-4 text-lg font-semibold">Twitter Stats</h3>
<div className="border-border mt-2.5 flex flex-1 items-center justify-center rounded-2xl border shadow-sm hover:shadow"> <div className="border-border mt-2.5 flex flex-1 items-center justify-center rounded-2xl border py-8 shadow-sm hover:shadow">
{!isSSR && ( {!isSSR && (
<div className="flex flex-col gap-y-4 text-center"> <div className="flex flex-col gap-y-4 text-center">
<Image className="opacity-75" src={Twitter} alt="Twitter Logo" width={120} /> <Image className="opacity-75" src={Twitter} alt="Twitter Logo" width={120} />