ui-breakpoint v0.0.212

UiBreakpoint

A simple, configurable breakpoint class for any Web project.

Features ✨

• Optimized for perfomance (uses media queries).
• Works with any JavaScript project.
• Add multiple defined breakpoints eg sm, mobile, etc.

• Supports orientation.

Config ⚙

The UiBreakpoint requires a single object as an argument when initializing. The properties are listed below.

Example 💁‍♀️

const screenSizes = {
  xxs: 0,
  xs: 320,
  sm: 560,
  md: 960,
  lg: 1020,
  xl: 1920
}  

const breakpoint = new UiBreakpoint({
  config: screenSizes,
  useOrientation: true,
  onChange: e => {
    const isMobile = /xxs|xs|sm/.test(e.is);
    
    if(e.orientation == 'landscape' && isMobile){
      alert('Only portrait mode supported!')
    } 
    
    // this is where you update your store to have the breakpoint globally accessible
    // for framework lovers only.
  }  
})

Actually, thats all about the breakpoint API.

Ciao 👋