react-lattice

A set of flexible React components that simplify responsive web development.

Install

npm i -s @nascentdigital/react-lattice

Usage

// imports
import * as React from "react";
import {createGrid} from "@nascentdigital/react-lattice";

// define Grid (can be customized)
const Grid = createGrid();


// component
export const Page = () => {

    // render
    return (
        <Grid container justify="spaceEvenly" alignItems="center">
            <Grid item flex={{xs: 12, md: 6}}>                  
                Left (desktop), Top (mobile + tablet)                
            </Grid>
            <Grid item flex={{xs: 12, md: 6}}>                  
                Right (desktop), Bottom (mobile + tablet)                
            </Grid>
        </Grid>
    );
};

License

MIT © Nascent Digital