VKT(Frontend): PublicEnrollmentContactStepper set text field width

Opetushallitus · Dec 18, 2024 · 7eb2895 · 7eb2895
1 parent f610d26
commit 7eb2895
Show file tree

Hide file tree

Showing 3 changed files with 17 additions and 16 deletions.
diff --git a/...nd/packages/vkt/src/components/publicEnrollmentContact/steps/selectExam/ExamSelection.tsx b/...nd/packages/vkt/src/components/publicEnrollmentContact/steps/selectExam/ExamSelection.tsx
@@ -119,18 +119,19 @@ export const ExamSelection = ({
           )}
         </FormControl>
         <Collapse in={enrollment.isFullExam === false}>
-          <LabeledTextField
-            id="public-enrollment-contact__partial-exam-selection--textField"
-            label={t('selectExams.heading')}
-            placeholder={t('selectExams.description')}
-            value={enrollment.partialExamSelection || ''}
-            onBlur={handlePartialExamSelectionBlur}
-            onChange={handlePartialExamSelectionChange}
-            error={hasPartialExamSelectionError}
-            helperText={translateCommon('errors.customTextField.required')}
-            disabled={editingDisabled}
-            fullWidth
-          />
+          <div className="public-enrollment-contact__grid__textfield-container">
+            <LabeledTextField
+              id="public-enrollment-contact__partial-exam-selection--textField"
+              label={t('selectExams.heading')}
+              placeholder={t('selectExams.description')}
+              value={enrollment.partialExamSelection || ''}
+              onBlur={handlePartialExamSelectionBlur}
+              onChange={handlePartialExamSelectionChange}
+              error={hasPartialExamSelectionError}
+              helperText={translateCommon('errors.customTextField.required')}
+              disabled={editingDisabled}
+            />
+          </div>
         </Collapse>
       </div>
     </>

diff --git a/frontend/packages/vkt/src/components/publicEnrollmentContact/steps/selectExam/Message.tsx b/frontend/packages/vkt/src/components/publicEnrollmentContact/steps/selectExam/Message.tsx
@@ -87,11 +87,11 @@ export const Message = ({
       <div className="public-enrollment-contact__grid__phone-extra-margin margin-top-sm rows gapped">
         <H2>{t('title')}</H2>
       </div>
-      <div className="public-enrollment-contact__grid__phone-extra-margin public-enrollment-contact__grid__previous-enrollment rows gapped">
+      <div className="public-enrollment-contact__grid__phone-extra-margin public-enrollment-contact__grid__textfield-container rows gapped">
         <div className="margin-top-sm grow full-max-width">
           <LabeledTextField
-            className="public-enrollment-contact__grid__previous-enrollment__textField"
-            id="public-enrollment__previous-enrollment__textField"
+            className="public-enrollment-contact__grid__textfield-container__textField"
+            id="public-enrollment__message__textField"
             label={t('textField.label')}
             placeholder={t('textField.placeholder')}
             value={enrollment.message}

diff --git a/...ackages/vkt/src/styles/components/publicEnrollmentContact/_public-enrollment-contact.scss b/...ackages/vkt/src/styles/components/publicEnrollmentContact/_public-enrollment-contact.scss
@@ -73,7 +73,7 @@
       }
     }
 
-    &__previous-enrollment {
+    &__textfield-container {
       width: 70%;
 
       @include phone {