From 384a9009ef2547e4dd195325292edb407b56024d Mon Sep 17 00:00:00 2001
From: jbpenrath <jb.penrath@gmail.com>
Date: Tue, 4 Apr 2023 16:15:29 +0200
Subject: [PATCH] =?UTF-8?q?=F0=9F=92=84(frontend)=20fix=20layout=20issue?=
 =?UTF-8?q?=20on=20CourseProductItem?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

We recently rework form styles and it introduces a layout issue on
CourseProductItem.
---
 CHANGELOG.md                                                 | 4 ++++
 .../components/CourseProductCourseRuns/_styles.scss          | 5 ++---
 2 files changed, 6 insertions(+), 3 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 8d746fe239..587e13005d 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -8,6 +8,10 @@ Versioning](https://semver.org/spec/v2.0.0.html).
 
 ## [Unrealeased]
 
+### Fixed
+
+- Layout issue on enrollable course run of CourseProductItem
+
 ## [2.21.0] - 2023-03-21
 
 ### Added
diff --git a/src/frontend/js/widgets/CourseProductItem/components/CourseProductCourseRuns/_styles.scss b/src/frontend/js/widgets/CourseProductItem/components/CourseProductCourseRuns/_styles.scss
index 39498e3ad0..adcae2f602 100644
--- a/src/frontend/js/widgets/CourseProductItem/components/CourseProductCourseRuns/_styles.scss
+++ b/src/frontend/js/widgets/CourseProductItem/components/CourseProductCourseRuns/_styles.scss
@@ -60,8 +60,6 @@
     }
 
     &.form-field {
-      padding-left: 1.5rem;
-
       .form-field__radio-control {
         position: absolute;
         left: 0;
@@ -70,9 +68,10 @@
 
       .form-field__label {
         display: flex;
+        flex: 1;
         flex-direction: column;
         justify-content: space-between;
-        flex: 1;
+        padding-left: 1.5rem;
       }
     }