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

Fix layout issues on the course overview block

XMLWordPrintable

    • Icon: Bug Bug
    • Resolution: Fixed
    • Icon: Minor Minor
    • 3.6
    • 3.6
    • Blocks, Course
    • MOODLE_36_STABLE
    • MOODLE_36_STABLE
    • MDL-63675-master
    • Hide

      Test these steps on theme Clean and theme Boost on Internet Explorer 11.

      1. Login as admin.
      2. Create 5 courses with different length titles.
      3. Enrol yourself in all 5 courses.
      4. Navigate to your dashboard.
      5. Resize your browser to approximately 1280px wide
      6. Verify you see 4 courses in the first row.
      7. Verify the 5th course wraps underneath.
      8. Change you theme to Clean.
      9. Verify you see 3 courses in the first row.
      10. Verify you see 2 course underneath.
      11. Resize your browser to approx 1000px wide
      12. Verify you see 2 courses in the first row, 2 courses underneath and the 5th on a new row.
      13. Change your theme to Boost
      14. Verify you see 3 courses in the first row.
      15. Verify you see 2 course underneath.

      Add the starred courses block to your dashboard for usage in the next test using any browser.

      1. Login as admin
      2. Navigate to your dashboard
      3. Click the "Customise this page" button
      4. Open the navdrawer
      5. Click the "Add a Block" button
      6. Select the Starred courses block
      7. Drag & drop the starred courses block to the centre column.

      Test these steps on a mobile device like Safari IOS or Chrome on Android.

      1. Login as admin
      2. Use data from previous test (5 enrolled courses)
      3. Navigate to dashboard
      4. Verify the course cards shown in the starred courses block have the same size as course cards shown in the myoverview block

       

      Show
      Test these steps on theme Clean and theme Boost on Internet Explorer 11. Login as admin. Create 5 courses with different length titles. Enrol yourself in all 5 courses. Navigate to your dashboard. Resize your browser to approximately 1280px wide Verify you see 4 courses in the first row. Verify the 5th course wraps underneath. Change you theme to Clean. Verify you see 3 courses in the first row. Verify  you see 2 course underneath. Resize your browser to approx 1000px wide Verify you see 2 courses in the first row, 2 courses underneath and the 5th on a new row. Change your theme to Boost Verify you see 3 courses in the first row. Verify  you see 2 course underneath. Add the starred courses block to your dashboard for usage in the next test using any browser. Login as admin Navigate to your dashboard Click the "Customise this page" button Open the navdrawer Click the "Add a Block" button Select the Starred courses block Drag & drop the starred courses block to the centre column. Test these steps on a mobile device like Safari IOS or Chrome on Android. Login as admin Use data from previous test (5 enrolled courses) Navigate to dashboard Verify  the course cards shown in the starred courses block have the same size as course cards shown in the myoverview block  

      The following issues about the improved course overview block were discovered while testing MDL-63337:

      1. On Clean, the course name's length affects how many cards per row will be shown.
      2. On IE11, the cards are stacked in such a way that they are overlapping with each other.
      3. JAWS announces "course image colon" when the keyboard's on the course image which kind of sounds odd. Probably better to either:
        1. Remove the colon (e.g. "Course image"); and/or
        2. Add the course's name (e.g. "Course 1's course image")
      4. The "Sort by" control breaks the layout on mobile browsers (e.g. mobile Safari on iPhone X), when it's set to "Last accessed"

        1. 1.PNG
          1.PNG
          197 kB
        2. 2.PNG
          2.PNG
          82 kB
        3. clean-narrow.png
          clean-narrow.png
          176 kB
        4. ie11_clean_error.png
          ie11_clean_error.png
          235 kB
        5. IE11-narrow.png
          IE11-narrow.png
          52 kB
        6. iphonex-safari.png
          iphonex-safari.png
          106 kB

            basbrands Bas Brands
            jpataleta Jun Pataleta
            Sara Arjona (@sarjona) Sara Arjona (@sarjona)
            David Monllaó David Monllaó
            Janelle Barcega Janelle Barcega
            Votes:
            0 Vote for this issue
            Watchers:
            7 Start watching this issue

              Created:
              Updated:
              Resolved:

                Estimated:
                Original Estimate - 0 minutes
                0m
                Remaining:
                Remaining Estimate - 0 minutes
                0m
                Logged:
                Time Spent - 2 hours
                2h

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