Merge pull request #1143 from topcoder-platform/PM-1321

PM-1321 Fix alignment issues on copilot form

Author: himaniraghav3

src/apps/copilots/src/pages/copilot-request-form/index.tsx

@@ -331,6 +331,7 @@ const CopilotRequestForm: FC<{}> = () => {
                             customRadius
                             noCaps
                             leftAlignText
+                            textWrap
                         />
                         {formErrors.complexity && (
                             <p className={styles.error}>

src/apps/copilots/src/pages/copilot-request-form/styles.module.scss

@@ -42,6 +42,29 @@ $gradient: linear-gradient(
         margin-bottom: 1rem;
     }
 
+    @media (max-width: 768px) {
+    .formRadioBtn {
+        display: grid;
+        align-items: start;
+        grid-template-columns: 1fr 1fr;
+        gap: 1rem;
+    }
+
+    .formRadioBtn > *:nth-child(2),
+    .formRadioBtn > *:nth-child(3) {
+        grid-column: 2;
+    }
+
+    .formRadioBtn > *:nth-child(1) {
+        grid-column: 1;
+        grid-row: 1 / span 2;
+    }
+
+    .formRadioBtn > *:nth-child(3) {
+        grid-row: 2;
+    }
+}
+
     .complexity {
         display: flex;
         flex-direction: column;