fix(dashboard): improved funnels visually and removed bugs
This commit is contained in:
@@ -6,16 +6,15 @@ import * as React from 'react';
|
||||
const Progress = React.forwardRef<
|
||||
React.ElementRef<typeof ProgressPrimitive.Root>,
|
||||
React.ComponentPropsWithoutRef<typeof ProgressPrimitive.Root> & {
|
||||
color: string;
|
||||
size?: 'sm' | 'default' | 'lg';
|
||||
}
|
||||
>(({ className, value, color, size = 'default', ...props }, ref) => (
|
||||
>(({ className, value, size = 'default', ...props }, ref) => (
|
||||
<ProgressPrimitive.Root
|
||||
ref={ref}
|
||||
className={cn(
|
||||
'relative h-4 w-full min-w-16 overflow-hidden rounded bg-def-200 shadow-sm',
|
||||
size === 'sm' && 'h-2',
|
||||
size === 'lg' && 'h-8',
|
||||
size === 'lg' && 'h-5',
|
||||
className,
|
||||
)}
|
||||
{...props}
|
||||
@@ -24,11 +23,14 @@ const Progress = React.forwardRef<
|
||||
className={'h-full w-full flex-1 rounded bg-primary transition-all'}
|
||||
style={{
|
||||
transform: `translateX(-${100 - (value || 0)}%)`,
|
||||
background: color,
|
||||
}}
|
||||
/>
|
||||
{value && size !== 'sm' && (
|
||||
<div className="z-5 absolute bottom-0 top-0 flex items-center px-2 text-sm font-semibold">
|
||||
<div
|
||||
className={
|
||||
'z-5 absolute bottom-0 top-0 flex items-center px-2 text-sm font-medium font-mono'
|
||||
}
|
||||
>
|
||||
<div>{round(value, 2)}%</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
Reference in New Issue
Block a user