1.0.1 • Published 5 years ago
wireframe.css v1.0.1
wireframe.css
It's easy to create simple prototype with HTML but when you show it to client they often get sidetracked by design instead of checking if all input fields are there.
Installation
Just download dist/main.css or using npm
npm install wireframe.cssUsage
Link or import dist/main.css and that's it.
For example in your *.html
...
<head>
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="stylesheet" href="node_modules/wireframe.css/dist/main.css" />
</head>
...or in *.js
import "wireframe.css";From this:
<body>
<main>
<h1>Wireframe.css</h1>
<article>
<img />
<img />
<img />
<img />
<img />
<p>
text text some text
</p>
</article>
</main>
</body>You get this:
Storybook
If you want to browse "components" aka HTML5 elements start
npm run storybookDevelopment
We are using css-modules and webpack + postcss to compile them.
When you change css you have to run npm run build or while developing
npm run build -- --watch