/react-schematic

Build responsive react layouts using styled schematics without an overhead of any theme configuration

Primary LanguageTypeScriptMIT LicenseMIT

React Schematic

Build responsive react layouts using styled schematics without an overhead of any theme configuration

Install

npm i react-schematic

Usage

import {reactSchematic, breakpoints, Breakpoints} from 'react-schematic';

// Pass custom breakpoints as min-width
let custom: Breakpoints = {
  xs: 0,
  sm: 600,
  md: 900,
  lg: 1200,
  xl: 1536,
};

// Get responsive styled.div components
const {Container, Flex, FlexItem, Grid, GridItem} = reactSchematic(
  custom || breakpoints
);

Logs

v2.0.0

  • added support for padding and margin