4.1.12 • Published 7 months ago

scong-react-fork-pdf-stylesheet v4.1.12

Weekly downloads
-
License
MIT
Repository
github
Last release
7 months ago

scong-react-fork-pdf-stylesheet

React-pdf styles engine

How to install

yarn add scong-react-fork-pdf-stylesheet

How it works

const stylesheet = require('scong-react-fork-pdf-stylesheet');

const container = {
  width: 400,
  height: 600,
  orientation: 'portrait',
};

const style = {
  margin: 20,
  width: '50vw',
  height: '20vh',
  borderRadius: 5,
  fontWeight: 'semibold',
  borderBottom: '2 solid yellow',
  '@media max-width: 500': {
    backgroundColor: 'rgb(255, 0, 0)',
  },
};

const computed = stylesheet(container, style);

// Computed
// {
//   width: 200,
//   height: 120,
//   marginTop: 20,
//   marginLeft: 20,
//   marginRight: 20,
//   marginBottom: 20,
//   marginBottom: 20,
//   borderTopLeftRadius: 5,
//   borderTopRightRadius: 5,
//   borderBottomLeftRadius: 5,
//   borderBottomRightRadius: 5,
//   fontWeight: 600,
//   borderBottomWidth: 2,
//   borderBottomStyle: 'solid',
//   borderBottomColor: 'yellow',
//   backgroundColor: '#FF0000'
// }

This library exports a stylesheet function that takes two arguments:

  • container: Container where the styles are being computed into. It specifies the width and height in points (needed for media queries and unit conversions), and optionally the container orientation (needed for certain media queries).
  • style: Style to be computed. JS object with raw styles that you would like to get in a normalized format.

License

MIT © Diego Muracciole