https://github.com/josephmaxim/sc-react

🥇 [sc-react v1 alpha] A react library for creating non-rectangular/slanted container divs.
https://github.com/josephmaxim/sc-react

containers css3 react skewed

Last synced: about 1 month ago
JSON representation

🥇 [sc-react v1 alpha] A react library for creating non-rectangular/slanted container divs.

• Host: GitHub
• URL: https://github.com/josephmaxim/sc-react
• Owner: josephmaxim
• License: mit
• Created: 2017-09-03T00:25:23.000Z (about 7 years ago)
• Default Branch: master
• Last Pushed: 2018-01-07T20:41:07.000Z (almost 7 years ago)
• Last Synced: 2024-09-28T14:42:55.613Z (about 2 months ago)
• Topics: containers, css3, react, skewed
• Language: JavaScript
• Homepage:
• Size: 1.61 MB
• Stars: 13
• Watchers: 1
• Forks: 1
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# Skewed container react (sc-react)

A react library for creating non-rectangular/slanted container divs.

[![Build Status](https://travis-ci.org/josephmaxim/sc-react.svg?branch=master)](https://travis-ci.org/josephmaxim/sc-react)

[![npm version](https://badge.fury.io/js/sc-react.svg)](https://badge.fury.io/js/sc-react)

![Hero Image](./opt-res.gif)

### Installation ([Medium post](https://medium.com/@josephmaxim/how-to-make-skewed-containers-in-react-3b92f1e2a74f))

```

npm install --save sc-react

```

or 

```

yarn add sc-react

```

### Adding sc-react

```

import SkewedContainer from 'sc-react';

```

### Example

```

export default class extends React.Component{

    render(){

        return(

            


                

                    {/* YOUR CODE HERE */}

                

            

        )

    }

}

```


### Properties

```

SkewedContainer.propTypes = {

    className: PropTypes.string,

    style: PropTypes.object,

    top: PropTypes.string,

    bottom: PropTypes.string,

    noMargin : PropTypes.bool,

    bgColor: PropTypes.string

    skew: PropTypes.Number

}

```