projects/hypixel-stats
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Updated general progress

Browse Source
This commit is contained in:
Taken
2025-09-17 15:39:30 +02:00
parent 48f4b24c81
commit f0346fce4e
1 changed files with 27 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

48
src/app/(stats)/player/[ign]/_components/GenericProgress.tsx
View File

@@ -27,12 +27,14 @@ type GenericProgressNoTooltipProps = {
export function GenericProgressNoTooltip({ text, percent, className }: GenericProgressNoTooltipProps) {
return (
<div className="flex flex-1">
<div
className={cn("h-5 rounded-l-md flex items-center justify-center", percent >= 100 ? "rounded-r-md" : undefined, className)}
style={{ width: `${percent > 100 ? 100 : percent}%` }}
>
{text}
</div>
{percent > 0 && (
<div
className={cn("h-5 rounded-l-md flex items-center justify-center", percent >= 100 ? "rounded-r-md" : undefined, className)}
style={{ width: `${percent > 100 ? 100 : percent}%` }}
>
{text}
</div>
)}
{percent < 100 && (
<div
className={cn("flex-1 h-5 rounded-r-md bg-background", percent === 0 ? "rounded-l-md" : undefined)}
@@ -69,15 +71,17 @@ export function GenericProgress({ percent, tooltipId, tooltipContent, className,
data-tooltip-content={tooltipContent}
className="flex flex-1"
>
<div
data-id={tooltipId}
className={cn("h-5 rounded-l-md", percent >= 100 ? "rounded-r-md" : undefined, className)}
style={{
width: `${percent > 100 ? 100 : percent}%`,
background: "repeating-linear-gradient(to right,#f55,#fa0,#ff5,#5f5,#5ff,#f5f,#a0a,#f55 16rem)"
}}
>
</div>
{percent > 0 && (
<div
data-id={tooltipId}
className={cn("h-5 rounded-l-md", percent >= 100 ? "rounded-r-md" : undefined, className)}
style={{
width: `${percent > 100 ? 100 : percent}%`,
background: "repeating-linear-gradient(to right,#f55,#fa0,#ff5,#5f5,#5ff,#f5f,#a0a,#f55 16rem)"
}}
>
</div>
)}
{percent < 100 && (
<div
data-id={tooltipId}
@@ -98,12 +102,14 @@ export function GenericProgress({ percent, tooltipId, tooltipContent, className,
data-tooltip-content={tooltipContent}
className="flex flex-1"
>
<div
data-id={tooltipId}
className={cn("h-5 rounded-l-md", percent >= 100 ? "rounded-r-md" : undefined, className)}
style={{ width: `${percent > 100 ? 100 : percent}%` }}
>
</div>
{percent > 0 && (
<div
data-id={tooltipId}
className={cn("h-5 rounded-l-md", percent >= 100 ? "rounded-r-md" : undefined, className)}
style={{ width: `${percent > 100 ? 100 : percent}%` }}
>
</div>
)}
{percent < 100 && (
<div
data-id={tooltipId}