https://github.com/chantastic/react-blox
Reusable, transportable components with box-model style props.
https://github.com/chantastic/react-blox
Last synced: 2 months ago
JSON representation
Reusable, transportable components with box-model style props.
- Host: GitHub
- URL: https://github.com/chantastic/react-blox
- Owner: chantastic
- Created: 2016-07-06T23:12:49.000Z (almost 10 years ago)
- Default Branch: master
- Last Pushed: 2016-07-06T23:13:51.000Z (almost 10 years ago)
- Last Synced: 2025-03-22T03:11:39.634Z (over 1 year ago)
- Language: JavaScript
- Size: 6.84 KB
- Stars: 2
- Watchers: 2
- Forks: 2
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# react-blox
Reusable, transportable components with box-model style props.
## Don't use this
There's not a compelling reason why you should use this.
[https://github.com/petehunt/jsxstyle](jsxstyle) is a more comprehensive
library that overlaps this feature-set completely.
## Installation and Usage
### Node/CommonJS
*Add to project's `package.json`*
```
$ npm i -D react-blox
```
*Use as needed*
```
import { Box } from "react-blox"
const SomethingLikeADropdown = prop => (
This is a block.
)
```
### Script-tag
*Add script*
* Copy `/dist/ReactBlox.js` into your project.
* Add it to your layout file with something like ``.
* `React` must be loaded before this file.
*Use as needed*
```
var Box = ReactBlox.Box;
var style = {
border: "1px solid blue"
margin: "1rem"
padding: "1rem"
minWidth: "100px"
maxWidth: "300px"
overflow: "hidden"
overflowY: "auto"
}
ReactDOM.render(
React.createElement(Box, style, "This is a block"),
mountNode
)
```
## Components
#### `Box`