Uploaded image for project: 'Planet4'
  1. Planet4
  2. PLANET-4913

Spreadsheet block: Fix size and add scrolling

XMLWordPrintable

    • Icon: Task Task
    • Resolution: Released
    • Icon: Should have Should have
    • 2.30.0
    • None
    • 2
    • Block: Spreadsheet
    • Sprint #129, Sprint #130, Sprint #131
    • deimos

      From UX recommendations:

      Problems:

      • When there is a lot of data in the spreadsheet, users have to scroll down the page for a long time before reaching another section of the page.
      • The spreadsheet width doesn't follow the grid width on some screens. On desktop screens, the spreadsheet width is too narrow. On mobile (portrait view), it takes the full width of the screen.

      Recommendations:

      • We should then fix the block height to avoid first issue above. If the data is longer than the fixed height, then users can scroll down within the spreadsheet.
      • For every screen, the spreadsheet should follow the grid width. We should add margins on the left & right-hand side, on mobile screens.

      Tasks

      • Set height as shown in attached designs
      • Set full width
      • Implement horizontal scrolling within table

        1. Desktop_arabic.png
          Desktop_arabic.png
          109 kB
        2. Mobile.png
          Mobile.png
          36 kB
        3. Mobile_2.png
          Mobile_2.png
          30 kB
        4. Mobile_arabic.png
          Mobile_arabic.png
          49 kB
        5. Mobile_arabic_2.png
          Mobile_arabic_2.png
          30 kB
        6. Tablet.png
          Tablet.png
          98 kB
        7. Tablet_arabic.png
          Tablet_arabic.png
          84 kB
        8. XL.png
          XL.png
          135 kB
        9. XL_arabic.png
          XL_arabic.png
          125 kB
        10. Desktop.png
          Desktop.png
          118 kB

            pvincent Pieter Vincent
            wmorrisj William Morris-Julien
            William Morris-Julien William Morris-Julien
            Votes:
            0 Vote for this issue
            Watchers:
            0 Start watching this issue

              Created:
              Updated:
              Resolved: