tweaking epc labels

This commit is contained in:
Khalim Conn-Kowlessar 2026-04-13 15:52:22 +00:00
parent 052928a5dd
commit e0f1859f58
2 changed files with 16 additions and 4 deletions

View file

@ -61,12 +61,10 @@ function Pill({
EPC letter bubble
------------------------------------------------------------------------ */
const EpcLetterBubble = ({ letter }: { letter: string }) => {
if (!letter) return <div className="w-6 h-6" />;
if (!letter) return <div className="w-5 h-5" />;
return (
<div
className={`inline-flex items-center justify-center w-6 h-6 rounded-full ${getEpcColorClass(
letter
)} text-white text-m font-bold shadow-outline-black`}
className={`inline-flex items-center justify-center w-5 h-5 rounded-full text-xs font-bold text-white ${getEpcColorClass(letter)}`}
>
{letter}
</div>

View file

@ -67,6 +67,20 @@ export const getEpcColorClass = (letter: string) => {
}
};
/** Border + text colour classes for a transparent-background EPC badge */
export const getEpcAccentClasses = (letter: string) => {
switch (letter.toUpperCase()) {
case "A": return "border-epc_a text-epc_a";
case "B": return "border-epc_b text-epc_b";
case "C": return "border-epc_c text-epc_c";
case "D": return "border-epc_d text-epc_d";
case "E": return "border-epc_e text-epc_e";
case "F": return "border-epc_f text-epc_f";
case "G": return "border-epc_g text-epc_g";
default: return "border-slate-300 text-slate-400";
}
};
export const getRating = (rating: number | null): Rating => {
if (rating == null) {
return "N/A";