From 2c82e1a2624c8b7600955b2505ae4ab8abdc3395 Mon Sep 17 00:00:00 2001 From: "oleksandr.buhaienko" Date: Wed, 1 Nov 2023 14:32:28 +0200 Subject: [PATCH 1/4] feat: course about page markup and styles improvements --- .../sass/multicourse/_course_about.scss | 24 +++++++++++++++++++ lms/templates/courseware/course_about.html | 14 ++++++----- 2 files changed, 32 insertions(+), 6 deletions(-) diff --git a/lms/static/sass/multicourse/_course_about.scss b/lms/static/sass/multicourse/_course_about.scss index 629b3065778e..a8a34ccec589 100644 --- a/lms/static/sass/multicourse/_course_about.scss +++ b/lms/static/sass/multicourse/_course_about.scss @@ -44,6 +44,11 @@ > div.table { display: table; width: 100%; + + @include media-breakpoint-down(sm) { + display: flex; + flex-direction: column; + } } .intro { @@ -51,6 +56,11 @@ @include clearfix(); + @include media-breakpoint-down(sm) { + width: auto; + order: 2; + } + display: table-cell; vertical-align: middle; padding: $baseline; @@ -127,6 +137,10 @@ a.add-to-cart { @include button(shiny, $button-color); + @include media-breakpoint-down(md) { + width: 100%; + } + box-sizing: border-box; border-radius: 3px; display: block; @@ -189,6 +203,11 @@ @include float(left); @include margin(1px, flex-gutter(8), 0, 0); @include transition(none); + @include media-breakpoint-down(md) { + width: 100%; + margin-right: 0; + margin-bottom: 10px; + } width: flex-grid(5, 8); } @@ -213,6 +232,11 @@ width: flex-grid(4); z-index: 2; + @include media-breakpoint-down(sm) { + width: auto; + order: 1; + } + .hero { border: 1px solid $border-color-3; height: 100%; diff --git a/lms/templates/courseware/course_about.html b/lms/templates/courseware/course_about.html index 91d7a2a28e57..2a0108c33444 100644 --- a/lms/templates/courseware/course_about.html +++ b/lms/templates/courseware/course_about.html @@ -62,11 +62,10 @@
-

- ${course.display_name_with_default} -

-
+

${course.display_name_with_default}

${course.display_org_with_default} +
+

${get_course_about_section(request, course, 'short_description')}

@@ -219,7 +218,6 @@

${_("Prerequisites")}

## Multiple pre-requisite courses are not supported on frontend that's why we are pulling first element - ${pre_requisite_courses[0]['display']}

${Text(_("You must successfully complete {link_start}{prc_display}{link_end} before you begin this course.")).format( link_start=HTML('').format(prc_target), @@ -231,7 +229,11 @@

% endif % if get_course_about_section(request, course, "prerequisites"): -

  • ${_("Requirements")}

    ${get_course_about_section(request, course, "prerequisites")}
    • +
  • + +

    ${_("Requirements")}

    + ${get_course_about_section(request, course, "prerequisites")} +
    • % endif From da3ccf71b165e234ecc34197326ed3e47ea62774 Mon Sep 17 00:00:00 2001 From: Eugene Dyudyunov Date: Thu, 23 Nov 2023 14:19:57 +0200 Subject: [PATCH 2/4] test: update tests according to changes --- lms/djangoapps/courseware/tests/test_about.py | 10 ++++++++-- lms/templates/courseware/course_about.html | 1 - 2 files changed, 8 insertions(+), 3 deletions(-) diff --git a/lms/djangoapps/courseware/tests/test_about.py b/lms/djangoapps/courseware/tests/test_about.py index d53d620d3e34..bd0c1854ab76 100644 --- a/lms/djangoapps/courseware/tests/test_about.py +++ b/lms/djangoapps/courseware/tests/test_about.py @@ -156,7 +156,10 @@ def test_pre_requisite_course(self): assert resp.status_code == 200 pre_requisite_courses = get_prerequisite_courses_display(course) pre_requisite_course_about_url = reverse('about_course', args=[str(pre_requisite_courses[0]['key'])]) - assert '    {}'.format(pre_requisite_course_about_url, pre_requisite_courses[0]['display']) in resp.content.decode(resp.charset).strip('\n') # pylint: disable=line-too-long + assert ( + f'You must successfully complete ' + f'{pre_requisite_courses[0]["display"]} before you begin this course.' + ) in resp.content.decode(resp.charset).strip('\n') @patch.dict(settings.FEATURES, {'ENABLE_PREREQUISITE_COURSES': True}) def test_about_page_unfulfilled_prereqs(self): @@ -190,7 +193,10 @@ def test_about_page_unfulfilled_prereqs(self): assert resp.status_code == 200 pre_requisite_courses = get_prerequisite_courses_display(course) pre_requisite_course_about_url = reverse('about_course', args=[str(pre_requisite_courses[0]['key'])]) - assert '{}'.format(pre_requisite_course_about_url, pre_requisite_courses[0]['display']) in resp.content.decode(resp.charset).strip('\n') # pylint: disable=line-too-long + assert ( + f'You must successfully complete ' + f'{pre_requisite_courses[0]["display"]} before you begin this course.' + ) in resp.content.decode(resp.charset).strip('\n') url = reverse('about_course', args=[str(pre_requisite_course.id)]) resp = self.client.get(url) diff --git a/lms/templates/courseware/course_about.html b/lms/templates/courseware/course_about.html index 2a0108c33444..7afee9c83766 100644 --- a/lms/templates/courseware/course_about.html +++ b/lms/templates/courseware/course_about.html @@ -217,7 +217,6 @@

    ${course.display_name_with_default}

  • ${_("Prerequisites")}

    - ## Multiple pre-requisite courses are not supported on frontend that's why we are pulling first element

    ${Text(_("You must successfully complete {link_start}{prc_display}{link_end} before you begin this course.")).format( link_start=HTML('').format(prc_target), From 2038ca70fc3226d7e75c72ee18407a1d76ee42d0 Mon Sep 17 00:00:00 2001 From: ihor-romaniuk Date: Thu, 18 Apr 2024 17:29:12 +0200 Subject: [PATCH 3/4] fix: relocate course organization and return removed prerequisites info --- lms/templates/courseware/course_about.html | 14 ++++++++++++-- 1 file changed, 12 insertions(+), 2 deletions(-) diff --git a/lms/templates/courseware/course_about.html b/lms/templates/courseware/course_about.html index 7afee9c83766..880d4cea3c0d 100644 --- a/lms/templates/courseware/course_about.html +++ b/lms/templates/courseware/course_about.html @@ -63,7 +63,6 @@

    ${course.display_name_with_default}

    - ${course.display_org_with_default}

    ${get_course_about_section(request, course, 'short_description')}

    @@ -159,7 +158,16 @@

    ${course.display_name_with_default}

    <%block name="course_about_important_dates">
      -

    1. ${_("Course Number")}

      ${course.display_number_with_default}
      2. +
    2. + +

      ${_("Organization")}

      + ${course.display_org_with_default} +
      3. +
    3. + +

      ${_("Course Number")}

      + ${course.display_number_with_default} +
      4. % if not course.start_date_is_still_default: <% course_start_date = course.advertised_start or course.start @@ -217,6 +225,8 @@

      ${course.display_name_with_default}

    4. ${_("Prerequisites")}

      + ## Multiple pre-requisite courses are not supported on frontend that's why we are pulling first element +       ${pre_requisite_courses[0]['display']}

      ${Text(_("You must successfully complete {link_start}{prc_display}{link_end} before you begin this course.")).format( link_start=HTML('').format(prc_target), From 53f2ec219751cfd99c63c0393e9abef3e6116751 Mon Sep 17 00:00:00 2001 From: ihor-romaniuk Date: Thu, 23 May 2024 10:30:14 +0200 Subject: [PATCH 4/4] fix: display org info above the course title --- lms/templates/courseware/course_about.html | 6 +----- 1 file changed, 1 insertion(+), 5 deletions(-) diff --git a/lms/templates/courseware/course_about.html b/lms/templates/courseware/course_about.html index 880d4cea3c0d..eec9caeadbec 100644 --- a/lms/templates/courseware/course_about.html +++ b/lms/templates/courseware/course_about.html @@ -62,6 +62,7 @@

      +

      ${course.display_org_with_default}

      ${course.display_name_with_default}


      ${get_course_about_section(request, course, 'short_description')}

      @@ -158,11 +159,6 @@

      ${course.display_name_with_default}

      <%block name="course_about_important_dates">
        -
      1. - -

        ${_("Organization")}

        - ${course.display_org_with_default} -

      2. ${_("Course Number")}