Skip to content

Commit a755f77

Browse files
committed
Bump version to 2.0.0
1 parent e34980e commit a755f77

File tree

5 files changed

+17
-13
lines changed

5 files changed

+17
-13
lines changed

README.md

+15-11
Original file line numberDiff line numberDiff line change
@@ -1,26 +1,30 @@
1-
>### A Big Update And Refactor Is Coming
1+
# Pixel Art to CSS
22

3-
>Please be patient and do not send a PR these days...I promise it will not be long. New exciting features will be integrated soon.
3+
<a target='_blank' href='http://www.recurse.com' title='Made at the Recurse Center'><img src='https://cloud.githubusercontent.com/assets/2883345/11325206/336ea5f4-9150-11e5-9e90-d86ad31993d8.png' height='20px'/></a>
44

5-
# Pixel-art to CSS with react
5+
### Did you know that you can draw and animate pixel art using CSS?
66

7-
<a target='_blank' href='http://www.recurse.com' title='Made at the Recurse Center'><img src='https://cloud.githubusercontent.com/assets/2883345/11325206/336ea5f4-9150-11e5-9e90-d86ad31993d8.png' height='20px'/></a>
7+
**pixel-art-react** is a handy and intuitive tool, that can help you to design your awesome drawings and animations!
88

9-
### Did you know that you can create pixel art using a single CSS property?
9+
Try to draw some pixels on the screen, **pixel-art-react** will generate the CSS code using **box-shadow** property.
1010

11-
**pixel-art-react** is a handy and intuitive tool, that can help you to design your awesome drawings!
11+
Create as much drawings as you want in your project adding new frames and then check them in motion! it will use CSS **keyframes** to get the animation done and the CSS code will be ready to use in your HTML blocks.
1212

13-
Try to draw some pixels on the screen, **pixel-art-react** will generate the CSS code using **box-shadow** property, ready to use in your HTML blocks.
13+
Please check the following example:
1414

15-
Check the following **_mini-pixel-spiderman_** example:
15+
![pixel-art-react](screenshots/screenshot-pink.png)
1616

17-
![pixel-art-react](screenshots/screenshot1.png)
17+
The app layout is responsive and adjust itself to the screen width. You can see different layout examples (desktop and mobile) in the screenshot.
1818

1919
The project is built with **React**, **Redux** and **ImmutableJS**. Trying to avoid side-effects in a functional way of programming.
2020

21-
You will be able to **load** and **save** drawings, **undo** **redo** your actions, change grid properties, **share** your drawings and **download** them, everything in a very easy and fast way.
21+
You will be able to **load**, **save**, **import**, **export** projects, **undo** **redo** your actions, change grid properties, **share** your drawings/animations and **download** them, everything in a very easy and fast way.
22+
23+
Check the results of this simple project:
24+
25+
![](screenshots/animation-pink.gif)
2226

23-
##### See it live at [pixelart-to-css-react](http://pixelart-to-css-react.herokuapp.com/)
27+
##### See it live at [pixelart-to-css-react](http://pixelart.jvrpath.com/)
2428
#### Help me to improve it, share and enjoy :)
2529

2630
## Technical overview

package.json

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
{
22
"name": "pixel-art-react",
3-
"version": "1.1.0",
4-
"description": "Pixel art drawing web app powered by ReactJS",
3+
"version": "2.0.0",
4+
"description": "Draw and animate Pixel Art, then export the results to CSS, share or download them, powered by React",
55
"author": "Javier Valencia Romero",
66
"scripts": {
77
"lint": "eslint --ext .js --ext .jsx .",

screenshots/animation-pink.gif

4.97 KB
Loading

screenshots/screenshot-pink.png

170 KB
Loading

screenshots/screenshot1.png

-55.2 KB
Binary file not shown.

0 commit comments

Comments
 (0)