quasar/dist/api/Screen.json

Build high-performance VueJS user interfaces (SPA, PWA, SSR, Mobile and Desktop) in record time

{"type":"plugin","meta":{"docsUrl":"https://v2.quasar.dev/options/screen-plugin"},"injection":"$q.screen","quasarConfOptions":{"propName":"screen","type":"Object","definition":{"bodyClasses":{"type":"Boolean","desc":"Whether to apply CSS classes for the current window breakpoint to the body element"}}},"props":{"width":{"type":"Number","desc":"Screen width (in pixels)","reactive":true,"examples":["452"]},"height":{"type":"Number","desc":"Screen height (in pixels)","reactive":true,"examples":["721"]},"name":{"type":"String","desc":"Tells current window breakpoint","values":["'xs'","'sm'","'md'","'lg'","'xl'"],"reactive":true},"sizes":{"type":"Object","desc":"Breakpoints (in pixels)","definition":{"sm":{"type":"Number","desc":"Breakpoint width size (minimum size)"},"md":{"type":"Number","desc":"Breakpoint width size (minimum size)"},"lg":{"type":"Number","desc":"Breakpoint width size (minimum size)"},"xl":{"type":"Number","desc":"Breakpoint width size (minimum size)"}},"reactive":true,"examples":["{ sm: 600, md: 1024, lg: 1440, xl: 1920 }"]},"lt":{"type":"Object","desc":"Tells if current screen width is lower than breakpoint-name","reactive":true,"definition":{"sm":{"type":"Boolean","desc":"Is current screen width lower than this breakpoint's lowest limit?"},"md":{"type":"Boolean","desc":"Is current screen width lower than this breakpoint's lowest limit?"},"lg":{"type":"Boolean","desc":"Is current screen width lower than this breakpoint's lowest limit?"},"xl":{"type":"Boolean","desc":"Is current screen width lower than this breakpoint's lowest limit?"}},"examples":["{ sm: false, md: true, lg: true, xl: true }"]},"gt":{"type":"Object","desc":"Tells if current screen width is greater than breakpoint-name","reactive":true,"definition":{"xs":{"type":"Boolean","desc":"Is current screen width greater than this breakpoint's max limit?"},"sm":{"type":"Boolean","desc":"Is current screen width greater than this breakpoint's max limit?"},"md":{"type":"Boolean","desc":"Is current screen width greater than this breakpoint's max limit?"},"lg":{"type":"Boolean","desc":"Is current screen width greater than this breakpoint's max limit?"}},"examples":["{ xs: true, sm: true, md: false, lg: false, xl: false }"]},"xs":{"type":"Boolean","desc":"Current screen width fits exactly 'xs' breakpoint","reactive":true},"sm":{"type":"Boolean","desc":"Current screen width fits exactly 'sm' breakpoint","reactive":true},"md":{"type":"Boolean","desc":"Current screen width fits exactly 'md' breakpoint","reactive":true},"lg":{"type":"Boolean","desc":"Current screen width fits exactly 'lg' breakpoint","reactive":true},"xl":{"type":"Boolean","desc":"Current screen width fits exactly 'xl' breakpoint","reactive":true}},"methods":{"setSizes":{"desc":"Override default breakpoint sizes","params":{"breakpoints":{"type":"Object","desc":"Pick what you want to override","definition":{"sm":{"type":"Number","desc":"Breakpoint width size (minimum size)"},"md":{"type":"Number","desc":"Breakpoint width size (minimum size)"},"lg":{"type":"Number","desc":"Breakpoint width size (minimum size)"},"xl":{"type":"Number","desc":"Breakpoint width size (minimum size)"}},"required":true}},"returns":null},"setDebounce":{"desc":"Debounce update of all props when screen width/height changes","params":{"amount":{"type":"Number","desc":"Amount in milliseconds","required":true}},"returns":null}}}