diff --git a/apps/color-buddy/src/lib/utils.ts b/apps/color-buddy/src/lib/utils.ts index 06b6e01..b8c2cfb 100644 --- a/apps/color-buddy/src/lib/utils.ts +++ b/apps/color-buddy/src/lib/utils.ts @@ -408,11 +408,6 @@ export const screenSpaceAvg = (colors: { x: number; y: number }[]) => { return { x: xAvg, y: yAvg }; }; -export const checkLevelToSymbol = { - error: "❌", - warning: "⚠️", -} as any; - export const titleCase = (str: string) => str .split(" ") diff --git a/apps/color-buddy/src/linting/EvalColorColumn.svelte b/apps/color-buddy/src/linting/EvalColorColumn.svelte index 8630568..c2d09d1 100644 --- a/apps/color-buddy/src/linting/EvalColorColumn.svelte +++ b/apps/color-buddy/src/linting/EvalColorColumn.svelte @@ -9,7 +9,7 @@ import lintStore from "../stores/lint-store"; import EvalResponse from "./EvalResponse.svelte"; - import { checkLevelToSymbol, dealWithFocusEvent } from "../lib/utils"; + import { dealWithFocusEvent } from "../lib/utils"; import { buttonStyle } from "../lib/styles"; $: checks = $lintStore.currentChecks; @@ -42,6 +42,17 @@ $configStore.evalDeltaDisplay === "none" ? [] : computeDeltas(colors, $configStore.evalDeltaDisplay); + + const checkLevelToSymbol = { + error: "❌", + warning: "⚠️", + } as any; + const typeToSymbol = { + design: "🎨", + accessibility: "♿", + usability: "🔎", + custom: "⚙️", + } as any; @@ -92,17 +103,22 @@ {colorNames[idx]} {/if} - - {#each colorsToIssues[idx] as check} - {#if !evalConfig[check.lintProgram.name]?.ignore} - - {/if} - {/each} - +
+ {#if colorsToIssues[idx].length} + Issues + {/if} + + {#each colorsToIssues[idx] as check} + {#if !evalConfig[check.lintProgram.name]?.ignore} + + {/if} + {/each} + +