Device

    It is avaialable as a property of Framework7 class (Framework7.device) and same property on initialized app instance (app.device):

    Device Related Classes

    Also this Device detecting library adds additional classes on <html> element which can help you with different CSS styles for different OS and platforms.

    1. <html class="ios device-ios device-ios-7 device-ios-7-1 device-ios-gt-6 device-pixel-ratio-1">

    If you open app with iOS 7.1 device with retina screen and your app running in full screen mode:

    If you open app on iPhone X and your app running in full screen mode:

    1. <html class="device-ios device-iphone-x device-ios-11 device-ios-11-0 device-ios-gt-6 device-ios-gt-7 device-ios-gt-8 device-ios-gt-9 device-ios-gt-10 device-retina device-pixel-ratio-3 with-statusbar">

    In other words classes calculated by the following rule:

    1. device-[os]
    2. device-[os major version]
    3. device-[os full version]
    4. [device-desktop]
    5. [device-retina]
    6. [device-desktop]
    7. [device-macos] - if desktop macOS device
    8. [device-windows] - if desktop windows device
    9. device-pixel-ratio-[pixel ratio]

    Note that “greater than” (ios-gt-6: for all iOS greater than iOS 6) classes available only for iOS