From 105c6e4a4d432b2c5d1804fe9edebbb3fcb08a21 Mon Sep 17 00:00:00 2001
From: latin-panda <66472237+latin-panda@users.noreply.github.com>
Date: Wed, 29 Jan 2025 15:49:52 -0600
Subject: [PATCH] Fixes style for disabled buttons and formats code style

---
 packages/scenario/src/answer/RankValuesAnswer.ts     |  1 -
 packages/scenario/src/jr/Scenario.ts                 | 11 ++++++++---
 packages/scenario/test/rank.test.ts                  | 12 ++----------
 .../src/components/controls/RankControl.vue          |  6 +++++-
 4 files changed, 15 insertions(+), 15 deletions(-)

diff --git a/packages/scenario/src/answer/RankValuesAnswer.ts b/packages/scenario/src/answer/RankValuesAnswer.ts
index cf63b067..1b6d34a6 100644
--- a/packages/scenario/src/answer/RankValuesAnswer.ts
+++ b/packages/scenario/src/answer/RankValuesAnswer.ts
@@ -7,7 +7,6 @@ import { ComparableAnswer } from './ComparableAnswer.ts';
  * as part of a test's "act" phase.
  */
 export class RankValuesAnswer extends ComparableAnswer {
-
 	readonly stringValue: string;
 
 	constructor(readonly values: readonly string[]) {
diff --git a/packages/scenario/src/jr/Scenario.ts b/packages/scenario/src/jr/Scenario.ts
index e4db6e1f..9b07d61c 100644
--- a/packages/scenario/src/jr/Scenario.ts
+++ b/packages/scenario/src/jr/Scenario.ts
@@ -122,7 +122,9 @@ type AnswerParameters =
 	| readonly [reference: string, value: unknown]
 	| readonly [value: unknown];
 
-const isAnswerItemCollectionParams = (args: AnswerParameters): args is AnswerItemCollectionParameters => {
+const isAnswerItemCollectionParams = (
+	args: AnswerParameters
+): args is AnswerItemCollectionParameters => {
 	return args.length > 2 && args.every((arg) => typeof arg === 'string');
 };
 
@@ -380,7 +382,10 @@ export class Scenario {
 		return this.setNonTerminalEventPosition(() => index, reference);
 	}
 
-	private answerItemCollectionQuestion(reference: string, ...selectionValues: string[]): ValueNodeAnswer {
+	private answerItemCollectionQuestion(
+		reference: string,
+		...selectionValues: string[]
+	): ValueNodeAnswer {
 		const event = this.setPositionalStateToReference(reference);
 		const isSelect = isQuestionEventOfType(event, 'select');
 		const isRank = isQuestionEventOfType(event, 'rank');
@@ -391,7 +396,7 @@ export class Scenario {
 			);
 		}
 
-		if(isRank) {
+		if (isRank) {
 			return event.answerQuestion(new RankValuesAnswer(selectionValues));
 		}
 
diff --git a/packages/scenario/test/rank.test.ts b/packages/scenario/test/rank.test.ts
index acf96801..ad0bb438 100644
--- a/packages/scenario/test/rank.test.ts
+++ b/packages/scenario/test/rank.test.ts
@@ -32,12 +32,7 @@ describe('Rank', () => {
 					)
 				)
 			),
-			body(
-				rank(
-					'/data/rankQuestion',
-					"instance('options')/root/item"
-				)
-			)
+			body(rank('/data/rankQuestion', "instance('options')/root/item"))
 		);
 	};
 
@@ -59,10 +54,7 @@ describe('Rank', () => {
 				)
 			),
 			body(
-				selectDynamic(
-					'/data/selectQuestion',
-					"instance('options')/root/item"
-				),
+				selectDynamic('/data/selectQuestion', "instance('options')/root/item"),
 
 				rank(
 					'/data/rankQuestion',
diff --git a/packages/web-forms/src/components/controls/RankControl.vue b/packages/web-forms/src/components/controls/RankControl.vue
index bfe86925..263a4013 100644
--- a/packages/web-forms/src/components/controls/RankControl.vue
+++ b/packages/web-forms/src/components/controls/RankControl.vue
@@ -237,7 +237,11 @@ const swapItems = (index: number, newPosition: number) => {
 	}
 
 	button:disabled {
-		background: var(--surface-200);
+		background: var(--surface-100);
+		border: none;
+		svg path {
+			fill: var(--surface-300);
+		}
 	}
 }