diff --git a/client/src/components/infoview/main.tsx b/client/src/components/infoview/main.tsx index 4d829d7..1160f87 100644 --- a/client/src/components/infoview/main.tsx +++ b/client/src/components/infoview/main.tsx @@ -261,13 +261,13 @@ function Command({ command, deleteProof }: { command: string, deleteProof: any } // }, fastIsEqual) /** The tabs of goals that lean ahs after the command of this step has been processed */ -function GoalsTab({ proofStep }: { proofStep: ProofStep }) { +function GoalsTab({ proofStep, last}: { proofStep: ProofStep, last : boolean }) { const [selectedGoal, setSelectedGoal] = React.useState(0) if (!proofStep.goals.length) { return <> } return
-
+
{proofStep.goals.map((goal, i) => ( // TODO: Should not use index as key.
{ setSelectedGoal(i); ev.stopPropagation() }}> @@ -409,6 +409,8 @@ export function CommandLineInterface(props: { world: string, level: number, data return step.hints.some((hint) => hint.hidden) } + let lastStepErrors = proof.length ? hasInteractiveErrors(proof[proof.length - 1].errors) : false + return
@@ -416,7 +418,7 @@ export function CommandLineInterface(props: { world: string, level: number, data {proof.length ? <> {proof.map((step, i) => { - if (i == proof.length - 1 && hasInteractiveErrors(step.errors)) { + if (i == proof.length - 1 && lastStepErrors) { // if the last command contains an error, we only display the errors but not the // entered command as it is still present in the command line. // TODO: Should not use index as key. @@ -443,7 +445,7 @@ export function CommandLineInterface(props: { world: string, level: number, data } } - + {/* Show a message that there are no goals left */} {!step.goals.length && (
diff --git a/client/src/components/inventory.css b/client/src/components/inventory.css index 16727e4..3e02805 100644 --- a/client/src/components/inventory.css +++ b/client/src/components/inventory.css @@ -63,7 +63,12 @@ display: inline-block; } -.tab.active { +.tab-bar.current .tab.active { color: black; border-bottom: 0.3em solid var(--clr-primary); } + +.tab.active { + color: black; + border-bottom: 0.3em solid #999; +}