From fff0b804ada67733f9855fd65331addce5ebf9aa Mon Sep 17 00:00:00 2001
From: milad-emami <milad.emami1025@gmail.com>
Date: Wed, 20 Nov 2024 13:25:44 +0330
Subject: [PATCH] fix: prevent radio criterion shrinking and improve alignment

- Add flexShrink: 0 style to prevent radio button compression
- Add align-items-center class for better vertical alignment
---
 .../CriterionContainer/RadioCriterion.jsx     |  3 +-
 .../RadioCriterion.test.jsx.snap              | 42 ++++++++++++++++---
 2 files changed, 38 insertions(+), 7 deletions(-)

diff --git a/src/containers/CriterionContainer/RadioCriterion.jsx b/src/containers/CriterionContainer/RadioCriterion.jsx
index 7d9f733a..7b5d67f2 100644
--- a/src/containers/CriterionContainer/RadioCriterion.jsx
+++ b/src/containers/CriterionContainer/RadioCriterion.jsx
@@ -36,12 +36,13 @@ export class RadioCriterion extends React.Component {
       <Form.RadioSet name={config.name} value={data}>
         {config.options.map((option) => (
           <Form.Radio
-            className="criteria-option"
+            className="criteria-option align-items-center"
             key={option.name}
             value={option.name}
             description={intl.formatMessage(messages.optionPoints, { points: option.points })}
             onChange={this.onChange}
             disabled={!isGrading}
+            style={{ flexShrink: 0 }}
           >
             {option.label}
           </Form.Radio>
diff --git a/src/containers/CriterionContainer/__snapshots__/RadioCriterion.test.jsx.snap b/src/containers/CriterionContainer/__snapshots__/RadioCriterion.test.jsx.snap
index 5b2b3a41..de94cdbd 100644
--- a/src/containers/CriterionContainer/__snapshots__/RadioCriterion.test.jsx.snap
+++ b/src/containers/CriterionContainer/__snapshots__/RadioCriterion.test.jsx.snap
@@ -6,21 +6,31 @@ exports[`Radio Criterion Container snapshot is grading 1`] = `
   value="selected radio option"
 >
   <Form.Radio
-    className="criteria-option"
+    className="criteria-option align-items-center"
     description="1 points"
     disabled={false}
     key="option name"
     onChange={[Function]}
+    style={
+      {
+        "flexShrink": 0,
+      }
+    }
     value="option name"
   >
     this label
   </Form.Radio>
   <Form.Radio
-    className="criteria-option"
+    className="criteria-option align-items-center"
     description="2 points"
     disabled={false}
     key="option name 2"
     onChange={[Function]}
+    style={
+      {
+        "flexShrink": 0,
+      }
+    }
     value="option name 2"
   >
     this label 2
@@ -34,21 +44,31 @@ exports[`Radio Criterion Container snapshot is not grading 1`] = `
   value="selected radio option"
 >
   <Form.Radio
-    className="criteria-option"
+    className="criteria-option align-items-center"
     description="1 points"
     disabled={true}
     key="option name"
     onChange={[Function]}
+    style={
+      {
+        "flexShrink": 0,
+      }
+    }
     value="option name"
   >
     this label
   </Form.Radio>
   <Form.Radio
-    className="criteria-option"
+    className="criteria-option align-items-center"
     description="2 points"
     disabled={true}
     key="option name 2"
     onChange={[Function]}
+    style={
+      {
+        "flexShrink": 0,
+      }
+    }
     value="option name 2"
   >
     this label 2
@@ -62,21 +82,31 @@ exports[`Radio Criterion Container snapshot radio contain invalid response 1`] =
   value="selected radio option"
 >
   <Form.Radio
-    className="criteria-option"
+    className="criteria-option align-items-center"
     description="1 points"
     disabled={false}
     key="option name"
     onChange={[Function]}
+    style={
+      {
+        "flexShrink": 0,
+      }
+    }
     value="option name"
   >
     this label
   </Form.Radio>
   <Form.Radio
-    className="criteria-option"
+    className="criteria-option align-items-center"
     description="2 points"
     disabled={false}
     key="option name 2"
     onChange={[Function]}
+    style={
+      {
+        "flexShrink": 0,
+      }
+    }
     value="option name 2"
   >
     this label 2