https://andreas-groos.github.io/tic-tac-toe/
Part of the motiviation was to learn how to build and publish my own NPM
package
As a starting point I used this article.
You can install the package and use it in your project with:
npm i @andreas.groos/tic-tac-toe
or
yarn add @andreas.groos/tic-tac-toe
`
At the moment there are only 2 components, TRow
and TCol
.
const App = () => (
<div style={{ height: "100vh" }}>
<TRow fillHeight>
<TCol centered>
<h1>Tic-Tac-Toe</h1>
</TCol>
</TRow>
</div>
);
Prop Name | type | possible values | Description |
---|---|---|---|
justifyContent | string |
start /flex-start , end /flex-end , between /space-between , around /space-around ,evenly /space-evenly |
emulates justify-content |
alignItems | string |
start /flex-start , end /flex-end , center , stretch , baseline /base |
emulates align-items |
fillHeight | boolean |
true , false |
if true fills height of parent container |
centered | boolean |
true , false |
centers children horizontally and vertically |
Prop Name | type | possible values | Description |
---|---|---|---|
centered | boolean |
true , false |
centers element in parent div |
fillWidth | boolean |
true , false |
if true fills full available width |