$$\ $$\ $$\
$$ | $$ | $$ |
$$ | $$ | $$$$$$\ $$$$$$$ | $$$$$$\ $$$$$$\ $$$$$$$\
$$$$$$$$ |$$ __$$\ $$ __$$ |$$ __$$\ $$ __$$\ $$ __$$\
$$ __$$ |$$$$$$$$ |$$ / $$ |$$ | \__|$$ / $$ |$$ | $$ |
$$ | $$ |$$ ____|$$ | $$ |$$ | $$ | $$ |$$ | $$ |
$$ | $$ |\$$$$$$$\ \$$$$$$$ |$$ | \$$$$$$ |$$ | $$ |
\__| \__| \_______| \_______|\__| \______/ \__| \__|
View a landing page built with Hedron.
npm install --save hedron
or better yet
yarn add hedron
View interactive example on webpackbin
import React, { Component } from 'react';
import { Page, Row, Column } from 'hedron';
class App extends Component {
render() {
return (
<Page>
<Row>
<Column sm={8} smShift={2} lg={6} lgShift={3}>
<h1>This is a column that's centered using the shift props</h1>
</Column>
</Row>
<Row>
<Column fluid sm={4}>
<h1>Fluid Columns</h1>
</Column>
<Column fluid sm={4}>
<p>It's a 12 column layout by default.</p>
</Column>
<Column fluid sm={4}>
<Row divisions={24}>
<Column sm={24}>
<p>
But you can change the amount of columns by adding the
`divisions` property to a Row.
</p>
<p>It's fully embeddable as well!</p>
</Column>
</Row>
</Column>
</Row>
</Page>
);
};
}
First of all, thanks for your interest in contributing to hedron. The best place to get started with contributing to hedron
is to join the JSBro Slack Team. Once you're in the slack channel, take a look at the issue tracker and look at the tasks labeled with help wanted
.
$ git clone https://github.com/JSBros/hedron
To install all dependencies, you can use either npm or yarn. I personally prefer [and recommend] using yarn.
$ npm install
$ yarn install
To build hedron from the source code, please run the following command inside the hedron directory
$ npm run build
Before you submit a pull request, you must first make sure that the code base is passing eslint inspections. To do that, please run the following
$ npm run lint
If all goes well, nothing spectacular should happen. If there are any errors, you'll get a lot of red output in your terminal and it will list exactly what needs to be fixed.
In an effort to keep the git history clean, since 0.4.0
I'm enforcing a semantic commit message style.
View the semantic commit message guidelines →
Thanks goes to these wonderful people (emoji key):
Garet McKinley 💻 💡 |
Matt Hamil 💬 |
Mikko Matilainen 💻 |
Nathaniel Piché 💻 📖 |
Brian Stanback 💻 |
Stephen Mathieson 💻 |
---|
This project follows the all-contributors specification. Contributions of any kind are welcome!
Hedron is under the MIT License.