Uploaded image for project: 'Moodle app'
  1. Moodle app
  2. MOBILE-3497

Make window size checks more coherent in the app

    XMLWordPrintable

    Details

      Description

      Right now we have 3 different checks:

      1. platform.is('tablet'). We barely use it to check size, and we shouldn't because it only takes into account if the physical device is a tablet, not the screen size. So for example in desktop it says false.
      2. CSS ( hidden-tablet & hidden-phone classes). They use a media query with min-width: 768px, it doesn't check the height.
      3. JS_: window.innerWidth >= 576 && window.innerHeight >= 576_. We check both width & height to prevent changing the behaviour if the device orientation changes.

      It's a bit weird that in CSS we check a width of 768 and in JS we check a width/height of 576. Also, for JS we should have a function to check sizes based on a certain enum (e.g. "small", "medium", "large") like it's done in Bootstrap.

        Attachments

          Activity

            People

            Assignee:
            Unassigned
            Reporter:
            dpalou Dani Palou
            Participants:
            Component watchers:
            Votes:
            0 Vote for this issue
            Watchers:
            1 Start watching this issue

              Dates

              Created:
              Updated: