ea7673f70e
This splits up our `styles.css` file into multiple CSS files that sit alongside the TSX files that use their classes. All "generic" CSS that isn't used by any one particular component, such as our `thingy` class, is currently being put into `page.css`. The CSS files are imported via `import` statements in their associated TSX files. As such, this fixes #164. This also starts formatting our CSS using Prettier. It also moves some of our `<head>` tags back into `index.html`, reverting a tiny bit of #205, to ensure that some of the metadata can be recognized by browsers, and start loading asynchronously, independently of the page's JavaScript (I see no reason why any of those elements need to change dynamically based on the app's state, so there don't seem to be any downsides to this). |
||
|---|---|---|
| .github/workflows | ||
| .vscode | ||
| __mocks__ | ||
| assets | ||
| dist | ||
| lib | ||
| vendor | ||
| .babelrc | ||
| .eslintrc | ||
| .gitattributes | ||
| .gitignore | ||
| .prettierignore | ||
| CODE_OF_CONDUCT.md | ||
| LICENSE.md | ||
| README.md | ||
| build-avro-typescript.js | ||
| build-vocabulary.js | ||
| package-lock.json | ||
| package.json | ||
| tsconfig.json | ||
README.md
This is an attempt by Nina Paley (art) and Atul Varma (code) to tinker with procedural art.
Right now there is no particular goal other than to explore various ideas. The project consists of a web site with multiple pages, each of which is an experiment of some kind.
It can be viewed online or iterated on locally using the instructions below.
Quick start
This requires NodeJS. It was started with NodeJS 14.15.4, but hopefully it should work with any recent version.
After cloning the repository and entering it, run:
npm run watch
then visit http://localhost:1234.
Adding symbols
Documentation for adding and changing symbols can be found in assets/symbols/_instructions.md.
Running tests
To run tests interactively, run:
npm run test:watch
Type checking
To make sure that everything type-checks okay, run:
npm run typecheck
Note that you may want to install a TypeScript plugin for your favorite editor. Aside from telling you what type errors you have in real-time, editor integration also provides code autocompletion and other affordances that can greatly improve your productivity. For more details, see Atul's Fun with TypeScript series of videos.
Code style
All code styling is managed by Prettier.
To format the code automatically, run:
npm run prettier:fix
You can alternatively install a Prettier extension for your editor; see its website for more details.
Deployment
To deploy the project to GitHub Pages, run:
npm run deploy