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

Fix layout issues on the course overview block

    XMLWordPrintable

    Details

    • Type: Bug
    • Status: Closed
    • Priority: Minor
    • Resolution: Fixed
    • Affects Version/s: 3.6
    • Fix Version/s: 3.6
    • Component/s: Blocks, Course
    • Labels:
    • Testing Instructions:
      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  
    • Affected Branches:
      MOODLE_36_STABLE
    • Fixed Branches:
      MOODLE_36_STABLE
    • Pull from Repository:
    • Pull Master Branch:
      MDL-63675-master

      Description

      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"

        Attachments

        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

          Issue Links

            Activity

              People

              • Votes:
                0 Vote for this issue
                Watchers:
                7 Start watching this issue

                Dates

                • Created:
                  Updated:
                  Resolved:
                  Fix Release Date:
                  3/Dec/18

                  Time Tracking

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