diff --git a/src/components/KnightsAndKnavesI.tsx b/src/components/KnightsAndKnavesI.tsx index e7e5153..e5ee579 100644 --- a/src/components/KnightsAndKnavesI.tsx +++ b/src/components/KnightsAndKnavesI.tsx @@ -5,6 +5,7 @@ import { cn } from "@/lib/utils"; // Statements const STATEMENTS = [ { id: "S", label: "At least one of us is a knave." }, + { id: "SNEG", label: "Both of us are knights." }, { id: "AK", label: "A is a knight" }, { id: "AN", label: "A is a knave" }, { id: "BK", label: "B is a knight" }, @@ -13,6 +14,15 @@ const STATEMENTS = [ type StatementId = typeof STATEMENTS[number]["id"]; +const META: Record = { + S: { group: "S", neg: false }, + SNEG: { group: "S", neg: true }, + AK: { group: "A", neg: false }, + AN: { group: "A", neg: true }, + BK: { group: "B", neg: false }, + BN: { group: "B", neg: true }, +}; + const KnightsAndKnavesI = () => { const [inArena, setInArena] = useState([]); const [showExplain, setShowExplain] = useState(false); @@ -80,6 +90,7 @@ const KnightsAndKnavesI = () => { if (ids.has("AN") && aKnight) continue; if (ids.has("BK") && !bKnight) continue; if (ids.has("BN") && bKnight) continue; + if (ids.has("SNEG") && !(aKnight && bKnight)) continue; // A's utterance if included: S = "At least one is a knave" if (ids.has("S")) { diff --git a/src/index.css b/src/index.css index 056d54d..4be0dbb 100644 --- a/src/index.css +++ b/src/index.css @@ -41,6 +41,11 @@ All colors MUST be HSL. --success: 142 71% 45%; --success-foreground: 0 0% 98%; + /* Logic token colors */ + --logic-a: 24 94% 50%; + --logic-b: 221 83% 53%; + --logic-s: 47 95% 57%; + /* Custom design tokens for the boxy aesthetic */ --surface: 0 0% 100%; --surface-variant: 220 13% 96%; @@ -107,6 +112,11 @@ All colors MUST be HSL. --success: 142 71% 45%; --success-foreground: 0 0% 98%; + /* Logic token colors */ + --logic-a: 24 94% 50%; + --logic-b: 221 83% 53%; + --logic-s: 47 95% 57%; + /* Dark mode custom tokens */ --surface: 220 13% 11%; --surface-variant: 220 13% 15%; @@ -141,6 +151,15 @@ All colors MUST be HSL. } } +@layer components { + .logic-a { --logic-color: var(--logic-a); } + .logic-b { --logic-color: var(--logic-b); } + .logic-s { --logic-color: var(--logic-s); } + .logic-border { border-color: hsl(var(--logic-color)) !important; } + .logic-dotted { border-style: dotted; } + .logic-solid { border-style: solid; } +} + /* Custom slider styling */ .slider-special::-webkit-slider-thumb, .slider-normal::-webkit-slider-thumb {