cf-component-viewport
Cloudflare Viewport Component
Installation
$ npm install cf-component-viewport
Usage
import React from 'react';import Viewport from 'cf-component-viewport'; const ViewportComponent = <div> <p>Resize the window</p> <Viewport ="mobile"> <p ="cf-viewport--is">size="mobile"</p> </Viewport> <Viewport ="mobile"> <p ="cf-viewport--not">not size="mobile"</p> </Viewport> <Viewport ="mobileWide"> <p ="cf-viewport--is">size="mobileWide"</p> </Viewport> <Viewport ="mobileWide"> <p ="cf-viewport--not">not size="mobileWide"</p> </Viewport> <Viewport ="tablet"> <p ="cf-viewport--is">size="tablet"</p> </Viewport> <Viewport ="tablet"> <p ="cf-viewport--not">not size="tablet"</p> </Viewport> <Viewport ="desktop"> <p ="cf-viewport--is">size="desktop"</p> </Viewport> <Viewport ="desktop"> <p ="cf-viewport--not">not size="desktop"</p> </Viewport> <Viewport ="desktopLarge"> <p ="cf-viewport--is">size="desktopLarge"</p> </Viewport> <Viewport ="desktopLarge"> <p ="cf-viewport--not">not size="desktopLarge"</p> </Viewport> </div>; ;