mirror of
https://github.com/CompassConnections/Compass.git
synced 2026-05-09 07:34:55 -04:00
Adjust spacing, colors, and text formatting in Compatibility Questions display for improved visual consistency
This commit is contained in:
@@ -453,7 +453,7 @@ export function CompatibilityAnswerBlock(props: {
|
||||
<Col
|
||||
data-testid="profile-compatibility-section"
|
||||
className={
|
||||
'bg-canvas-50 border border-canvas-200 flex-grow gap-4 whitespace-pre-line rounded-xl p-4 leading-relaxed'
|
||||
'bg-canvas-50 border border-canvas-200 flex-grow gap-2 whitespace-pre-line rounded-xl p-4 leading-relaxed'
|
||||
}
|
||||
>
|
||||
<Row
|
||||
@@ -535,14 +535,14 @@ export function CompatibilityAnswerBlock(props: {
|
||||
</Row>
|
||||
{answerText && (
|
||||
<Row
|
||||
className="bg-canvas-100 w-fit gap-1 rounded-xl px-2 py-1 text-sm"
|
||||
className="bg-canvas-200 w-fit gap-1 rounded-xl px-2 py-1 text-sm"
|
||||
data-testid="profile-compatibility-question-answer"
|
||||
>
|
||||
{answerText}
|
||||
</Row>
|
||||
)}
|
||||
<Row className="px-2 -mt-4" data-testid="profile-compatibility-question-answer-explanation">
|
||||
{answer?.explanation && <Linkify className="" text={answer.explanation} />}
|
||||
<Row className="px-2" data-testid="profile-compatibility-question-answer-explanation">
|
||||
{answer?.explanation && <Linkify className="" text={`"${answer.explanation}"`} />}
|
||||
</Row>
|
||||
{distinctPreferredAnswersText.length > 0 && (
|
||||
<Col className="gap-2">
|
||||
@@ -556,7 +556,7 @@ export function CompatibilityAnswerBlock(props: {
|
||||
data-testid="profile-compatibility-question-acceptable-answer"
|
||||
>
|
||||
{distinctPreferredAnswersText.map((text) => (
|
||||
<Row key={text} className="bg-canvas-100 w-fit gap-1 rounded-xl px-2 py-1 text-sm">
|
||||
<Row key={text} className="bg-canvas-200 w-fit gap-1 rounded-xl px-2 py-1 text-sm">
|
||||
{text}
|
||||
</Row>
|
||||
))}
|
||||
|
||||
Reference in New Issue
Block a user