Occam's colours, syntax schemes, common styles and images.
npm install occam-stylesOccam's colours, syntax schemes, common styles and images.
- Introduction
- Installation
- Example
- Usage
- Building
- Acknowledgements
- Contact
This package contains colour definitions together with user interface and syntax schemes; various images, in either native or JSX form; and the JuliaMono font in Woff2 format.
There is a small example application to view some of the images in JSX form and so on.
With npm:
npm install occam-styles
You can also clone the repository with Git...
git clone https://github.com/djalbat/occam-styles.git
...and then install the dependencies with npm from within the project's root directory:
npm install
You can also run a development server, see the section on building later on.
The JuliaMono.zip file can be downloaded from the releases page of the JulaMono repository on GitHub.
Once downloaded, unzip the file:
``
unzip JuliaMono.zip
All the files bar the JuliaMono-Regular.ttf file can be deleted, as can the webfonts directory.ttf/
A copy of this file is kept in the directory, by the way, but it may not be the latest.
Ligatures and their like can be removed with the using pyftsubset:
`
pip install fonttools
pyftsubset JuliaMono-Regular.ttf '*' --output-file=JuliaMono-Regular.ttf --layout-features-=calt,liga
If you have a Mac with Homebrew installed then you can install the utility to convert the TTF file to WOFF2 thus:
`
brew install woff2
To convert the TTF to a WOFF2 file:
`
woff2_compress JuliaMono-Regular.ttf
This utility can be installed and run on other platforms with a little effort.
There is a small development server that can be run from within the project's directory with the following command:
npm start
The example will then be available at the following URL:
http://localhost:8888
The source for the example can be found in the src/example.js file and corresponding src/example folder. You are encouraged to try the example whilst reading what follows. You can rebuild it on the fly with the following command:
npm run watch-debug
The development server will reload the page whenever you make changes.
One last thing to bear in mind is that this package is included by way of a relative rather than a package import. If you are importing it into your own application, however, you should use the standard package import.
The various styles and elements can be importsed in the usual manner:
`
import { CreateSessionToolbarSVG } from "occam-styles";
For a complete list see the src/index.js file.
Automation is done with npm scripts, have a look at the package.json file. The pertinent commands are:
npm run build-debug
npm run watch-debug
* The syntax colouring is based on the Monokai theme.
* Colours are courtesy of Chirag Mehta's Name that Colour.
* The logo was converted to SVG format with Peter Selinger's Potrace.
* Occam's pretty printer uses the JuliaMono font distributed under the SIL Open Font License (OFL).
* Fredrik Ekre provided the script for removing ligatures and contextual alternate characters.
* james.smith@djalbat.com
`
pyftsubset Inconsolata-Regular.ttf '*' --output-file=Inconsolata-Regular.ttf --layout-features-=calt,liga
``