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

Main container width of Boost pages

    XMLWordPrintable

    Details

    • Type: Task
    • Status: Waiting for integration review
    • Priority: Blocker
    • Resolution: Unresolved
    • Affects Version/s: 4.0
    • Fix Version/s: Must fix for 4.0
    • Component/s: Themes
    • Labels:
    • Affected Branches:
      MOODLE_400_STABLE
    • Pull Master Branch:
      MDL-72095-master-3
    • Testing Instructions:
      Hide

      Setup for testing

      1. Login as admin
      2. Create a new course based on the attached "all activities" backup and enrol yourself
      3. Create a few additional courses (at least 5) and enrol yourself
      4. Navigate to the site home and click edit settings for the cog menu
      5. In field "Front page items when logged in" configure"
      • list of courses
      • list fo categories
      1. Save changes and return to the site home

      Home page width

      1. Verify the home page width is never bigger than 800px wide
      2. On the homepage add the "logged in user" block
      3. Verify you see the drawer toggle and verify you can open the drawer and see the "Logged in user" block

      Categories page width

      1. On the front page click a category in Course categories
      2. on the category page verify the home page width is never bigger than 800px wide

      Profile page width

      1. Navigate to your profile page
      2. Verify the maximum page width is 800px wide

      Test the activity pages

      1. Navigate to the all activities page
      2. Verify the page widths match the table below:
      3. Please not if an activity subpage contains a html table it is okay to go full width, for example the choice responses page.

      Dashboard blocks width for boost

      1. Navigate to your dashboard
      2. Resize the browser from 1400px wide to 500px wide
      3. Scroll down and observe the course overview block
      4. Verify the number of course cards is 3 in one row at sizes up to 840px
      5. Verify the number of course cards is 2 in one row at sizes up to 576px
      6. Verify the number of course cards is 1 in one row at sizes below 576px

      Tests for theme classic

      Dashboard blocks width for classic

      1. Change your theme to the classic theme
      2. Navigate to your dashboard
      3. Make sure the dash dashboard has a 3 column layout
      4. Scroll down and observe the course overview block
      5. Resize the browser from 1400px wide to 500px wide
      6. Verify the number of course cards is 4 in one row at sizes up to 1360px
      7. Verify the number of course cards is 3 in one row at sizes up to 1200px
      8. Verify the number of course cards is 2 in one row at sizes up to 992px
      9. Verify the number of course cards is 1 in one row at sizes below 992px

      Dashboard blocks width for classic with one block area

      1. Turn editing on in the dashboard and move all left blocks to the right column
      2. Turn editing off again
      3. Repeat the steps from the previous test and verify the brackpoints are the same

      Dashboard blocks width for classic with no block area

      1. Turn editing on in the dashboard and move all blocks to the centre column
      2. Turn editing off again
      3. Scroll down and observe the course overview block
      4. Verify the number of course cards is 5 in one row at sizes up to 1360px
      5. Verify the number of course cards is 4 in one row at sizes up to 1200px
      6. Verify the number of course cards is 3 in one row at sizes up to 992px
      7. Verify the number of course cards is 2 in one row at sizes up to 576px
      8. Verify the number of course cards is 1 in one row at sizes below 576px
      Show
      Setup for testing Login as admin Create a new course based on the attached "all activities" backup and enrol yourself Create a few additional courses (at least 5) and enrol yourself Navigate to the site home and click edit settings for the cog menu In field "Front page items when logged in" configure" list of courses list fo categories Save changes and return to the site home Home page width Verify the home page width is never bigger than 800px wide On the homepage add the "logged in user" block Verify you see the drawer toggle and verify you can open the drawer and see the "Logged in user" block Categories page width On the front page click a category in Course categories on the category page verify the home page width is never bigger than 800px wide Profile page width Navigate to your profile page Verify the maximum page width is 800px wide Test the activity pages Navigate to the all activities page Verify the page widths match the table below: Please not if an activity subpage contains a html table it is okay to go full width, for example the choice responses page. Dashboard blocks width for boost Navigate to your dashboard Resize the browser from 1400px wide to 500px wide Scroll down and observe the course overview block Verify the number of course cards is 3 in one row at sizes up to 840px Verify the number of course cards is 2 in one row at sizes up to 576px Verify the number of course cards is 1 in one row at sizes below 576px Tests for theme classic Dashboard blocks width for classic Change your theme to the classic theme Navigate to your dashboard Make sure the dash dashboard has a 3 column layout Scroll down and observe the course overview block Resize the browser from 1400px wide to 500px wide Verify the number of course cards is 4 in one row at sizes up to 1360px Verify the number of course cards is 3 in one row at sizes up to 1200px Verify the number of course cards is 2 in one row at sizes up to 992px Verify the number of course cards is 1 in one row at sizes below 992px Dashboard blocks width for classic with one block area Turn editing on in the dashboard and move all left blocks to the right column Turn editing off again Repeat the steps from the previous test and verify the brackpoints are the same Dashboard blocks width for classic with no block area Turn editing on in the dashboard and move all blocks to the centre column Turn editing off again Scroll down and observe the course overview block Verify the number of course cards is 5 in one row at sizes up to 1360px Verify the number of course cards is 4 in one row at sizes up to 1200px Verify the number of course cards is 3 in one row at sizes up to 992px Verify the number of course cards is 2 in one row at sizes up to 576px Verify the number of course cards is 1 in one row at sizes below 576px

      Description

      With the introduction of the drawers layout, the course content now has a fixed width. If possible other pages should have the same width.

      Plugin pages need to have a way of choosing between a full page width or a fixed width.

      EDIT: must-fix for 4.0 to meet UX designs

        Attachments

        1. verticall.png
          verticall.png
          670 kB
        2. scroll on scorm.png
          scroll on scorm.png
          1.21 MB
        3. pagewidths.png
          pagewidths.png
          159 kB
        4. horizontal.png
          horizontal.png
          713 kB
        5. forum-discussion.png
          forum-discussion.png
          810 kB
        6. all-activities.mbz
          1.68 MB

          Issue Links

            Activity

              People

              Assignee:
              basbrands Bas Brands
              Reporter:
              basbrands Bas Brands
              Peer reviewer:
              Huong Nguyen Huong Nguyen
              Participants:
              Component watchers:
              Huong Nguyen, Bas Brands, Mathew May
              Votes:
              1 Vote for this issue
              Watchers:
              10 Start watching this issue

                Dates

                Created:
                Updated:
                Fix Release Date:
                13/Dec/21

                  Time Tracking

                  Estimated:
                  Original Estimate - 0 minutes
                  0m
                  Remaining:
                  Remaining Estimate - 0 minutes
                  0m
                  Logged:
                  Time Spent - 4 days, 2 minutes
                  4d 2m