mirror of
https://github.com/Drop-OSS/drop.git
synced 2025-11-09 20:12:10 +10:00
* First iteration on the new PieChart component * #128 Adds new admin home page * Fixes code after merging conflicts * Removes empty file * Uses real data for admin home page, and improves style * Reverts debugging code * Defines missing variable * Caches user stats data for admin home page * Typo * Styles improvements * Invalidates cache on signup/signin * Implements top 5 biggest games * Improves styling * Improves style * Using generateManifest to get the proper size * Reading data from cache * Removes unnecessary import * Improves caching mechanism for game sizes * Removes lint errors * Replaces piechart tooltip with colors in legend * Fixes caching * Fixes caching and slight improvement on pie chart colours * Fixes a few bugs related to caching * Fixes bug where app signin didn't refresh cache * feat: style improvements * fix: lint --------- Co-authored-by: DecDuck <declanahofmeyr@gmail.com>
77 lines
1.3 KiB
TypeScript
77 lines
1.3 KiB
TypeScript
export const CHART_COLOURS = {
|
|
// Bar colours
|
|
red: {
|
|
fill: "fill-red-700",
|
|
bg: "bg-red-700",
|
|
},
|
|
orange: {
|
|
fill: "fill-orange-800",
|
|
bg: "bg-orange-800",
|
|
},
|
|
blue: {
|
|
fill: "fill-blue-900",
|
|
bg: "bg-blue-900",
|
|
},
|
|
|
|
// Pie colours
|
|
lightblue: {
|
|
fill: "fill-blue-400",
|
|
bg: "bg-blue-400",
|
|
},
|
|
dropblue: {
|
|
fill: "fill-blue-600",
|
|
bg: "bg-blue-600",
|
|
},
|
|
green: {
|
|
fill: "fill-green-500",
|
|
bg: "bg-green-500",
|
|
},
|
|
yellow: {
|
|
fill: "fill-yellow-800",
|
|
bg: "bg-yellow-800",
|
|
},
|
|
purple: {
|
|
fill: "fill-purple-500",
|
|
bg: "bg-purple-500",
|
|
},
|
|
zinc: {
|
|
fill: "fill-zinc-950",
|
|
bg: "bg-zinc-950",
|
|
},
|
|
pink: {
|
|
fill: "fill-pink-800",
|
|
bg: "bg-pink-800",
|
|
},
|
|
|
|
lime: {
|
|
fill: "fill-lime-600",
|
|
bg: "bg-lime-600",
|
|
},
|
|
emerald: {
|
|
fill: "fill-emerald-500",
|
|
bg: "bg-emerald-500",
|
|
},
|
|
slate: {
|
|
fill: "fill-slate-800",
|
|
bg: "bg-slate-800",
|
|
},
|
|
};
|
|
export const PIE_COLOURS: ChartColour[] = [
|
|
"lightblue",
|
|
"dropblue",
|
|
"purple",
|
|
"emerald",
|
|
];
|
|
|
|
export type ChartColour = keyof typeof CHART_COLOURS;
|
|
|
|
export function getBarColor(percentage: number): ChartColour {
|
|
if (percentage <= 70) {
|
|
return "blue";
|
|
}
|
|
if (percentage > 70 && percentage <= 90) {
|
|
return "orange";
|
|
}
|
|
return "red";
|
|
}
|