*nix Programming Mammals

    cf-component-viewport

    2.2.1 • Public • Published

    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 size="mobile">
          <p className="cf-viewport--is">size="mobile"</p>
        </Viewport>
        <Viewport not size="mobile">
          <p className="cf-viewport--not">not size="mobile"</p>
        </Viewport>
     
        <Viewport size="mobileWide">
          <p className="cf-viewport--is">size="mobileWide"</p>
        </Viewport>
        <Viewport not size="mobileWide">
          <p className="cf-viewport--not">not size="mobileWide"</p>
        </Viewport>
     
        <Viewport size="tablet">
          <p className="cf-viewport--is">size="tablet"</p>
        </Viewport>
        <Viewport not size="tablet">
          <p className="cf-viewport--not">not size="tablet"</p>
        </Viewport>
     
        <Viewport size="desktop">
          <p className="cf-viewport--is">size="desktop"</p>
        </Viewport>
        <Viewport not size="desktop">
          <p className="cf-viewport--not">not size="desktop"</p>
        </Viewport>
     
        <Viewport size="desktopLarge">
          <p className="cf-viewport--is">size="desktopLarge"</p>
        </Viewport>
        <Viewport not size="desktopLarge">
          <p className="cf-viewport--not">not size="desktopLarge"</p>
        </Viewport>
      </div>
    );
     
    export default ViewportComponent;

    Keywords

    none

    Install

    npm i cf-component-viewport

    DownloadsWeekly Downloads

    85

    Version

    2.2.1

    License

    BSD-3-Clause

    Last publish

    Collaborators

    • sgoodhew_cf
    • janik-cloudflare
    • terinjokes
    • third774
    • evanderkoogh
    • jsteinberger
    • jasnell
    • kkoenig
    • asapzacy
    • pcostanzo
    • gregbrimble
    • geelen
    • jgentes
    • threepointone
    • rexscaria
    • dcruz_cf
    • xuranwang
    • jculvey
    • sejoker
    • caass
    • vasturiano
    • cf-ci-write
    • segments-write
    • thibmeu
    • xortive
    • gurjinder
    • cf-ci2
    • lvalenta
    • worenga