Uploaded image for project: 'Moodle'
  1. Moodle
  2. MDL-79987

Improving the course layout one section per page

XMLWordPrintable

    • MOODLE_404_STABLE
    • MOODLE_404_STABLE
    • MDL-79987-master
    • Hide

      Setup

      1. Login as admin.
      2. Create a course with several activities or restore the one attached to this issue (backup-moodle2-activity_examples.mbz). If you prefer to create a course, you'll also need to:
        1. Go to Course settings and, in Course format, select "Show one section per page" for the "Course layout" parameter.
        2. Highlight one of the sections.
        3. Ad, at least, one empty section.
      3. Enroll a student to the course.
      4. Install some LTR language, such as Arabic (ar).

       

      Testing instructions 1

      1. Go to the main course page.
      2. For each section, check that:
        • Activities displays the total of activities included.
        • Progress is displayed when any of the activities has completion enabled.
        • An icon is displayed near the Activities and Progress strings.
        • An arrow is displayed aligned to the opposite side where the section name appears.
      3. For the highlighted section check that a line is displayed between the Activities/Progress and the activities.
      4. Confirm the arrow icon opens the expected section.
      5. Turn edit mode on and confirm that the arrow icon is not displayed.
      6. Login as a student and repeat the previous steps to confirm it works as expected too.
      7. Switch to any LTR language.
      8. Check again the previous points. Confirm that a left arrow appears (instead of a right arrow).
      9. Switch to the classic theme and repeat the previous steps, to confirm it works as expected too.

       

      Testing instructions 2

      1. Run 

        grunt componentlibrary

      2. Login as admin
      3. Go to Site administration > Development > UI Component library
      4. Search for the icons page and load it (admin/tool/componentlibrary/docspage.php/moodle/components/moodle-icons)
      5. Check that the i/activities icon is displayed in the "List of mapped Font Awesome icons" section.
      Show
      Setup Login as admin. Create a course with several activities or restore the one attached to this issue ( backup-moodle2-activity_examples.mbz ). If you prefer to create a course, you'll also need to: Go to Course settings and, in Course format, select "Show one section per page" for the "Course layout" parameter. Highlight one of the sections. Ad, at least, one empty section. Enroll a student to the course. Install some LTR language, such as Arabic (ar).   Testing instructions 1 Go to the main course page. For each section, check that: Activities displays the total of activities included. Progress is displayed when any of the activities has completion enabled. An icon is displayed near the Activities and Progress strings. An arrow is displayed aligned to the opposite side where the section name appears. For the highlighted section check that a line is displayed between the Activities/Progress and the activities. Confirm the arrow icon opens the expected section. Turn edit mode on and confirm that the arrow icon is not displayed. Login as a student and repeat the previous steps to confirm it works as expected too. Switch to any LTR language. Check again the previous points. Confirm that a left arrow appears (instead of a right arrow). Switch to the classic theme and repeat the previous steps, to confirm it works as expected too.   Testing instructions 2 Run  grunt componentlibrary Login as admin Go to Site administration > Development > UI Component library Search for the icons page and load it (admin/tool/componentlibrary/docspage.php/moodle/components/moodle-icons) Check that the i/activities icon is displayed in the "List of mapped Font Awesome icons" section.
    • 2
    • HQ 2023 Sprint I4.1 Moppies

      Starting now, every course format will have the option to show a single section. By default, sections will still be collapsible on the course page. However, if you choose the "one section per page" setting, the course page will display differently.

      This issue is about implementing the special styling of one section per page.

      Here is a screenshot of the prototype with annotations:

      Some comments agreed with the UX team:

      • Empty sections should always display "Activities: 0".
      • The file-edit FA icon will be used for the Activities (instead of the custom broken-square-plus.svg that appears in the attached screenshot).
      • For LTR languages, a left arrow should be displayed (instead of right).
      • The place where the badges are displayed in the prototype (Highlighted, Hidden from students...) can be ignored.

        1. backup-moodle2-activity_examples.mbz
          7.65 MB
        2. MDL-79987-1.png
          MDL-79987-1.png
          1.40 MB
        3. MDL-79987-2.png
          MDL-79987-2.png
          279 kB
        4. newfileediticon.png
          newfileediticon.png
          56 kB
        5. onesectionperpage_courselayout.png
          onesectionperpage_courselayout.png
          70 kB

            sarjona Sara Arjona (@sarjona)
            tusefomal Ferran Recio
            Mikel Martín Corrales Mikel Martín Corrales
            Amaia Anabitarte Amaia Anabitarte
            Ron Carl Alfon Yu Ron Carl Alfon Yu
            Votes:
            0 Vote for this issue
            Watchers:
            11 Start watching this issue

              Created:
              Updated:
              Resolved:

                Estimated:
                Original Estimate - Not Specified
                Not Specified
                Remaining:
                Remaining Estimate - 0 minutes
                0m
                Logged:
                Time Spent - 1 day, 5 hours, 56 minutes
                1d 5h 56m

                  Error rendering 'clockify-timesheets-time-tracking-reports:timer-sidebar'. Please contact your Jira administrators.