├── .babelrc
├── .eslintrc
├── .gitignore
├── .travis.yml
├── .zuul.yml
├── History.md
├── Makefile
├── Readme.md
├── component.json
├── dist
├── matter.css
└── matter.js
├── examples
├── button.js
├── code.js
├── index.js
├── menu.js
├── shape.js
├── table.js
└── text-field.js
├── index.css
├── index.js
├── lib
├── button
│ ├── index.css
│ └── index.js
├── checkbox
│ ├── checkbox.svg
│ ├── index.css
│ └── index.js
├── code
│ ├── index.css
│ └── index.js
├── colors
│ └── index.css
├── grid
│ ├── index.css
│ └── index.js
├── index.css
├── index.js
├── menu
│ ├── index.css
│ └── index.js
├── shape
│ ├── index.css
│ └── index.js
├── table
│ ├── index.css
│ └── index.js
├── text-field
│ ├── index.css
│ └── index.js
├── theme
│ └── index.css
└── typography
│ ├── index.css
│ ├── san-francisco-display
│ ├── index.css
│ ├── sanfranciscodisplay-black-webfont.eot
│ ├── sanfranciscodisplay-black-webfont.svg
│ ├── sanfranciscodisplay-black-webfont.ttf
│ ├── sanfranciscodisplay-black-webfont.woff
│ ├── sanfranciscodisplay-black-webfont.woff2
│ ├── sanfranciscodisplay-bold-webfont.eot
│ ├── sanfranciscodisplay-bold-webfont.svg
│ ├── sanfranciscodisplay-bold-webfont.ttf
│ ├── sanfranciscodisplay-bold-webfont.woff
│ ├── sanfranciscodisplay-bold-webfont.woff2
│ ├── sanfranciscodisplay-heavy-webfont.eot
│ ├── sanfranciscodisplay-heavy-webfont.svg
│ ├── sanfranciscodisplay-heavy-webfont.ttf
│ ├── sanfranciscodisplay-heavy-webfont.woff
│ ├── sanfranciscodisplay-heavy-webfont.woff2
│ ├── sanfranciscodisplay-light-webfont.eot
│ ├── sanfranciscodisplay-light-webfont.svg
│ ├── sanfranciscodisplay-light-webfont.ttf
│ ├── sanfranciscodisplay-light-webfont.woff
│ ├── sanfranciscodisplay-light-webfont.woff2
│ ├── sanfranciscodisplay-medium-webfont.eot
│ ├── sanfranciscodisplay-medium-webfont.svg
│ ├── sanfranciscodisplay-medium-webfont.ttf
│ ├── sanfranciscodisplay-medium-webfont.woff
│ ├── sanfranciscodisplay-medium-webfont.woff2
│ ├── sanfranciscodisplay-regular-webfont.eot
│ ├── sanfranciscodisplay-regular-webfont.svg
│ ├── sanfranciscodisplay-regular-webfont.ttf
│ ├── sanfranciscodisplay-regular-webfont.woff
│ ├── sanfranciscodisplay-regular-webfont.woff2
│ ├── sanfranciscodisplay-semibold-webfont.eot
│ ├── sanfranciscodisplay-semibold-webfont.svg
│ ├── sanfranciscodisplay-semibold-webfont.ttf
│ ├── sanfranciscodisplay-semibold-webfont.woff
│ ├── sanfranciscodisplay-semibold-webfont.woff2
│ ├── sanfranciscodisplay-thin-webfont.eot
│ ├── sanfranciscodisplay-thin-webfont.svg
│ ├── sanfranciscodisplay-thin-webfont.ttf
│ ├── sanfranciscodisplay-thin-webfont.woff
│ ├── sanfranciscodisplay-thin-webfont.woff2
│ ├── sanfranciscodisplay-ultralight-webfont.eot
│ ├── sanfranciscodisplay-ultralight-webfont.svg
│ ├── sanfranciscodisplay-ultralight-webfont.ttf
│ ├── sanfranciscodisplay-ultralight-webfont.woff
│ └── sanfranciscodisplay-ultralight-webfont.woff2
│ └── san-francisco-text
│ ├── index.css
│ ├── sanfranciscotext-bold-webfont.eot
│ ├── sanfranciscotext-bold-webfont.svg
│ ├── sanfranciscotext-bold-webfont.ttf
│ ├── sanfranciscotext-bold-webfont.woff
│ ├── sanfranciscotext-bold-webfont.woff2
│ ├── sanfranciscotext-bolditalic-webfont.eot
│ ├── sanfranciscotext-bolditalic-webfont.svg
│ ├── sanfranciscotext-bolditalic-webfont.ttf
│ ├── sanfranciscotext-bolditalic-webfont.woff
│ ├── sanfranciscotext-bolditalic-webfont.woff2
│ ├── sanfranciscotext-heavy-webfont.eot
│ ├── sanfranciscotext-heavy-webfont.svg
│ ├── sanfranciscotext-heavy-webfont.ttf
│ ├── sanfranciscotext-heavy-webfont.woff
│ ├── sanfranciscotext-heavy-webfont.woff2
│ ├── sanfranciscotext-heavyitalic-webfont.eot
│ ├── sanfranciscotext-heavyitalic-webfont.svg
│ ├── sanfranciscotext-heavyitalic-webfont.ttf
│ ├── sanfranciscotext-heavyitalic-webfont.woff
│ ├── sanfranciscotext-heavyitalic-webfont.woff2
│ ├── sanfranciscotext-light-webfont.eot
│ ├── sanfranciscotext-light-webfont.svg
│ ├── sanfranciscotext-light-webfont.ttf
│ ├── sanfranciscotext-light-webfont.woff
│ ├── sanfranciscotext-light-webfont.woff2
│ ├── sanfranciscotext-lightitalic-webfont.eot
│ ├── sanfranciscotext-lightitalic-webfont.svg
│ ├── sanfranciscotext-lightitalic-webfont.ttf
│ ├── sanfranciscotext-lightitalic-webfont.woff
│ ├── sanfranciscotext-lightitalic-webfont.woff2
│ ├── sanfranciscotext-medium-webfont.eot
│ ├── sanfranciscotext-medium-webfont.svg
│ ├── sanfranciscotext-medium-webfont.ttf
│ ├── sanfranciscotext-medium-webfont.woff
│ ├── sanfranciscotext-medium-webfont.woff2
│ ├── sanfranciscotext-mediumitalic-webfont.eot
│ ├── sanfranciscotext-mediumitalic-webfont.svg
│ ├── sanfranciscotext-mediumitalic-webfont.ttf
│ ├── sanfranciscotext-mediumitalic-webfont.woff
│ ├── sanfranciscotext-mediumitalic-webfont.woff2
│ ├── sanfranciscotext-regular-webfont.eot
│ ├── sanfranciscotext-regular-webfont.svg
│ ├── sanfranciscotext-regular-webfont.ttf
│ ├── sanfranciscotext-regular-webfont.woff
│ ├── sanfranciscotext-regular-webfont.woff2
│ ├── sanfranciscotext-regularitalic-webfont.eot
│ ├── sanfranciscotext-regularitalic-webfont.svg
│ ├── sanfranciscotext-regularitalic-webfont.ttf
│ ├── sanfranciscotext-regularitalic-webfont.woff
│ ├── sanfranciscotext-regularitalic-webfont.woff2
│ ├── sanfranciscotext-semibold-webfont.eot
│ ├── sanfranciscotext-semibold-webfont.svg
│ ├── sanfranciscotext-semibold-webfont.ttf
│ ├── sanfranciscotext-semibold-webfont.woff
│ ├── sanfranciscotext-semibold-webfont.woff2
│ ├── sanfranciscotext-semibolditalic-webfont.eot
│ ├── sanfranciscotext-semibolditalic-webfont.svg
│ ├── sanfranciscotext-semibolditalic-webfont.ttf
│ ├── sanfranciscotext-semibolditalic-webfont.woff
│ ├── sanfranciscotext-semibolditalic-webfont.woff2
│ ├── sanfranciscotext-thin-webfont.eot
│ ├── sanfranciscotext-thin-webfont.svg
│ ├── sanfranciscotext-thin-webfont.ttf
│ ├── sanfranciscotext-thin-webfont.woff
│ ├── sanfranciscotext-thin-webfont.woff2
│ ├── sanfranciscotext-thinitalic-webfont.eot
│ ├── sanfranciscotext-thinitalic-webfont.svg
│ ├── sanfranciscotext-thinitalic-webfont.ttf
│ ├── sanfranciscotext-thinitalic-webfont.woff
│ └── sanfranciscotext-thinitalic-webfont.woff2
├── package.json
├── preview.css
├── preview.html
├── preview.js
├── support
├── deploy.js
├── duo.js
└── preview.js
└── test
├── button.js
├── checkbox.js
├── code.js
├── grid.js
├── menu.js
├── shape.js
├── table.js
└── text-field.js
/.babelrc:
--------------------------------------------------------------------------------
1 | {
2 | "presets": [
3 | "es2015",
4 | "react"
5 | ],
6 | "plugins": [
7 | ["transform-react-jsx", { "pragma": "element" }]
8 | ]
9 | }
10 |
--------------------------------------------------------------------------------
/.eslintrc:
--------------------------------------------------------------------------------
1 | {
2 | "env": {
3 | "browser": true,
4 | "node": true,
5 | "mocha": true,
6 | "es6": true
7 | },
8 | "rules": {
9 | "brace-style": [2, "1tbs", { "allowSingleLine": true }],
10 | "camelcase": 0,
11 | "comma-style": [2, "last"],
12 | "consistent-this": [0, "self"],
13 | "curly": [2, "multi-line"],
14 | "default-case": 2,
15 | "dot-location": [2, "property"],
16 | "dot-notation": [2, { "allowKeywords": true }],
17 | "generator-star-spacing": [2, "after"],
18 | "guard-for-in": 2,
19 | "indent": [2, 2],
20 | "max-depth": [1, 6],
21 | "max-len": [1, 100, 2],
22 | "max-nested-callbacks": [1, 6],
23 | "max-params": [1, 5],
24 | "no-bitwise": 2,
25 | "no-else-return": 2,
26 | "no-floating-decimal": 2,
27 | "no-inline-comments": 0,
28 | "no-lonely-if": 2,
29 | "no-multiple-empty-lines": [2, {"max": 2}],
30 | "no-nested-ternary": 2,
31 | "no-new-require": 2,
32 | "no-self-compare": 2,
33 | "no-shadow": 0,
34 | "new-cap": [2, {"newIsCap": false, "capIsNew": false}],
35 | "no-throw-literal": 2,
36 | "no-underscore-dangle": 0,
37 | "no-unneeded-ternary": 2,
38 | "no-use-before-define": [2, "nofunc"],
39 | "no-void": 2,
40 | "one-var": [2, "never"],
41 | "object-curly-spacing": [1, "always"],
42 | "operator-linebreak": [2, "before"],
43 | "padded-blocks": [2, "never"],
44 | "quote-props": [2, "as-needed"],
45 | "quotes": [2, "single"],
46 | "radix": 2,
47 | "semi": [2, "always"],
48 | "space-after-keywords": [2, "always"],
49 | "space-before-blocks": [1, "always"],
50 | "space-before-function-paren": [2, "never"],
51 | "space-in-parens": [2, "never"],
52 | "strict": 0,
53 | "valid-jsdoc": [1, {
54 | "prefer": {
55 | "returns": "return"
56 | },
57 | "requireReturn": false,
58 | "requireReturnDescription": false
59 | }],
60 | "wrap-iife": [2, "outside"],
61 | "wrap-regex": 2,
62 | "yoda": [1, "never"]
63 | },
64 | "ecmaFeatures": {
65 | "jsx": true,
66 | "modules": true
67 | }
68 | }
69 |
--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
1 | node_modules
2 | components
3 | .DS_Store
4 | build
5 |
--------------------------------------------------------------------------------
/.travis.yml:
--------------------------------------------------------------------------------
1 | sudo: false
2 | language: node_js
3 | node_js:
4 | - stable
5 | install: npm update
6 | cache:
7 | directories:
8 | - node_modules
9 | env:
10 | global:
11 | - secure: u34k70cEeYBg5LzLZ+CA1ObgtnXeTXBWminXazwMWBXCHt0JjnfL14fuSVhY/dx7v6exmZtDUn7GGHowcxldIem/+UBhbS20nS5+evhNVBYAEn2A3ozzFaRkBUreDOmzoMu5Z3E7Vs9cvw/SEupIMOziS/jFrRrdsU8DfYvD9QJGJ4sC40CGaz+lKHhaifZIb0fETgtKRRY6XsJ1RDuVLGMJ0/cE0I8FfgaVsHMHeadpU54eWhre1wnFRPijbH3bZWvZHWRoiYxkrRnuEOaz9RIThD9B7aVcTpJxVLhfHbiH3X1Oc0K4t9SU7NfqliukRouCm0wWCw3q6nDXb2DKs5+SadhYKYyIp1X33KL6c+JLAXEaoesobCQWbtrQ/KyghPYcqtM2ixhnWxrSJh2oKOtbuqgWLXgpFE34T7baTRQDNCFI+kIvsvbpgOs6wtNBGuJV2YDsNfSfau/vyXIKs20F0wZs6ZNHwwKwINxnjWVwCmswa/OR/Ap+LU82SVAe+D3Zl4eoBPGDVOM12Ogoo4ppmtFnyWIoi6Mzlbbvr+GtEkDX8dJUOCZp41nO+mf7WPZYqb+2bQYMRIguMYubq3g7ARHFj7FNvnLvZjJ270ByYqCZntoZ8DL8TzbVDmdOBS7efYhuxuq8J1irb3rs7O0rmHW5dS1KRgLXxDzizk0=
12 | - secure: BsHuRzFlORSTPWoxGOf72UEoaMJ7KcSylUYT19CSw9LzxpBPMOUAUuN2XnfQrIUwQRtsqTanFL8nw/e/7gaPefJriEW4EjO6qXfNSGhDA2dVVDeQB2nCiXMSBpIx++DXCfguLAcqXdeIBnZDBlM4aDNtQXHq6MIF2pv1QO278tWgo91SIF4ZX8qKoZ/tl86Fv/p3U6cpn39+sXwy7TZVu0F1kSWeTHrOQRUrg5xNKL5RM8oK2EuSlR0fKkOTk2xB96VgHHyVu/0I/+OQPODsUbX28J7P8y1PzEIkIDLLOJNQEODtpUrK3btnuD8H5FVSgi62oF9j2iH+ZxygRoQAsxSAVWqJbIje1QsNjRWnap5WcoCIVxCtPLGJhsXJUSyYV1OAfxnxyX05SlRNgiNptUdLaf0etM3M2c+0Sj77W/DBCXsomO5gyQZ2yMfxg/dPjQ2GCFJ8/8d7Oyf7uRv33RpXxeANyQMdii6wXJzCluYgzwQu8r6zqF2zJK+qr7+k1NBewuIn2mxMqBfWb1vHtpu/3VlwfKYz57iYBMJTAp2WC9gUg6+1yTY7gFcTr3AZ4+/Ey2IMoSOdANvSqJtlcGK2Cm+vyK7q1Cn4S082pVxOXkWWHwrsvRMAYTucGuDKzZQ2ymtf2TFa+vXISm28hAb7rM37tA6qL9YBdF29RiY=
13 |
--------------------------------------------------------------------------------
/.zuul.yml:
--------------------------------------------------------------------------------
1 | ui: mocha-bdd
2 | browserify:
3 | - transform: babelify
4 | browsers:
5 | - name: chrome
6 | version: -1..latest
7 | - name: firefox
8 | version: -1..latest
9 | - name: safari
10 | version: -1..latest
11 | - name: ie
12 | version: -1..latest
13 |
--------------------------------------------------------------------------------
/History.md:
--------------------------------------------------------------------------------
1 |
2 | 0.1.3 / January 3rd, 2015
3 |
4 | * Made matter searchable by dekucomponents
5 |
6 | 0.1.2 / December 14th, 2015
7 |
8 | * Added tests
9 |
10 | 0.1.1 / December 14th, 2015
11 |
12 | * Updated eslint rules
13 |
14 | 0.1.0 / December 14th, 2015
15 |
16 | * Switched to browserify
17 |
18 | 0.0.6 / August 31st, 2015
19 |
20 | * Added generic shape component
21 |
22 | 0.0.5 / August 27th, 2015
23 |
24 | * Style updates
25 |
26 | 0.0.4 / August 26th, 2015
27 |
28 | * Updated to use latest Deku
29 | * Switched from Browserify to Duo for example
30 |
31 | 0.0.3 / June 28th, 2015
32 |
33 | * Added checkbox component
34 |
35 | 0.0.2 / June 2nd, 2015
36 |
37 | * Updated package.json
38 |
39 | 0.0.1 / June 2nd, 2015
40 |
41 | * Updated table component
42 | * Updated readme
43 |
44 | 0.0.0 / May 31st, 2015
45 |
46 | * First release
47 |
--------------------------------------------------------------------------------
/Makefile:
--------------------------------------------------------------------------------
1 | BIN := ./node_modules/.bin
2 | BROWSERIFY := $(BIN)/browserify
3 | POSTCSS := $(BIN)/postcss
4 | ESLINT := $(BIN)/eslint
5 |
6 | #
7 | # Default.
8 | #
9 |
10 | default: build test-style node_modules
11 |
12 | #
13 | # Build.
14 | #
15 |
16 | build: node_modules
17 | @mkdir -p build
18 | @cp preview.html build/index.html
19 | @$(BROWSERIFY) index.js -t [babelify] > build/preview.js
20 | @$(POSTCSS) -u postcss-import -u postcss-url --postcss-url.url "copy" -u postcss-cssnext -u autoprefixer -o build/preview.css ./preview.css
21 |
22 | #
23 | # Preview.
24 | #
25 |
26 | preview: node_modules
27 | @node --harmony support/preview
28 |
29 | #
30 | # Dist.
31 | #
32 |
33 | dist: node_modules
34 | @mkdir -p dist
35 | @$(BROWSERIFY) index.js -t [ babelify --presets [ es2015 react ] ] > dist/matter.js
36 | @$(POSTCSS) -u postcss-import -u postcss-url --postcss-url.url "copy" -u postcss-cssnext -u autoprefixer -o dist/matter.css ./index.css
37 |
38 | #
39 | # Deploy.
40 | #
41 |
42 | deploy: node_modules build
43 | @node support/deploy.js
44 |
45 | #
46 | # Test style.
47 | #
48 |
49 | test-style:
50 | @$(ESLINT) ./lib
51 |
52 | #
53 | # Dependencies.
54 | #
55 |
56 | node_modules: package.json
57 | @npm install
58 |
59 | #
60 | # Clean.
61 | #
62 |
63 | clean:
64 | @rm -rf build *.log
65 |
66 | #
67 | # Clean dependencies.
68 | #
69 |
70 | clean-deps:
71 | @rm -rf node_modules components
72 |
73 | #
74 | # Phonies.
75 | #
76 |
77 | .PHONY: preview deploy dist test-style
78 |
--------------------------------------------------------------------------------
/Readme.md:
--------------------------------------------------------------------------------
1 |
2 | # Matter
3 |
4 | Matter is a tiny collection of UI components. The components are built with [Deku](http://github.com/dekujs/deku). Check out the [website](http://stevenmiller888.github.io/matter/) for live examples. A React version is available [here](https://github.com/stevenmiller888/matter-react).
5 |
6 | 
7 |
8 | ## Installation
9 |
10 | Matter is available on npm:
11 |
12 | `npm install matterjs`
13 |
14 | Or you can download the [files](https://github.com/stevenmiller888/matter/tree/master/dist) directly.
15 |
16 | ## Usage
17 |
18 | ```js
19 | import { Button } from 'matter';
20 | import element from 'virtual-element';
21 | import { deku, render } from 'deku';
22 |
23 | let app = deku();
24 | render(app, document.body);
25 | ```
26 |
27 | ## Components
28 |
29 | ### Button
30 |
31 | ```js
32 |
33 | ```
34 |
35 | ### Code
36 |
37 | ```js
38 |
39 | {`
40 | var Git = require('gity');
41 |
42 | var git = Git()
43 | .add('*.js')
44 | .commit('-m "added js files"')
45 | .run();
46 | `}
47 |
48 | ```
49 |
50 | ### Menu
51 |
52 | ```js
53 | let sections = ['Home', 'Profile', 'Messages', 'Notifications'];
54 |
55 |
56 | ```
57 |
58 | ### Table
59 |
60 | ```js
61 | let people = [
62 | ['Full Name', 'Age'], // header row
63 | ['Steven Miller', '25'],
64 | ['Tamara Jordan', '23'],
65 | ['John Smith', '28']
66 | ];
67 |
68 |
69 | ```
70 |
71 | ### Text Field
72 |
73 | ```js
74 |
75 | ```
76 |
77 | ### Shape
78 |
79 | ```js
80 |
81 | ```
82 |
83 | ### Grid
84 |
85 | ```js
86 |
87 | // ... children
88 |
89 | ```
90 |
91 |
92 | ## License
93 |
94 | [MIT](https://tldrlegal.com/license/mit-license)
95 |
--------------------------------------------------------------------------------
/component.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "stevenmiller888/matter",
3 | "version": "0.1.3",
4 | "main": "index.js",
5 | "dependencies": {
6 | "forbeslindesay/ascii-math": "^2.0.0",
7 | "dekujs/virtual-element": "^1.1.2",
8 | "suitcss/base": "^1.0.1"
9 | }
10 | }
11 |
--------------------------------------------------------------------------------
/dist/matter.css:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/dist/matter.css
--------------------------------------------------------------------------------
/dist/matter.js:
--------------------------------------------------------------------------------
1 | (function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o 0 && Array.isArray(value)) {
513 | flattenWithDepth(value, result, depth - 1)
514 | } else {
515 | result.push(value)
516 | }
517 | }
518 |
519 | return result
520 | }
521 |
522 | /**
523 | * Recursive flatten function. Omitting depth is slightly faster.
524 | *
525 | * @param {Array} array
526 | * @param {Array} result
527 | * @return {Array}
528 | */
529 | function flattenForever (array, result) {
530 | for (var i = 0; i < array.length; i++) {
531 | var value = array[i]
532 |
533 | if (Array.isArray(value)) {
534 | flattenForever(value, result)
535 | } else {
536 | result.push(value)
537 | }
538 | }
539 |
540 | return result
541 | }
542 |
543 | /**
544 | * Flatten an array, with the ability to define a depth.
545 | *
546 | * @param {Array} array
547 | * @param {Number} depth
548 | * @return {Array}
549 | */
550 | function arrayFlatten (array, depth) {
551 | if (depth == null) {
552 | return flattenForever(array, [])
553 | }
554 |
555 | return flattenWithDepth(array, [], depth)
556 | }
557 |
558 | },{}],12:[function(require,module,exports){
559 |
560 | /**
561 | * Expose `bash`
562 | */
563 |
564 | module.exports = bash;
565 |
566 | /**
567 | * Add `bash` as a language.
568 | *
569 | * @param {Highlight} highlight
570 | * @api public
571 | */
572 |
573 | function bash(highlight){
574 | highlight.language('sh', bash);
575 | highlight.language('bash', bash);
576 | highlight.language('shellscript', bash);
577 | }
578 |
579 | /**
580 | * Comments
581 | */
582 |
583 | bash.comment = /(#.*?$)/m
584 |
585 | /**
586 | * Strings
587 | */
588 |
589 | bash.string = /(("|')(\\?.)*?\2)/;
590 |
591 | /**
592 | * Keywords
593 | */
594 |
595 | bash.keyword = /\b(if|then|else|elif|fi|for|in|do|done|select|case|continue|esac|while|until|return|export|declare|typeset|local|readonly)\b/;
596 |
597 | /**
598 | * Operators
599 | */
600 |
601 | bash.operator = /(;|&&?|\|\||=[=~]?|!=?|<|>|\|)/;
602 |
603 | /**
604 | * Builtins
605 | */
606 |
607 | bash.builtin = /\b(alias|bg|bind|break|builtin|caller|cd|command|compgen|complete|dirs|disown|echo|enable|eval|exec|exit|false|fc|fg|getopts|hash|help|history|jobs|kill|let|logout|popd|printf|pushd|pwd|read|readonly|set|shift|shopt|source|suspend|test|times|trap|true|type|ulimit|umask|unalias|unset|wait)\b/;
608 | },{}],13:[function(require,module,exports){
609 |
610 | /**
611 | * Expose `csharp`
612 | */
613 |
614 | module.exports = csharp;
615 |
616 | /**
617 | * Add `csharp` as a plugin.
618 | *
619 | * @param {Highlight} highlight
620 | * @api public
621 | */
622 |
623 | function csharp(highlight){
624 | highlight.language('csharp', csharp);
625 | highlight.language('c-sharp', csharp);
626 | highlight.language('c#', csharp);
627 | }
628 |
629 | /**
630 | * Booleans
631 | */
632 |
633 | csharp.boolean = /\b(true|false)\b/;
634 |
635 | /**
636 | * Comments
637 | */
638 |
639 | csharp.comment = /(?!\\{2})(\/\*[\w\W]*?\*\/|\/\/.*?$)/m;
640 |
641 | /**
642 | * Classes
643 | */
644 |
645 | csharp.class = /class +(\w+)/;
646 | csharp.class.children = { keyword: /class/ };
647 |
648 | /**
649 | * Strings
650 | */
651 |
652 | csharp.string = /("(\\?.)*?")/
653 |
654 | /**
655 | * Keywords
656 | */
657 |
658 | csharp.keyword = /\b(abstract|base|bool|break|byte|case|catch|char|class|const|continue|decimal|default|delegate|do|double|else|enum|event|explicit|extern|finally|fixed|float|for|foreach|goto|if|implicit|in|int|interface|internal|lock|long|namespace|null|object|operator|out|override|params|private|protected|public|readonly|ref|return|sbyte|sealed|short|stackalloc|static|string|struct|switch|this|throw|try|uint|ulong|unsafe|ushort|using|virtual|void|volatile|while)\b/;
659 |
660 | /**
661 | * Numbers
662 | */
663 |
664 | csharp.number = /\b[-+]?(0x[\da-f]+|\d*\.?\d+(e-?\d+)?)\b/;
665 |
666 | /**
667 | * Method
668 | */
669 |
670 | csharp.method = /(\w+) *\(/;
671 | csharp.method.children = { punctuation: /\(/ };
672 |
673 | /**
674 | * Operators
675 | */
676 |
677 | csharp.operator = /(await|as|is|new|typeof|checked|unchecked|default|delegate|sizeof|->|[-+]{1,2}|!|<=?|>=?|={1,3}|<{1,2}|>{1,2}|(&){1,2}|\|{1,2}|\?|\*|\/|\~|\^|\%)/;
678 |
679 | /**
680 | * Punctuation
681 | */
682 |
683 | csharp.punctuation = /[{}[\];(),.:]/;
684 | },{}],14:[function(require,module,exports){
685 |
686 | /**
687 | * Expose `plugin`.
688 | */
689 |
690 | module.exports = plugin;
691 |
692 | /**
693 | * Plugin to highlight CSS code.
694 | *
695 | * @param {Highlight} highlight
696 | */
697 |
698 | function plugin(highlight){
699 | highlight.language('css', grammar);
700 | }
701 |
702 | /**
703 | * Grammar.
704 | */
705 |
706 | var grammar = {};
707 |
708 | /**
709 | * Comments.
710 | */
711 |
712 | grammar.comment = /\/\*[\w\W]*?\*\//m;
713 |
714 | /**
715 | * Strings.
716 | */
717 |
718 | grammar.string = /("|').*?\1/;
719 |
720 | /**
721 | * @-rules.
722 | */
723 |
724 | grammar['at-rule'] = /@[\w-]+\b/;
725 |
726 | /**
727 | * Selectors.
728 | */
729 |
730 | grammar.selector = {
731 | pattern: /[^\{\}\s][^\{\};]*?\{/,
732 | children: {
733 | class: /\.[-.\w]+/,
734 | id: /#[-\w]+/,
735 | 'pseudo-element': /:(after|before|first-letter|first-line|selection)|::[-\w]+/,
736 | 'pseudo-class': /:[-\w]+(\(.*\))?/,
737 | punctuation: /\{/
738 | }
739 | };
740 |
741 | /**
742 | * Functions.
743 | */
744 |
745 | grammar.function = {
746 | pattern: /[\w-]+\(/,
747 | children: {
748 | punctuation: /\(/
749 | }
750 | };
751 |
752 | /**
753 | * Properties.
754 | */
755 |
756 | grammar.property = /[\w-]+(?=\s*:)/;
757 |
758 | /**
759 | * Keywords.
760 | */
761 |
762 | grammar.keyword = /[\b|!]important|initial|inherit|none|transparent\b/;
763 |
764 | /**
765 | * Numbers.
766 | */
767 |
768 | grammar.number = /(#[A-Fa-f\d]{3,8}|\b\d*\.?\d+)/;
769 |
770 | /**
771 | * Operators.
772 | */
773 |
774 | grammar.operator = /[-+\/*%^]/;
775 |
776 | /**
777 | * Punctuation.
778 | */
779 |
780 | grammar.punctuation = /[{}(),:;]/;
781 |
782 | /**
783 | * Constant.
784 | */
785 |
786 | grammar.constant = /(?!\d)(ch|cm|deg|dpcm|dpi|dppx|em|ex|grad|Hz|kHz|in|mm|pc|pt|px|rad|rem|s|ms|turn|vh|vmax|vmin|vw)\b/;
787 |
788 | },{}],15:[function(require,module,exports){
789 |
790 | /**
791 | * Expose `plugin`.
792 | */
793 |
794 | module.exports = plugin;
795 |
796 | /**
797 | * Plugin to highlight go code.
798 | *
799 | * @param {Highlight} highlight
800 | */
801 |
802 | function plugin(highlight){
803 | highlight.language('go', grammar);
804 | }
805 |
806 | /**
807 | * Grammar.
808 | */
809 |
810 | var grammar = {};
811 |
812 | /**
813 | * Strings.
814 | */
815 |
816 | grammar.string = /(("|')(\\?.)*?\2)/;
817 |
818 | /**
819 | * Comments.
820 | */
821 |
822 | grammar.comment = /(?!\\{2})(\/\*[\w\W]*?\*\/|\/\/.*?$)/m;
823 |
824 | /**
825 | * Booleans.
826 | */
827 |
828 | grammar.boolean = /\b(true|false)\b/;
829 |
830 | /**
831 | * Keywords.
832 | */
833 |
834 | grammar.keyword = /\b(break|default|func|interface|select|case|defer|go|map|struct|chan}else}goto}package|switch|const|fallthrough|if|range|type|continue|for|import|return|var)\b/;
835 |
836 | /**
837 | * Functions.
838 | *
839 | * Children are set separately to maintain ordering.
840 | */
841 |
842 | grammar.function = {
843 | pattern: /(\w+)\(/,
844 | children: {}
845 | };
846 |
847 | grammar.function.children.class = /\b([A-Z]\w*)\b/;
848 | grammar.function.children.function = /(\w+)/;
849 | grammar.function.children.punctuation = /\(/;
850 |
851 | /**
852 | * Numbers.
853 | */
854 |
855 | grammar.number = /\b-?(0x[\dA-Fa-f]+|\d*\.?\d+([Ee]-?\d+)?|NaN|-?Infinity)\b/;
856 |
857 | /**
858 | * Operators.
859 | */
860 |
861 | grammar.operator = /([-+]{1,2}|!|<=?|>=?|={1,3}|<{1,2}|>{1,2}|(&){1,2}|\|{1,2}|\?|\*|\/|\~|\^|\%)/;
862 |
863 | /**
864 | * Punctuation.
865 | */
866 |
867 | grammar.punctuation = /[{}[\];(),.:]/;
868 | },{}],16:[function(require,module,exports){
869 |
870 | /**
871 | * Expose `java`
872 | */
873 |
874 | module.exports = java;
875 |
876 | /**
877 | * Add `java` as a language.
878 | *
879 | * @param {Highlight} highlight
880 | * @api public
881 | */
882 |
883 | function java(highlight){
884 | highlight.language('java', java);
885 | }
886 |
887 | /**
888 | * Boolean
889 | */
890 |
891 | java.boolean = /\b(true|false)\b/;
892 |
893 | /**
894 | * Comment
895 | */
896 |
897 | java.comment = /(?!\\{2})(\/\*[\w\W]*?\*\/|\/\/.*?$)/m;
898 |
899 | /**
900 | * Class
901 | */
902 |
903 | java.class = /class +(\w+)/;
904 | java.class.children = { keyword: /class/ };
905 |
906 | /**
907 | * Keywords
908 | */
909 |
910 | java.keyword = /\b(abstract|assert|boolean|break|byte|case|catch|char|class|const|continue|default|do|double|else|enum|extends|final|finally|float|for|goto|if|implements|import|instanceof|int|interface|long|native|new|package|protected|public|return|static|staticfp|super|switch|synchronized|this|throw|throws|transient|try|void|volatile|while)\b/;
911 |
912 | /**
913 | * Number
914 | */
915 |
916 | java.number = /\b[-+]?(0[bx][\da-f]+|\d*\.?\d+(e-?\d+)?)\b/;
917 |
918 | /**
919 | * String
920 | */
921 |
922 | java.string = /("(\\?.)*?")/;
923 |
924 | /**
925 | * Method
926 | */
927 |
928 | java.method = /(\w+) *\(/;
929 | java.method.children = { punctuation: /\(/ };
930 |
931 | /**
932 | * Operator
933 | */
934 |
935 | java.operator = /([-+]{1,2}|!|<=?|>=?|={1,3}|<{1,2}|>{1,2}|(&){1,2}|\|{1,2}|\?|\*|\/|\~|\^|\%)/;
936 |
937 | /**
938 | * Punctuation
939 | */
940 |
941 | java.punctuation = /[{}[\];(),.:]/;
942 | },{}],17:[function(require,module,exports){
943 |
944 | /**
945 | * Expose `plugin`.
946 | */
947 |
948 | module.exports = plugin;
949 |
950 | /**
951 | * Plugin to highlight Javascript code.
952 | *
953 | * @param {Highlight} highlight
954 | */
955 |
956 | function plugin(highlight){
957 | highlight
958 | .language('javascript', grammar)
959 | .language('js', grammar);
960 | }
961 |
962 | /**
963 | * Grammar.
964 | */
965 |
966 | var grammar = {};
967 |
968 | /**
969 | * Strings.
970 | */
971 |
972 | grammar.string = /(("|')(\\?.)*?\2)/;
973 |
974 | /**
975 | * Comments.
976 | */
977 |
978 | grammar.comment = /(?!\\{2})(\/\*[\w\W]*?\*\/|\/\/.*?$)/m;
979 |
980 | /**
981 | * Booleans.
982 | */
983 |
984 | grammar.boolean = /\b(true|false)\b/;
985 |
986 | /**
987 | * Keywords.
988 | */
989 |
990 | grammar.keyword = /\b(break|catch|continue|delete|do|else|finally|for|function|if|in|instanceof|let|new|null|return|this|self|throw|try|typeof|var|while|with|yield)\b/;
991 |
992 | /**
993 | * Constants.
994 | */
995 |
996 | grammar.constant = /\b(document|window|global)\b/;
997 |
998 | /**
999 | * Functions.
1000 | *
1001 | * Children are set separately to maintain ordering.
1002 | */
1003 |
1004 | grammar.function = {
1005 | pattern: /(\w+)\(/,
1006 | children: {}
1007 | };
1008 |
1009 | grammar.function.children.class = /\b([A-Z]\w*)\b/;
1010 | grammar.function.children.function = /(\w+)/;
1011 | grammar.function.children.punctuation = /\(/;
1012 |
1013 | /**
1014 | * Numbers.
1015 | */
1016 |
1017 | grammar.number = /\b-?(0x[\dA-Fa-f]+|\d*\.?\d+([Ee]-?\d+)?|NaN|-?Infinity)\b/;
1018 |
1019 | /**
1020 | * Operators.
1021 | */
1022 |
1023 | grammar.operator = /([-+]{1,2}|!|<=?|>=?|={1,3}|<{1,2}|>{1,2}|(&){1,2}|\|{1,2}|\?|\*|\/|\~|\^|\%)/;
1024 |
1025 | /**
1026 | * Punctuation.
1027 | */
1028 |
1029 | grammar.punctuation = /[{}[\];(),.:]/;
1030 | },{}],18:[function(require,module,exports){
1031 |
1032 | /**
1033 | * Expose `objectiveC`
1034 | */
1035 |
1036 | module.exports = objectiveC;
1037 |
1038 | /**
1039 | * Add `Objective-C` as a plugin.
1040 | *
1041 | * @param {Highlight} highlight
1042 | * @api public
1043 | */
1044 |
1045 | function objectiveC(highlight){
1046 | highlight
1047 | .language('objective-c', objectiveC)
1048 | .language('objc', objectiveC);
1049 | }
1050 |
1051 | /**
1052 | * Methods
1053 | */
1054 |
1055 | objectiveC.method = /\[\w+ (\w+)\]/;
1056 |
1057 | /**
1058 | * Booleans
1059 | */
1060 |
1061 | objectiveC.boolean = /\b(yes|no|true|false)\b/i;
1062 |
1063 | /**
1064 | * Comments
1065 | */
1066 |
1067 | objectiveC.comment = /(?!\\{2})(\/\*[\w\W]*?\*\/|\/\/.*?$)/m;
1068 |
1069 | /**
1070 | * Classes
1071 | */
1072 |
1073 | objectiveC.class = /@(implementation|interface|class) +(\w+)/;
1074 | objectiveC.class.children = { keyword: /@(implementation|interface|class)/ };
1075 |
1076 | /**
1077 | * Keywords
1078 | */
1079 |
1080 | objectiveC.keyword = /\b(void|char|short|int|long|float|double|signed|unsigned|id|const|volatile|in|out|inout|bycopy|byref|oneway|self|super)\b/;
1081 |
1082 | /**
1083 | * Numbers
1084 | */
1085 |
1086 | objectiveC.number = /\b@?[-+]?(0x[A-Fa-f0-9]+|\d+)\b/;
1087 |
1088 | /**
1089 | * Strings
1090 | */
1091 |
1092 | objectiveC.string = /(@?"(\\?.)*?")/;
1093 |
1094 | /**
1095 | * Operator
1096 | */
1097 |
1098 | objectiveC.operator = /([-+]{1,2}|!|<=?|>=?|={1,3}|<{1,2}|>{1,2}|(&){1,2}|\|{1,2}|\?|\*|\/|\~|\^|\%)/;
1099 |
1100 | /**
1101 | * Punctuation
1102 | */
1103 |
1104 | objectiveC.punctuation = /[{}[\];(),.:]/;
1105 | },{}],19:[function(require,module,exports){
1106 |
1107 | /**
1108 | * Expose `php`
1109 | */
1110 |
1111 | module.exports = php;
1112 |
1113 | /**
1114 | * Add `php` as a language.
1115 | *
1116 | * @param {Highlight} highlight
1117 | * @api public
1118 | */
1119 |
1120 | function php(highlight){
1121 | highlight.language('php', php);
1122 | highlight.language('PHP', php);
1123 | }
1124 |
1125 | /**
1126 | * Booleans
1127 | */
1128 |
1129 | php.boolean = /\b(true|false)\b/;
1130 |
1131 | /**
1132 | * Comments
1133 | */
1134 |
1135 | php.comment = /(?!\\{2})(\/\*[\w\W]*?\*\/|\/\/.*?$|#.*?$)/m;
1136 |
1137 | /**
1138 | * Classes
1139 | */
1140 |
1141 | php.class = /class +(\w+)/;
1142 | php.class.children = { keyword: /class/ };
1143 |
1144 | /**
1145 | * Keywords
1146 | */
1147 |
1148 | php.keyword = /\b(__halt_compiler|abstract|and|array|as|break|callable|case|catch|class|clone|const|continue|declare|default|die|do|echo|else|elseif|empty|enddeclare|endfor|endforeach|endif|endswitch|endwhile|eval|exit|extends|final|finally|for|foreach|function|global|goto|if|implements|include|include_once|instanceof|insteadof|interface|isset|list|namespace|new|or|print|private|protected|public|require|require_once|return|static|switch|throw|trait|try|unset|use|var|while|xor|yield)\b/;
1149 |
1150 | /**
1151 | * Numbers
1152 | */
1153 |
1154 | php.number = /\b[-+]?(0x[0-9a-fA-F]|0[0-7]+|0b[01]+|[1-9][0-9]*)\b/;
1155 |
1156 | /**
1157 | * String
1158 | */
1159 |
1160 | php.string = /(("|')(\\?.)*?\2)/;
1161 |
1162 | /**
1163 | * Functions
1164 | */
1165 |
1166 | php.function = /(\w+) *\(/;
1167 | php.function.children = { punctuation: /\(/ };
1168 |
1169 | /**
1170 | * Operators
1171 | */
1172 |
1173 | php.operator = /([-+]{1,2}|!|<=?|>=?|={1,3}|<{1,2}|>{1,2}|(&){1,2}|\|{1,2}|\?|\*|\/|\~|\^|\%)/;
1174 |
1175 | /**
1176 | * Punctuation
1177 | */
1178 |
1179 | php.punctuation = /[{}[\];(),.]/;
1180 | },{}],20:[function(require,module,exports){
1181 |
1182 | /**
1183 | * Expose `python`
1184 | */
1185 |
1186 | module.exports = python;
1187 |
1188 | /**
1189 | * Add `python` as a language.
1190 | *
1191 | * @param {Highlight} highlight
1192 | * @api public
1193 | */
1194 |
1195 | function python(highlight){
1196 | highlight.language('python', python);
1197 | }
1198 |
1199 | /**
1200 | * Comments
1201 | */
1202 |
1203 | python.comment = /(?!\\{2})(#.*?$)/m;
1204 |
1205 | /**
1206 | * Strings
1207 | */
1208 |
1209 | python.string = /(("""|"|')(\\?.)*?\2)/;
1210 |
1211 | /**
1212 | * Booleans
1213 | */
1214 |
1215 | python.boolean = /\b(True|False)\b/;
1216 |
1217 | /**
1218 | * Keywords
1219 | */
1220 |
1221 | python.keyword = /\b(and|as|assert|break|class|continue|def|del|elif|else|except|exec|finally|for|from|global|if|import|in|is|lambda|not|or|pass|print|raise|return|try|while|with|yield)\b/;
1222 |
1223 |
1224 | /**
1225 | * Classes
1226 | */
1227 |
1228 | python.class = /class +(\w+)/;
1229 | python.class.children = { keyword: /class/ };
1230 |
1231 | /**
1232 | * Functions
1233 | */
1234 |
1235 | python.function = /(\w+) *\(/;
1236 | python.function.children = { punctuation: /\(/ };
1237 | /**
1238 | * Numbers
1239 | */
1240 |
1241 | python.number = /\b[-+]?(0x[a-fA-F0-9]+|0b[0-1]+|0[0-7]+|[1-9][0-9]*)\b/;
1242 |
1243 | /**
1244 | * Operators
1245 | */
1246 |
1247 | python.operator = /([-+]{1,2}|!|<=?|>=?|={1,3}|<{1,2}|>{1,2}|(&){1,2}|\|{1,2}|\?|\*|\/|\~|\^|\%|\*\*?=)/;
1248 |
1249 | /**
1250 | * Punctuation
1251 | */
1252 |
1253 | python.punctuation = /[{}[\];(),.:]/;
1254 | },{}],21:[function(require,module,exports){
1255 |
1256 | /**
1257 | * Expose `ruby`
1258 | */
1259 |
1260 | module.exports = ruby;
1261 |
1262 | /**
1263 | * Add `ruby` as a language.
1264 | *
1265 | * @param {Highlight} highlight
1266 | * @api public
1267 | */
1268 |
1269 | function ruby(highlight){
1270 | highlight.language('ruby', ruby);
1271 | }
1272 |
1273 | /**
1274 | * Booleans
1275 | */
1276 |
1277 | ruby.boolean = /\b(true|false)\b/;
1278 |
1279 | /**
1280 | * Strings
1281 | */
1282 |
1283 | ruby.string = /(("|')(\\?.)*?\2)/;
1284 |
1285 | /**
1286 | * Comments
1287 | */
1288 |
1289 | ruby.comment = /(?!\\{2})(#.*?$)/m;
1290 |
1291 | /**
1292 | * Classes
1293 | */
1294 |
1295 | ruby.class = /class +(\w+)/;
1296 | ruby.class.children = { keyword: /class/ };
1297 |
1298 | /**
1299 | * Keywords
1300 | */
1301 |
1302 | ruby.keyword = /\b(alias|and|begin|break|case|catch|class|def|do|elsif|else|fail|ensure|for|end|if|in|module|next|not|or|raise|redo|rescue|retry|return|then|throw|super|unless|undef|until|when|while|yield)\b/;
1303 |
1304 | /**
1305 | * Numbers
1306 | */
1307 |
1308 | ruby.number = /\b[-+]?(0x[a-fA-F0-9]+|0b[0-1_]+|0[0-7]*|[1-9][0-9_eE.]*)\b/;
1309 |
1310 | /**
1311 | * Functions
1312 | */
1313 |
1314 | ruby.function = /(\w+) *\(/;
1315 | ruby.function.children = { punctuation: /\(/ };
1316 |
1317 | /**
1318 | * Operator
1319 | */
1320 |
1321 | ruby.operator = /([-+]{1,2}|!|<=?|>=?|={1,3}|<{1,2}|>{1,2}|(&){1,2}|\|{1,2}|\?|\*|\/|\~|\^|\%)/;
1322 |
1323 | /**
1324 | * Punctuation
1325 | */
1326 |
1327 | ruby.punctuation = /[{}[\];(),.:]/;
1328 |
1329 | },{}],22:[function(require,module,exports){
1330 |
1331 | /**
1332 | * Expose `plugin`.
1333 | */
1334 |
1335 | module.exports = plugin;
1336 |
1337 | /**
1338 | * Plugin to highlight XML code.
1339 | *
1340 | * @param {Highlight} highlight
1341 | */
1342 |
1343 | function plugin(highlight){
1344 | highlight
1345 | .language('xml', grammar)
1346 | .language('html', grammar);
1347 | }
1348 |
1349 | /**
1350 | * Grammar.
1351 | */
1352 |
1353 | var grammar = {};
1354 |
1355 | /**
1356 | * Comments.
1357 | */
1358 |
1359 | grammar.comment = //m;
1360 |
1361 | /**
1362 | * Entities.
1363 | */
1364 |
1365 | grammar.entity = /?[\dA-Za-z]{1,8};/;
1366 |
1367 | /**
1368 | * Doctypes.
1369 | */
1370 |
1371 | grammar.doctype = //i;
1372 |
1373 | /**
1374 | * CDATA.
1375 | */
1376 |
1377 | grammar.cdata = //i;
1378 |
1379 | /**
1380 | * Prologs.
1381 | */
1382 |
1383 | grammar.prolog = /<\?.+?\?>/;
1384 |
1385 | /**
1386 | * Tags. Children declared separately to maintain order.
1387 | */
1388 |
1389 | var children = {
1390 | string: /('|")[\w\W]*?\1/,
1391 | punctuation: /(^<\/?|\/?>$|=)/,
1392 | name: /^[\w:-]+/,
1393 | attribute: /[\w:-]+/
1394 | };
1395 |
1396 | grammar.tag = {
1397 | pattern: /<\/?[\w:-]+\s*(\s+[\w:-]+(=(("|')[\w\W]*\4|[^\s'">=]+))?\s*)*\/?>/,
1398 | children: children
1399 | };
1400 | },{}],23:[function(require,module,exports){
1401 |
1402 | /**
1403 | * Expose `yaml`
1404 | */
1405 |
1406 | module.exports = yaml;
1407 |
1408 | /**
1409 | * Add `yaml` as a language.
1410 | *
1411 | * @param {Highlight} highlight
1412 | * @api public
1413 | */
1414 |
1415 | function yaml(highlight){
1416 | highlight.language('yml', yaml);
1417 | highlight.language('yaml', yaml);
1418 | }
1419 |
1420 | /**
1421 | * Boolean
1422 | */
1423 |
1424 | yaml.boolean = /\b(Yes|No)\b/;
1425 |
1426 | /**
1427 | * Numbers
1428 | */
1429 |
1430 | yaml.number = /\b(\d*\.\d+)\b/;
1431 |
1432 | /**
1433 | * Comments
1434 | */
1435 |
1436 | yaml.comment = /(#[^\n]*)/;
1437 |
1438 | /**
1439 | * Keywords
1440 | */
1441 |
1442 | yaml.keyword = /(\w+):/;
1443 | yaml.keyword.children = { punctuation: /:/ };
1444 |
1445 | /**
1446 | * Punctuation
1447 | */
1448 |
1449 | yaml.punctuation = /([:|>?])/;
1450 |
1451 | /**
1452 | * Strings
1453 | */
1454 |
1455 | yaml.string = /(("|')(\\?.)*?\2)/;
1456 |
1457 | },{}],24:[function(require,module,exports){
1458 | module.exports = exports = require('./lib/sliced');
1459 |
1460 | },{"./lib/sliced":25}],25:[function(require,module,exports){
1461 |
1462 | /**
1463 | * An Array.prototype.slice.call(arguments) alternative
1464 | *
1465 | * @param {Object} args something with a length
1466 | * @param {Number} slice
1467 | * @param {Number} sliceEnd
1468 | * @api public
1469 | */
1470 |
1471 | module.exports = function (args, slice, sliceEnd) {
1472 | var ret = [];
1473 | var len = args.length;
1474 |
1475 | if (0 === len) return ret;
1476 |
1477 | var start = slice < 0
1478 | ? Math.max(0, slice + len)
1479 | : slice || 0;
1480 |
1481 | if (sliceEnd !== undefined) {
1482 | len = sliceEnd < 0
1483 | ? sliceEnd + len
1484 | : sliceEnd
1485 | }
1486 |
1487 | while (len-- > start) {
1488 | ret[len - start] = args[len];
1489 | }
1490 |
1491 | return ret;
1492 | }
1493 |
1494 |
1495 | },{}],26:[function(require,module,exports){
1496 |
1497 | var escape = require('escape-html');
1498 |
1499 | /**
1500 | * Expose `Highlight`.
1501 | */
1502 |
1503 | module.exports = Highlight;
1504 |
1505 | /**
1506 | * Initialize a new `Highlight` instance.
1507 | */
1508 |
1509 | function Highlight(){
1510 | if (!(this instanceof Highlight)) return new Highlight();
1511 | this.languages = {};
1512 | this.prefix('Highlight-');
1513 | }
1514 |
1515 | /**
1516 | * Use a `plugin` function.
1517 | *
1518 | * @param {Function} plugin
1519 | * @return {Highlight}
1520 | */
1521 |
1522 | Highlight.prototype.use = function(plugin){
1523 | plugin(this);
1524 | return this;
1525 | };
1526 |
1527 | /**
1528 | * Get or set the highlighted class `prefix`.
1529 | *
1530 | * @param {String} prefix
1531 | * @return {Highlight or String}
1532 | */
1533 |
1534 | Highlight.prototype.prefix = function(prefix){
1535 | if (!arguments.length) return this._prefix;
1536 | this._prefix = prefix;
1537 | return this;
1538 | }
1539 |
1540 | /**
1541 | * Define a new `language` with a `grammar`.
1542 | *
1543 | * @param {String} language
1544 | * @param {Object} grammar
1545 | * @return {Highlight}
1546 | */
1547 |
1548 | Highlight.prototype.language = function(language, grammar){
1549 | this.languages[language] = grammar;
1550 | return this;
1551 | };
1552 |
1553 | /**
1554 | * Highlight an HTML `string` of a given `language`.
1555 | *
1556 | * @param {String} string
1557 | * @param {String} language
1558 | * @return {String}
1559 | */
1560 |
1561 | Highlight.prototype.string = function(string, language){
1562 | var ast = this.parse(string, language);
1563 | var str = this.stringify(ast);
1564 | return str;
1565 | };
1566 |
1567 | /**
1568 | * Highlight an `el`, with optional `language`.
1569 | *
1570 | * @param {Element or String} el
1571 | * @param {String} language (optional)
1572 | */
1573 |
1574 | Highlight.prototype.element = function(el, language){
1575 | if ('string' == typeof el) el = document.querySelector(el);
1576 | var str = this.string(el.textContent, language || lang(el));
1577 | el.innerHTML = str;
1578 | };
1579 |
1580 | /**
1581 | * Highlight an array of `els`, with optional `language`.
1582 | *
1583 | * @param {Array or String} els
1584 | * @param {String} language (optional)
1585 | */
1586 |
1587 | Highlight.prototype.elements = function(els, language){
1588 | if ('string' == typeof els) els = document.querySelectorAll(els);
1589 | for (var i = 0, el; el = els[i]; i++) this.element(el, language);
1590 | };
1591 |
1592 | /**
1593 | * Highlight all elements in the DOM with language attributes.
1594 | */
1595 |
1596 | Highlight.prototype.all = function(){
1597 | this.elements('[data-language]');
1598 | this.elements('[class*="language-"]');
1599 | this.elements('[class*="lang-"]');
1600 | };
1601 |
1602 | /**
1603 | * Parse a `string` with a given language's `grammar`, returning an AST.
1604 | *
1605 | * @param {String} string
1606 | * @param {String or Object} grammar
1607 | * @return {Array}
1608 | */
1609 |
1610 | Highlight.prototype.parse = function(string, grammar){
1611 | if ('string' == typeof grammar) {
1612 | var lang = grammar;
1613 | grammar = this.languages[lang];
1614 | if (!grammar) throw new Error('unknown language "' + lang + '"');
1615 | }
1616 |
1617 | if (!grammar) throw new Error('must provide a grammar');
1618 | if (!string) return [];
1619 | var ret = [string];
1620 |
1621 | for (var key in grammar) {
1622 | if (!grammar.hasOwnProperty(key)) continue;
1623 |
1624 | var rule = grammar[key];
1625 | var regexp = rule.pattern || rule;
1626 |
1627 | for (var i = 0; i < ret.length; i++) {
1628 | var str = ret[i];
1629 | if ('object' == typeof str) continue;
1630 | var m = regexp.exec(str);
1631 | if (!m) continue;
1632 |
1633 | var contents = m[0];
1634 | var before = str.slice(0, m.index);
1635 | var after = str.slice(m.index + contents.length);
1636 | var args = [i, 1];
1637 | var token = {
1638 | type: key,
1639 | value: rule.children ? this.parse(contents, rule.children) : contents
1640 | };
1641 |
1642 | if (before) args.push(before);
1643 | args.push(token);
1644 | if (after) args.push(after);
1645 | ret.splice.apply(ret, args);
1646 | }
1647 | }
1648 |
1649 | return ret;
1650 | }
1651 |
1652 | /**
1653 | * Stringify a given `ast`.
1654 | *
1655 | * @param {Array} ast
1656 | * @return {String}
1657 | */
1658 |
1659 | Highlight.prototype.stringify = function(ast){
1660 | var prefix = this.prefix();
1661 | var self = this;
1662 |
1663 | return ast.map(function(t){
1664 | if ('string' == typeof t) return escape(t);
1665 | var type = t.type;
1666 | var value = 'object' == typeof t.value
1667 | ? self.stringify(t.value)
1668 | : escape(t.value);
1669 | return '' + value + '';
1670 | }).join('');
1671 | };
1672 |
1673 | /**
1674 | * Language class matcher.
1675 | */
1676 |
1677 | var matcher = /\blang(?:uage)?-([\w-.]+)\b/i;
1678 |
1679 | /**
1680 | * Get the code language for a given `el`. First look for a `data-language`
1681 | * attribute, then a `language-*` class, then search up the DOM tree for them.
1682 | *
1683 | * @param {Element} el
1684 | * @return {String}
1685 | */
1686 |
1687 | function lang(el){
1688 | if (!el) return;
1689 | var m;
1690 | if (el.hasAttribute('data-language')) return el.getAttribute('data-language');
1691 | if (m = matcher.exec(el.className)) return m[1];
1692 | return language(el.parentNode);
1693 | }
1694 |
1695 | },{"escape-html":27}],27:[function(require,module,exports){
1696 | /*!
1697 | * escape-html
1698 | * Copyright(c) 2012-2013 TJ Holowaychuk
1699 | * Copyright(c) 2015 Andreas Lubbe
1700 | * Copyright(c) 2015 Tiancheng "Timothy" Gu
1701 | * MIT Licensed
1702 | */
1703 |
1704 | 'use strict';
1705 |
1706 | /**
1707 | * Module variables.
1708 | * @private
1709 | */
1710 |
1711 | var matchHtmlRegExp = /["'&<>]/;
1712 |
1713 | /**
1714 | * Module exports.
1715 | * @public
1716 | */
1717 |
1718 | module.exports = escapeHtml;
1719 |
1720 | /**
1721 | * Escape special characters in the given string of html.
1722 | *
1723 | * @param {string} string The string to escape for inserting into HTML
1724 | * @return {string}
1725 | * @public
1726 | */
1727 |
1728 | function escapeHtml(string) {
1729 | var str = '' + string;
1730 | var match = matchHtmlRegExp.exec(str);
1731 |
1732 | if (!match) {
1733 | return str;
1734 | }
1735 |
1736 | var escape;
1737 | var html = '';
1738 | var index = 0;
1739 | var lastIndex = 0;
1740 |
1741 | for (index = match.index; index < str.length; index++) {
1742 | switch (str.charCodeAt(index)) {
1743 | case 34: // "
1744 | escape = '"';
1745 | break;
1746 | case 38: // &
1747 | escape = '&';
1748 | break;
1749 | case 39: // '
1750 | escape = ''';
1751 | break;
1752 | case 60: // <
1753 | escape = '<';
1754 | break;
1755 | case 62: // >
1756 | escape = '>';
1757 | break;
1758 | default:
1759 | continue;
1760 | }
1761 |
1762 | if (lastIndex !== index) {
1763 | html += str.substring(lastIndex, index);
1764 | }
1765 |
1766 | lastIndex = index + 1;
1767 | html += escape;
1768 | }
1769 |
1770 | return lastIndex !== index
1771 | ? html + str.substring(lastIndex, index)
1772 | : html;
1773 | }
1774 |
1775 | },{}],28:[function(require,module,exports){
1776 | /**
1777 | * Module dependencies.
1778 | */
1779 |
1780 | var slice = require('sliced')
1781 | var flatten = require('array-flatten')
1782 |
1783 | /**
1784 | * This function lets us create virtual nodes using a simple
1785 | * syntax. It is compatible with JSX transforms so you can use
1786 | * JSX to write nodes that will compile to this function.
1787 | *
1788 | * let node = element('div', { id: 'foo' }, [
1789 | * element('a', { href: 'http://google.com' }, 'Google')
1790 | * ])
1791 | *
1792 | * You can leave out the attributes or the children if either
1793 | * of them aren't needed and it will figure out what you're
1794 | * trying to do.
1795 | */
1796 |
1797 | module.exports = element
1798 |
1799 | /**
1800 | * Create virtual trees of components.
1801 | *
1802 | * This creates the nicer API for the user.
1803 | * It translates that friendly API into an actual tree of nodes.
1804 | *
1805 | * @param {*} type
1806 | * @param {Object} attributes
1807 | * @param {Array} children
1808 | * @return {Object}
1809 | * @api public
1810 | */
1811 |
1812 | function element (type, attributes, children) {
1813 | // Default to div with no args
1814 | if (!type) {
1815 | throw new TypeError('element() needs a type.')
1816 | }
1817 |
1818 | // Skipped adding attributes and we're passing
1819 | // in children instead.
1820 | if (arguments.length === 2 && (typeof attributes === 'string' || Array.isArray(attributes))) {
1821 | children = [ attributes ]
1822 | attributes = {}
1823 | }
1824 |
1825 | // Account for JSX putting the children as multiple arguments.
1826 | // This is essentially just the ES6 rest param
1827 | if (arguments.length > 2) {
1828 | children = slice(arguments, 2)
1829 | }
1830 |
1831 | children = children || []
1832 | attributes = attributes || {}
1833 |
1834 | // Flatten nested child arrays. This is how JSX compiles some nodes.
1835 | children = flatten(children, 2)
1836 |
1837 | // Filter out any `undefined` elements
1838 | children = children.filter(function (i) { return typeof i !== 'undefined' })
1839 |
1840 | // if you pass in a function, it's a `Component` constructor.
1841 | // otherwise it's an element.
1842 | return {
1843 | type: type,
1844 | children: children,
1845 | attributes: attributes
1846 | }
1847 | }
1848 |
1849 | },{"array-flatten":11,"sliced":24}]},{},[1]);
1850 |
--------------------------------------------------------------------------------
/examples/button.js:
--------------------------------------------------------------------------------
1 | import element from 'virtual-element';
2 | import { Button } from '../lib';
3 |
4 | /**
5 | * Button example.
6 | */
7 |
8 | export default {
9 | render() {
10 | return (
11 |
12 |
13 |
14 |
15 |
16 |
17 |
18 |
19 |
20 |
21 |
22 |
23 |
24 |
25 |
26 |
27 |
28 |
29 |
30 |
31 |
32 |
33 |
34 |
35 | );
36 | }
37 | };
38 |
--------------------------------------------------------------------------------
/examples/code.js:
--------------------------------------------------------------------------------
1 | import element from 'virtual-element';
2 | import { Code } from '../lib';
3 |
4 | /**
5 | * Code example.
6 | */
7 |
8 | export default {
9 | render() {
10 | return (
11 |
12 | {`
13 | var Git = require('gity');
14 |
15 | var git = Git()
16 | .add('*.js')
17 | .commit('-m "added js files"')
18 | .run();
19 | `}
20 |
21 | );
22 | }
23 | };
24 |
--------------------------------------------------------------------------------
/examples/index.js:
--------------------------------------------------------------------------------
1 | import element from 'virtual-element';
2 | import TextFieldExample from './text-field';
3 | import ButtonExample from './button';
4 | import TableExample from './table';
5 | import ShapeExample from './shape';
6 | import CodeExample from './code';
7 | import MenuExample from './menu';
8 |
9 | /**
10 | * Examples.
11 | */
12 |
13 | export default {
14 | Code: {
15 | component: ,
16 | code: '\n{\`\nvar Git = require(\'gity\');\n\nvar git = Git()\n .add(\'*.js\')\n .commit(\'-m \"added js files\"\')\n .run();\n\`}\n
'
17 | },
18 | Table: {
19 | component: ,
20 | code: "let people = [\n ['Full Name', 'Age'],\n ['Steven Miller', '25'],\n ['Tamara Jordan', '23'],\n ['John Smith', '28']\n];\n\n"
21 | },
22 | Menu: {
23 | component: ,
24 | code: "let sections = ['Home', 'Profile', 'Messages', 'Notifications'];\n\n"
25 | },
26 | TextField: {
27 | component: ,
28 | code: ""
29 | },
30 | Button: {
31 | component: ,
32 | code: "\n\n\n\n\n\n"
33 | },
34 | Shape: {
35 | component: ,
36 | code: '\n\n\n'
37 | },
38 | };
39 |
--------------------------------------------------------------------------------
/examples/menu.js:
--------------------------------------------------------------------------------
1 | import element from 'virtual-element';
2 | import { Menu } from '../lib';
3 |
4 | /**
5 | * Menu example.
6 | */
7 |
8 | export default {
9 | render() {
10 | let sections = ['Home', 'Profile', 'Messages', 'Notifications'];
11 |
12 | return ;
13 |
14 | function change(item) {
15 | // ...
16 | }
17 | }
18 | };
19 |
--------------------------------------------------------------------------------
/examples/shape.js:
--------------------------------------------------------------------------------
1 | import element from 'virtual-element';
2 | import { Grid, Shape } from '../lib';
3 |
4 | /**
5 | * Shape example.
6 | */
7 |
8 | export default {
9 | render() {
10 | return (
11 |
12 |
13 |
14 |
15 |
16 |
17 | );
18 | }
19 | };
20 |
--------------------------------------------------------------------------------
/examples/table.js:
--------------------------------------------------------------------------------
1 | import element from 'virtual-element';
2 | import { Table } from '../lib';
3 |
4 | /**
5 | * Table example.
6 | */
7 |
8 | export default {
9 | render() {
10 | let people = [
11 | ['Full Name', 'Age'],
12 | ['Steven Miller', '25'],
13 | ['Tamara Jordan', '23'],
14 | ['John Smith', '28']
15 | ];
16 |
17 | return ;
18 | }
19 | };
20 |
--------------------------------------------------------------------------------
/examples/text-field.js:
--------------------------------------------------------------------------------
1 | import element from 'virtual-element';
2 | import { TextField } from '../lib';
3 |
4 | /**
5 | * TextField example.
6 | */
7 |
8 | export default {
9 | render() {
10 | return ;
11 | }
12 | };
13 |
--------------------------------------------------------------------------------
/index.css:
--------------------------------------------------------------------------------
1 | @import './lib';
2 |
--------------------------------------------------------------------------------
/index.js:
--------------------------------------------------------------------------------
1 | import {
2 | TextField,
3 | Checkbox,
4 | Button,
5 | Shape,
6 | Table,
7 | Grid,
8 | Code,
9 | Menu
10 | } from './lib';
11 |
12 | export {
13 | TextField,
14 | Checkbox,
15 | Button,
16 | Shape,
17 | Table,
18 | Grid,
19 | Code,
20 | Menu
21 | };
22 |
--------------------------------------------------------------------------------
/lib/button/index.css:
--------------------------------------------------------------------------------
1 |
2 | /**
3 | * Button.
4 | */
5 |
6 | .matter-Button {
7 | background-color: var(--matter-color-wind);
8 | text-transform: uppercase;
9 | display: inline-block;
10 | transition: all 200ms;
11 | text-decoration: none;
12 | border-radius: 3px;
13 | line-height: 16px;
14 | color: white;
15 | padding: 0;
16 | border: 0;
17 | margin: 0;
18 | }
19 |
20 | .matter-Button:hover,
21 | .matter-Button:focus,
22 | .matter-Button:active {
23 | background-color: color(var(--matter-color-wind) tint(20%));
24 | cursor: pointer;
25 | color: white;
26 | }
27 |
28 | .matter-Button:focus,
29 | .matter-Button:active {
30 | box-shadow: 0px 0px 3px 1px color(var(--matter-color-wind) alpha(0.5));
31 | outline: none;
32 | }
33 |
34 | /**
35 | * Sizes
36 | */
37 |
38 | .matter-Button[size="small"] {
39 | font-size: var(--matter-font-small);
40 | font-weight: var(--matter-weight-light);
41 | padding: 7px 13px;
42 | }
43 |
44 | .matter-Button[size="medium"] {
45 | font-size: var(--matter-font-medium);
46 | font-weight: var(--matter-weight-light);
47 | padding: 9px 17px;
48 | }
49 |
50 | .matter-Button[size="large"] {
51 | font-size: var(--matter-font-large);
52 | font-weight: var(--matter-weight-light);
53 | padding: 13px 33px;
54 | }
55 |
56 | /**
57 | * Types.
58 | */
59 |
60 | .matter-Button[type="primary"] {
61 | background: white;
62 | color: black;
63 | box-shadow: 0px 0px 0px 1px color(black alpha(0.2));
64 | }
65 |
66 | .matter-Button[type="primary"]:hover,
67 | .matter-Button[type="primary"]:focus,
68 | .matter-Button[type="primary"]:active {
69 | background-color: color(black tint(95%));
70 | }
71 |
72 | .matter-Button[type="primary"]:focus,
73 | .matter-Button[type="primary"]:active {
74 | box-shadow: 0px 0px 3px 1px color(black alpha(0.5));
75 | outline: none;
76 | }
77 |
78 | .matter-Button[type="warning"] {
79 | background: var(--matter-color-fire);
80 | }
81 |
82 | .matter-Button[type="warning"]:hover,
83 | .matter-Button[type="warning"]:focus,
84 | .matter-Button[type="warning"]:active {
85 | background-color: color(var(--matter-color-fire) tint(20%));
86 | }
87 |
88 | .matter-Button[type="warning"]:focus,
89 | .matter-Button[type="warning"]:active {
90 | box-shadow: 0px 0px 3px 1px color(var(--matter-color-fire) alpha(0.5));
91 | }
92 |
--------------------------------------------------------------------------------
/lib/button/index.js:
--------------------------------------------------------------------------------
1 | /** @jsx element */
2 | import element from 'virtual-element';
3 |
4 | /**
5 | * Button.
6 | */
7 |
8 | export default {
9 | propTypes: {
10 | type: { type: 'string', expects: ['primary', 'secondary', 'warning'] },
11 | size: { type: 'string', expects: ['small', 'medium', 'large'] },
12 | onClick: { type: 'function' },
13 | label: { type: 'string' }
14 | },
15 |
16 | render({ props }) {
17 | let { label, size, type, onClick } = props;
18 |
19 | let attrs = {
20 | type: type || 'primary',
21 | size: size || 'medium',
22 | class: 'matter-Button',
23 | onClick: onClick
24 | };
25 |
26 | return (
27 |
30 | );
31 | }
32 | };
33 |
--------------------------------------------------------------------------------
/lib/checkbox/checkbox.svg:
--------------------------------------------------------------------------------
1 |
2 |
--------------------------------------------------------------------------------
/lib/checkbox/index.css:
--------------------------------------------------------------------------------
1 |
2 | /**
3 | * Checkbox.
4 | */
5 |
6 | .matter-Checkbox {
7 | background: white no-repeat center;
8 | -webkit-appearance: none;
9 | border: 1px solid #7a807b;
10 | vertical-align: middle;
11 | border-radius: 2px;
12 | margin-right: 4px;
13 | appearance: none;
14 | cursor: pointer;
15 | height: 20px;
16 | width: 20px;
17 | }
18 |
19 | .matter-Checkbox:hover {
20 | border-color: #5bdb7b;
21 | }
22 |
23 | .matter-Checkbox:checked {
24 | background-image: url(./checkbox.svg);
25 | background-color: #5bdb7b;
26 | background-size: cover;
27 | border-color: #5bdb7b;
28 | }
29 |
30 | .matter-Checkbox:focus {
31 | outline: 0;
32 | }
33 |
34 | /**
35 | * Sizes
36 | */
37 |
38 | .matter-Checkbox[size="small"] {
39 | height: 20px;
40 | width: 20px;
41 | }
42 |
43 | .matter-Checkbox[size="medium"] {
44 | height: 50px;
45 | width: 50px;
46 | }
47 |
48 | .matter-Checkbox[size="large"] {
49 | height: 75px;
50 | width: 75px;
51 | }
52 |
--------------------------------------------------------------------------------
/lib/checkbox/index.js:
--------------------------------------------------------------------------------
1 | /** @jsx element */
2 | import element from 'virtual-element';
3 |
4 | /**
5 | * Checkbox.
6 | */
7 |
8 | export default {
9 | propTypes: {
10 | size: { type: 'string', expects: ['small', 'medium', 'large'] },
11 | onClick: { type: 'function' },
12 | checked: { type: 'boolean' }
13 | },
14 |
15 | render({ props }) {
16 | let { size, checked, onClick } = props;
17 |
18 | let attrs = {
19 | class: 'matter-Checkbox',
20 | size: size || 'medium',
21 | onClick: onClick,
22 | checked: checked,
23 | type: 'checkbox'
24 | };
25 |
26 | return ;
27 | }
28 | };
29 |
--------------------------------------------------------------------------------
/lib/code/index.css:
--------------------------------------------------------------------------------
1 |
2 | /**
3 | * Code.
4 | */
5 |
6 | .matter-Code {
7 | box-shadow: rgba(0, 0, 0, 0.117647) 0px 1px 6px, rgba(0, 0, 0, 0.239216) 0px 1px 4px;
8 | background: #FFFDFB;
9 | line-height: 17px;
10 | overflow: scroll;
11 | white-space: pre;
12 | font-size: 12px;
13 | padding: 20px;
14 | color: #000;
15 | }
16 |
17 | .Highlight-at-rule,
18 | .Highlight-keyword,
19 | .Highlight-function {
20 | color: var(--matter-color-earth);
21 | }
22 |
23 | .Highlight-class {
24 | color: var( --matter-color-fire);
25 | }
26 |
27 | .Highlight-constant {
28 | color: var(--matter-color-water);
29 | }
30 |
31 | .Highlight-boolean,
32 | .Highlight-number {
33 | color: #6c71c4;
34 | }
35 |
36 | .Highlight-string {
37 | color: var(--matter-color-wind);
38 | }
39 |
40 | .Highlight-comment {
41 | color: var(--matter-color-brown-lightest);
42 | opacity: 0.5;
43 | }
44 |
45 | .Highlight-punctuation,
46 | .Highlight-operator {
47 | color: var(--matter-color-brown-lightest);
48 | }
49 |
50 | .Highlight-attribute,
51 | .Highlight-name {
52 | color: var(--matter-color-grey-darker);
53 | }
54 |
--------------------------------------------------------------------------------
/lib/code/index.js:
--------------------------------------------------------------------------------
1 | /** @jsx element */
2 | import element from 'virtual-element';
3 | import Highlight from 'syntax-highlighter';
4 |
5 | /**
6 | * Languages.
7 | */
8 |
9 | import objc from 'highlight-objective-c';
10 | import js from 'highlight-javascript';
11 | import csharp from 'highlight-csharp';
12 | import python from 'highlight-python';
13 | import java from 'highlight-java';
14 | import bash from 'highlight-bash';
15 | import ruby from 'highlight-ruby';
16 | import yaml from 'highlight-yaml';
17 | import xml from 'highlight-xml';
18 | import php from 'highlight-php';
19 | import css from 'highlight-css';
20 | import go from 'highlight-go';
21 |
22 | /**
23 | * Highlight.
24 | */
25 |
26 | let highlight = new Highlight()
27 | .use(python)
28 | .use(csharp)
29 | .use(yaml)
30 | .use(java)
31 | .use(ruby)
32 | .use(bash)
33 | .use(objc)
34 | .use(xml)
35 | .use(css)
36 | .use(php)
37 | .use(js)
38 | .use(go);
39 |
40 | /**
41 | * Code.
42 | */
43 |
44 | export default {
45 | propTypes: {
46 | language: { type: 'string' }
47 | },
48 |
49 | render({ props }) {
50 | let { language, children } = props;
51 |
52 | let unformattedCode = children[0];
53 | let formattedCode = highlight.string(unformattedCode, language);
54 |
55 | return (
56 |
57 |
58 |
59 |
60 | );
61 | }
62 | };
63 |
--------------------------------------------------------------------------------
/lib/colors/index.css:
--------------------------------------------------------------------------------
1 |
2 | /**
3 | * Core.
4 | */
5 |
6 | :root {
7 | --matter-color-water: #47b2fa;
8 | --matter-color-earth: #5bdb7b;
9 | --matter-color-wind: #2ec2e6;
10 | --matter-color-fire: #ff5b3f;
11 | }
12 |
13 | /**
14 | * Red.
15 | */
16 |
17 | :root {
18 | --matter-color-red: #F44336;
19 | --matter-color-red-light: #EF5350;
20 | --matter-color-red-lighter: #E57373;
21 | --matter-color-red-lightest: #EF9A9A;
22 | --matter-color-red-dark: #E53935;
23 | --matter-color-red-darker: #D32F2F;
24 | --matter-color-red-darkest: #C62828;
25 | }
26 |
27 | /**
28 | * Pink.
29 | */
30 |
31 | :root {
32 | --matter-color-pink: #E91E63;
33 | --matter-color-pink-light: #EC407A;
34 | --matter-color-pink-lighter: #F06292;
35 | --matter-color-pink-lightest: #F48FB1;
36 | --matter-color-pink-dark: #D81B60;
37 | --matter-color-pink-darker: #C2185B;
38 | --matter-color-pink-darkest: #AD1457;
39 | }
40 |
41 | /**
42 | * Purple.
43 | */
44 |
45 | :root {
46 | --matter-color-purple: #9C27B0;
47 | --matter-color-purple-light: #AB47BC;
48 | --matter-color-purple-lighter: #BA68C8;
49 | --matter-color-purple-lightest: #CE93D8;
50 | --matter-color-purple-dark: #8E24AA;
51 | --matter-color-purple-darker: #7B1FA2;
52 | --matter-color-purple-darkest: #6A1B9A;
53 | }
54 |
55 | /**
56 | * Blue.
57 | */
58 |
59 | :root {
60 | --matter-color-blue: #2196F3;
61 | --matter-color-blue-light: #42A5F5;
62 | --matter-color-blue-lighter: #64B5F6;
63 | --matter-color-blue-lightest: #90CAF9;
64 | --matter-color-blue-dark: #1E88E5;
65 | --matter-color-blue-darker: #1976D2;
66 | --matter-color-blue-darkest: #1565C0;
67 | }
68 |
69 | /**
70 | * Green.
71 | */
72 |
73 | :root {
74 | --matter-color-green: #4CAF50;
75 | --matter-color-green-light: #66BB6A;
76 | --matter-color-green-lighter: #81C784;
77 | --matter-color-green-lightest: #A5D6A7;
78 | --matter-color-green-dark: #43A047;
79 | --matter-color-green-darker: #388E3C;
80 | --matter-color-green-darkest: #2E7D32;
81 | }
82 |
83 | /**
84 | * Yellow.
85 | */
86 |
87 | :root {
88 | --matter-color-yellow: #FFEB3B;
89 | --matter-color-yellow-light: #FFEE58;
90 | --matter-color-yellow-lighter: #FFF176;
91 | --matter-color-yellow-lightest: #FFF59D;
92 | --matter-color-yellow-dark: #FDD835;
93 | --matter-color-yellow-darker: #FBC02D;
94 | --matter-color-yellow-darkest: #F9A825;
95 | }
96 |
97 | /**
98 | * Orange.
99 | */
100 |
101 | :root {
102 | --matter-color-orange: #FF9800;
103 | --matter-color-orange-light: #FFA726;
104 | --matter-color-orange-lighter: #FFB74D;
105 | --matter-color-orange-lightest: #FFCC80;
106 | --matter-color-orange-dark: #FB8C00;
107 | --matter-color-orange-darker: #F57C00;
108 | --matter-color-orange-darkest: #EF6C00;
109 | }
110 |
111 | /**
112 | * Brown.
113 | */
114 |
115 | :root {
116 | --matter-color-brown: #795548;
117 | --matter-color-brown-light: #8D6E63;
118 | --matter-color-brown-lighter: #A1887F;
119 | --matter-color-brown-lightest: #BCAAA4;
120 | --matter-color-brown-dark: #6D4C41;
121 | --matter-color-brown-darker: #5D4037;
122 | --matter-color-brown-darkest: #4E342E;
123 | }
124 |
125 | /**
126 | * Grey.
127 | */
128 |
129 | :root {
130 | --matter-color-grey: #9E9E9E;
131 | --matter-color-grey-light: #BDBDBD;
132 | --matter-color-grey-lighter: #E0E0E0;
133 | --matter-color-grey-lightest: #EEEEEE;
134 | --matter-color-grey-dark: #757575;
135 | --matter-color-grey-darker: #616161;
136 | --matter-color-grey-darkest: #424242;
137 | }
138 |
--------------------------------------------------------------------------------
/lib/grid/index.css:
--------------------------------------------------------------------------------
1 |
2 | /**
3 | * Grid.
4 | */
5 |
6 | .matter-Grid {
7 | flex-flow: row wrap;
8 | display: flex;
9 | }
10 |
--------------------------------------------------------------------------------
/lib/grid/index.js:
--------------------------------------------------------------------------------
1 | /** @jsx element */
2 | import element from 'virtual-element';
3 |
4 | /**
5 | * Grid.
6 | */
7 |
8 | export default {
9 | render({ props }) {
10 | return (
11 |
12 | { props.children }
13 |
14 | );
15 | }
16 | };
17 |
--------------------------------------------------------------------------------
/lib/index.css:
--------------------------------------------------------------------------------
1 | @import './text-field';
2 | @import './typography';
3 | @import './checkbox';
4 | @import './colors';
5 | @import './button';
6 | @import './shape';
7 | @import './table';
8 | @import './theme';
9 | @import './grid';
10 | @import './menu';
11 | @import './code';
12 |
--------------------------------------------------------------------------------
/lib/index.js:
--------------------------------------------------------------------------------
1 | import TextField from './text-field';
2 | import Checkbox from './checkbox';
3 | import Button from './button';
4 | import Shape from './shape';
5 | import Table from './table';
6 | import Grid from './grid';
7 | import Code from './code';
8 | import Menu from './menu';
9 |
10 | export {
11 | TextField,
12 | Checkbox,
13 | Button,
14 | Shape,
15 | Table,
16 | Grid,
17 | Code,
18 | Menu
19 | };
20 |
--------------------------------------------------------------------------------
/lib/menu/index.css:
--------------------------------------------------------------------------------
1 |
2 | /**
3 | * Menu.
4 | */
5 |
6 | .matter-Menu {
7 | box-shadow: color(black alpha(0.117647)) 0px 1px 6px, color(black alpha(0.239216)) 0px 1px 4px;
8 | min-width: min-content;
9 | flex-direction: column;
10 | display: flex;
11 | background: #FFF;
12 | }
13 |
14 | .matter-Menu-item {
15 | padding: 0px 50px 0px 25px;
16 | margin-bottom: 7px;
17 | line-height: 40px;
18 | text-align: left;
19 | font-size: 14px;
20 | color: #000;
21 | }
22 |
23 | .matter-Menu-item:hover {
24 | background: rgba(0, 0, 0, 0.0313726);
25 | cursor: pointer;
26 | }
27 |
28 | .matter-Menu-item[active] {
29 | background: rgba(0, 0, 0, 0.0313726);
30 | }
31 |
32 | .matter-Menu-item:first-child {
33 | margin-top: 7px;
34 | }
35 |
--------------------------------------------------------------------------------
/lib/menu/index.js:
--------------------------------------------------------------------------------
1 | /** @jsx element */
2 | import element from 'virtual-element';
3 |
4 | /**
5 | * Menu.
6 | */
7 |
8 | export default {
9 | propTypes: {
10 | onChange: { type: 'function' },
11 | items: { type: 'array' }
12 | },
13 |
14 | render({ props, state }, updateState) {
15 | let { items, onChange, defaultActive } = props;
16 | let { activeItem } = state;
17 |
18 | let currentItem = activeItem || defaultActive || items[0];
19 |
20 | let menuItems = items.map(function(item) {
21 | return (
22 |
25 | );
26 |
27 | function onClick() {
28 | updateState({ activeItem: item });
29 | if (onChange) onChange(item);
30 | }
31 | });
32 |
33 | return (
34 |
37 | );
38 | }
39 | };
40 |
--------------------------------------------------------------------------------
/lib/shape/index.css:
--------------------------------------------------------------------------------
1 |
2 |
3 | /**
4 | * Shape.
5 | */
6 |
7 | .matter-Shape {
8 | box-sizing: border-box;
9 | }
10 |
11 | /**
12 | * Space.
13 | */
14 |
15 | .matter-Shape[space="small"] {
16 | margin: 13px;
17 | }
18 |
19 | .matter-Shape[space="medium"] {
20 | margin: 23px;
21 | }
22 |
23 | .matter-Shape[space="large"] {
24 | margin: 33px;
25 | }
26 |
27 | /**
28 | * Kinds/sizes.
29 | */
30 |
31 | .matter-Shape[kind="square"][color="earth"] {
32 | background-color: var(--matter-color-earth);
33 | }
34 |
35 | .matter-Shape[kind="square"][color="water"] {
36 | background-color: var(--matter-color-water);
37 | }
38 |
39 | .matter-Shape[kind="square"][color="wind"] {
40 | background-color: var(--matter-color-wind);
41 | }
42 |
43 | .matter-Shape[kind="square"][color="fire"] {
44 | background-color: var(--matter-color-fire);
45 | }
46 |
47 | .matter-Shape[kind="square"][size="small"] {
48 | height: 6.25vw;
49 | width: 6.25vw;
50 | }
51 |
52 | .matter-Shape[kind="square"][size="medium"] {
53 | height: 12.5vw;
54 | width: 12.5vw;
55 | }
56 |
57 | .matter-Shape[kind="square"][size="large"] {
58 | height: 25vw;
59 | width: 25vw;
60 | }
61 |
62 | .matter-Shape[kind="rectangle"][color="earth"] {
63 | background-color: var(--matter-color-earth);
64 | }
65 |
66 | .matter-Shape[kind="rectangle"][color="water"] {
67 | background-color: var(--matter-color-water);
68 | }
69 |
70 | .matter-Shape[kind="rectangle"][color="wind"] {
71 | background-color: var(--matter-color-wind);
72 | }
73 |
74 | .matter-Shape[kind="rectangle"][color="fire"] {
75 | background-color: var(--matter-color-fire);
76 | }
77 |
78 | .matter-Shape[kind="rectangle"][size="small"] {
79 | height: 6.25vw;
80 | width: 10.5vw;
81 | }
82 |
83 | .matter-Shape[kind="rectangle"][size="medium"] {
84 | height: 12.5vw;
85 | width: 25vw;
86 | }
87 |
88 | .matter-Shape[kind="rectangle"][size="large"] {
89 | height: 25vw;
90 | width: 50vw;
91 | }
92 |
93 | .matter-Shape[kind="circle"][color="earth"] {
94 | background-color: var(--matter-color-earth);
95 | }
96 |
97 | .matter-Shape[kind="circle"][color="water"] {
98 | background-color: var(--matter-color-water);
99 | }
100 |
101 | .matter-Shape[kind="circle"][color="wind"] {
102 | background-color: var(--matter-color-wind);
103 | }
104 |
105 | .matter-Shape[kind="circle"][color="fire"] {
106 | background-color: var(--matter-color-fire);
107 | }
108 |
109 | .matter-Shape[kind="circle"][size="small"] {
110 | height: 6.25vw;
111 | width: 6.25vw;
112 | border-radius: 3.125vw;
113 | }
114 |
115 | .matter-Shape[kind="circle"][size="medium"] {
116 | height: 12.5vw;
117 | width: 12.5vw;
118 | border-radius: 25vw;
119 | }
120 |
121 | .matter-Shape[kind="circle"][size="large"] {
122 | height: 25vw;
123 | width: 25vw;
124 | border-radius: 50vw;
125 | }
126 |
127 | .matter-Shape[kind="triangle"][size="small"][color="earth"] {
128 | width: 0;
129 | height: 0;
130 | border-left: 4.25vw solid transparent;
131 | border-right: 4.25vw solid transparent;
132 | border-bottom: 6.25vw solid var(--matter-color-earth);
133 | }
134 |
135 | .matter-Shape[kind="triangle"][size="medium"][color="earth"] {
136 | width: 0;
137 | height: 0;
138 | border-left: 8.5vw solid transparent;
139 | border-right: 8.5vw solid transparent;
140 | border-bottom: 12.495vw solid var(--matter-color-earth);
141 | }
142 |
143 | .matter-Shape[kind="triangle"][size="large"][color="earth"] {
144 | width: 0;
145 | height: 0;
146 | border-left: 17vw solid transparent;
147 | border-right: 17vw solid transparent;
148 | border-bottom: 24.99vw solid var(--matter-color-earth);
149 | }
150 |
151 | .matter-Shape[kind="triangle"][size="small"][color="water"] {
152 | width: 0;
153 | height: 0;
154 | border-left: 4.25vw solid transparent;
155 | border-right: 4.25vw solid transparent;
156 | border-bottom: 6.25vw solid var(--matter-color-water);
157 | }
158 |
159 | .matter-Shape[kind="triangle"][size="medium"][color="water"] {
160 | width: 0;
161 | height: 0;
162 | border-left: 8.5vw solid transparent;
163 | border-right: 8.5vw solid transparent;
164 | border-bottom: 12.495vw solid var(--matter-color-water);
165 | }
166 |
167 | .matter-Shape[kind="triangle"][size="large"][color="water"] {
168 | width: 0;
169 | height: 0;
170 | border-left: 17vw solid transparent;
171 | border-right: 17vw solid transparent;
172 | border-bottom: 24.99vw solid var(--matter-color-water);
173 | }
174 |
175 | .matter-Shape[kind="triangle"][size="small"][color="fire"] {
176 | width: 0;
177 | height: 0;
178 | border-left: 4.25vw solid transparent;
179 | border-right: 4.25vw solid transparent;
180 | border-bottom: 6.25vw solid var(--matter-color-fire);
181 | }
182 |
183 | .matter-Shape[kind="triangle"][size="medium"][color="fire"] {
184 | width: 0;
185 | height: 0;
186 | border-left: 8.5vw solid transparent;
187 | border-right: 8.5vw solid transparent;
188 | border-bottom: 12.495vw solid var(--matter-color-fire);
189 | }
190 |
191 | .matter-Shape[kind="triangle"][size="large"][color="fire"] {
192 | width: 0;
193 | height: 0;
194 | border-left: 17vw solid transparent;
195 | border-right: 17vw solid transparent;
196 | border-bottom: 24.99vw solid var(--matter-color-fire);
197 | }
198 |
199 | .matter-Shape[kind="triangle"][size="small"][color="wind"] {
200 | width: 0;
201 | height: 0;
202 | border-left: 4.25vw solid transparent;
203 | border-right: 4.25vw solid transparent;
204 | border-bottom: 6.25vw solid var(--matter-color-wind);
205 | }
206 |
207 | .matter-Shape[kind="triangle"][size="medium"][color="wind"] {
208 | width: 0;
209 | height: 0;
210 | border-left: 8.5vw solid transparent;
211 | border-right: 8.5vw solid transparent;
212 | border-bottom: 12.495vw solid var(--matter-color-wind);
213 | }
214 |
215 | .matter-Shape[kind="triangle"][size="large"][color="wind"] {
216 | width: 0;
217 | height: 0;
218 | border-left: 17vw solid transparent;
219 | border-right: 17vw solid transparent;
220 | border-bottom: 24.99vw solid var(--matter-color-wind);
221 | }
222 |
--------------------------------------------------------------------------------
/lib/shape/index.js:
--------------------------------------------------------------------------------
1 | /** @jsx element */
2 | import element from 'virtual-element';
3 |
4 | /**
5 | * Shape.
6 | */
7 |
8 | export default {
9 | propTypes: {
10 | color: { type: 'string' },
11 | space: { type: 'string' },
12 | kind: { type: 'string' },
13 | size: { type: 'string' }
14 | },
15 |
16 | render({ props, state }, updateState) {
17 | let { children, color, space, kind, size } = props;
18 |
19 | let attrs = {
20 | class: 'matter-Shape',
21 | kind: kind || 'rectangle',
22 | space: space || 'medium',
23 | size: size || 'medium',
24 | color: color,
25 | };
26 |
27 | return (
28 |
29 | { children }
30 |
31 | );
32 | }
33 | };
34 |
--------------------------------------------------------------------------------
/lib/table/index.css:
--------------------------------------------------------------------------------
1 |
2 | /**
3 | * Menu.
4 | */
5 |
6 | .matter-Table {
7 | font-size: var(--matter-font-medium);
8 | border-collapse: collapse;
9 | background-color: #fff;
10 | table-layout: auto;
11 | color: #000;
12 | }
13 |
14 | .matter-Table-row {
15 | vertical-align: middle;
16 | line-height: 24px;
17 | }
18 |
19 | .matter-Table-row:first-child {
20 | background-color: #FAFAFA;
21 | color: #757575;
22 | }
23 |
24 | .matter-Table-cell {
25 | padding: 12px 12px 12px 24px;
26 | border: 1px solid #eee;
27 | line-height: 24px;
28 | }
29 |
--------------------------------------------------------------------------------
/lib/table/index.js:
--------------------------------------------------------------------------------
1 | /** @jsx element */
2 | import element from 'virtual-element';
3 |
4 | /**
5 | * Table.
6 | */
7 |
8 | export default {
9 | propTypes: {
10 | rows: { type: 'array' }
11 | },
12 |
13 | render({ props, state }, setState) {
14 | let { rows } = props;
15 |
16 | let tableRows = rows.map(function(row) {
17 | let rowCells = row.map(function(cell) {
18 | return (
19 |
20 | { cell }
21 | |
22 | );
23 | });
24 |
25 | return (
26 |
27 | { rowCells }
28 |
29 | );
30 | });
31 |
32 | return (
33 |
34 |
35 | { tableRows }
36 |
37 |
38 | );
39 | }
40 | };
41 |
--------------------------------------------------------------------------------
/lib/text-field/index.css:
--------------------------------------------------------------------------------
1 |
2 | /**
3 | * TextField.
4 | */
5 |
6 | .matter-TextField {
7 | border: none;
8 | outline: none;
9 | border-bottom: 1px solid #D3D3D3;
10 | padding: 7px 9px 7px 2px;
11 | background: transparent;
12 | font-size: 15px;
13 | }
14 |
--------------------------------------------------------------------------------
/lib/text-field/index.js:
--------------------------------------------------------------------------------
1 | /** @jsx element */
2 | import element from 'virtual-element';
3 |
4 | /**
5 | * TextField.
6 | */
7 |
8 | export default {
9 | propTypes: {
10 | placeholder: { type: 'string' }
11 | },
12 |
13 | render({ props, state }) {
14 | let { placeholder } = props;
15 |
16 | let attrs = {
17 | class: 'matter-TextField',
18 | placeholder: placeholder
19 | };
20 |
21 | return (
22 |
23 |
24 | );
25 | }
26 | };
27 |
--------------------------------------------------------------------------------
/lib/theme/index.css:
--------------------------------------------------------------------------------
1 |
2 | /**
3 | * Theme.
4 | */
5 |
6 | :root {
7 | font-family: var(--matter-font-classic);
8 | -webkit-font-smoothing: antialiased;
9 | }
10 |
--------------------------------------------------------------------------------
/lib/typography/index.css:
--------------------------------------------------------------------------------
1 |
2 | /**
3 | * Typefaces.
4 | */
5 |
6 | @import './san-francisco-display';
7 | @import './san-francisco-text';
8 |
9 | /**
10 | * Fonts.
11 | */
12 |
13 | :root {
14 | --matter-font-modern: 'San Francisco Display', 'Verdana', 'Geneva', sans-serif;
15 | --matter-font-classic: 'San Francisco Text', 'Verdana', 'Geneva', sans-serif;
16 | --matter-font-small: 11px;
17 | --matter-font-medium: 13px;
18 | --matter-font-large: 15px;
19 | }
20 |
21 | /**
22 | * Weights.
23 | */
24 |
25 | :root {
26 | --matter-weight-light: 300;
27 | --matter-weight-normal: 400;
28 | --matter-weight-heavy: 500;
29 | }
30 |
--------------------------------------------------------------------------------
/lib/typography/san-francisco-display/index.css:
--------------------------------------------------------------------------------
1 |
2 | /**
3 | * San Francisco Display.
4 | */
5 |
6 | @font-face {
7 | font-family: 'San Francisco Display';
8 | src: url('./sanfranciscodisplay-ultralight-webfont.eot');
9 | src: url('./sanfranciscodisplay-ultralight-webfont.eot?#iefix') format('embedded-opentype'),
10 | url('./sanfranciscodisplay-ultralight-webfont.woff2') format('woff2'),
11 | url('./sanfranciscodisplay-ultralight-webfont.woff') format('woff'),
12 | url('./sanfranciscodisplay-ultralight-webfont.ttf') format('truetype'),
13 | url('./sanfranciscodisplay-ultralight-webfont.svg#San Francisco Display ultraLt') format('svg');
14 | font-weight: 100;
15 | font-style: normal;
16 | }
17 |
18 | @font-face {
19 | font-family: 'San Francisco Display';
20 | src: url('./sanfranciscodisplay-thin-webfont.eot');
21 | src: url('./sanfranciscodisplay-thin-webfont.eot?#iefix') format('embedded-opentype'),
22 | url('./sanfranciscodisplay-thin-webfont.woff2') format('woff2'),
23 | url('./sanfranciscodisplay-thin-webfont.woff') format('woff'),
24 | url('./sanfranciscodisplay-thin-webfont.ttf') format('truetype'),
25 | url('./sanfranciscodisplay-thin-webfont.svg#San Francisco Display thin') format('svg');
26 | font-weight: 200;
27 | font-style: normal;
28 | }
29 |
30 | @font-face {
31 | font-family: 'San Francisco Display';
32 | src: url('./sanfranciscodisplay-light-webfont.eot');
33 | src: url('./sanfranciscodisplay-light-webfont.eot?#iefix') format('embedded-opentype'),
34 | url('./sanfranciscodisplay-light-webfont.woff2') format('woff2'),
35 | url('./sanfranciscodisplay-light-webfont.woff') format('woff'),
36 | url('./sanfranciscodisplay-light-webfont.ttf') format('truetype'),
37 | url('./sanfranciscodisplay-light-webfont.svg#San Francisco Display light') format('svg');
38 | font-weight: 300;
39 | font-style: normal;
40 | }
41 |
42 | @font-face {
43 | font-family: 'San Francisco Display';
44 | src: url('./sanfranciscodisplay-regular-webfont.eot');
45 | src: url('./sanfranciscodisplay-regular-webfont.eot?#iefix') format('embedded-opentype'),
46 | url('./sanfranciscodisplay-regular-webfont.woff2') format('woff2'),
47 | url('./sanfranciscodisplay-regular-webfont.woff') format('woff'),
48 | url('./sanfranciscodisplay-regular-webfont.ttf') format('truetype'),
49 | url('./sanfranciscodisplay-regular-webfont.svg#San Francisco Display regular') format('svg');
50 | font-weight: 400;
51 | font-style: normal;
52 | }
53 |
54 | @font-face {
55 | font-family: 'San Francisco Display';
56 | src: url('./sanfranciscodisplay-medium-webfont.eot');
57 | src: url('./sanfranciscodisplay-medium-webfont.eot?#iefix') format('embedded-opentype'),
58 | url('./sanfranciscodisplay-medium-webfont.woff2') format('woff2'),
59 | url('./sanfranciscodisplay-medium-webfont.woff') format('woff'),
60 | url('./sanfranciscodisplay-medium-webfont.ttf') format('truetype'),
61 | url('./sanfranciscodisplay-medium-webfont.svg#San Francisco Display medium') format('svg');
62 | font-weight: 500;
63 | font-style: normal;
64 | }
65 |
66 | @font-face {
67 | font-family: 'San Francisco Display';
68 | src: url('./sanfranciscodisplay-semibold-webfont.eot');
69 | src: url('./sanfranciscodisplay-semibold-webfont.eot?#iefix') format('embedded-opentype'),
70 | url('./sanfranciscodisplay-semibold-webfont.woff2') format('woff2'),
71 | url('./sanfranciscodisplay-semibold-webfont.woff') format('woff'),
72 | url('./sanfranciscodisplay-semibold-webfont.ttf') format('truetype'),
73 | url('./sanfranciscodisplay-semibold-webfont.svg#San Francisco Display semibold') format('svg');
74 | font-weight: 600;
75 | font-style: normal;
76 | }
77 |
78 | @font-face {
79 | font-family: 'San Francisco Display';
80 | src: url('./sanfranciscodisplay-bold-webfont.eot');
81 | src: url('./sanfranciscodisplay-bold-webfont.eot?#iefix') format('embedded-opentype'),
82 | url('./sanfranciscodisplay-bold-webfont.woff2') format('woff2'),
83 | url('./sanfranciscodisplay-bold-webfont.woff') format('woff'),
84 | url('./sanfranciscodisplay-bold-webfont.ttf') format('truetype'),
85 | url('./sanfranciscodisplay-bold-webfont.svg#San Francisco Display bold') format('svg');
86 | font-weight: 700;
87 | font-style: normal;
88 | }
89 |
90 | @font-face {
91 | font-family: 'San Francisco Display';
92 | src: url('./sanfranciscodisplay-heavy-webfont.eot');
93 | src: url('./sanfranciscodisplay-heavy-webfont.eot?#iefix') format('embedded-opentype'),
94 | url('./sanfranciscodisplay-heavy-webfont.woff2') format('woff2'),
95 | url('./sanfranciscodisplay-heavy-webfont.woff') format('woff'),
96 | url('./sanfranciscodisplay-heavy-webfont.ttf') format('truetype'),
97 | url('./sanfranciscodisplay-heavy-webfont.svg#San Francisco Display heavy') format('svg');
98 | font-weight: 800;
99 | font-style: normal;
100 | }
101 |
102 | @font-face {
103 | font-family: 'San Francisco Display';
104 | src: url('./sanfranciscodisplay-black-webfont.eot');
105 | src: url('./sanfranciscodisplay-black-webfont.eot?#iefix') format('embedded-opentype'),
106 | url('./sanfranciscodisplay-black-webfont.woff2') format('woff2'),
107 | url('./sanfranciscodisplay-black-webfont.woff') format('woff'),
108 | url('./sanfranciscodisplay-black-webfont.ttf') format('truetype'),
109 | url('./sanfranciscodisplay-black-webfont.svg#San Francisco Display black') format('svg');
110 | font-weight: 900;
111 | font-style: normal;
112 | }
113 |
--------------------------------------------------------------------------------
/lib/typography/san-francisco-display/sanfranciscodisplay-black-webfont.eot:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-display/sanfranciscodisplay-black-webfont.eot
--------------------------------------------------------------------------------
/lib/typography/san-francisco-display/sanfranciscodisplay-black-webfont.ttf:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-display/sanfranciscodisplay-black-webfont.ttf
--------------------------------------------------------------------------------
/lib/typography/san-francisco-display/sanfranciscodisplay-black-webfont.woff:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-display/sanfranciscodisplay-black-webfont.woff
--------------------------------------------------------------------------------
/lib/typography/san-francisco-display/sanfranciscodisplay-black-webfont.woff2:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-display/sanfranciscodisplay-black-webfont.woff2
--------------------------------------------------------------------------------
/lib/typography/san-francisco-display/sanfranciscodisplay-bold-webfont.eot:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-display/sanfranciscodisplay-bold-webfont.eot
--------------------------------------------------------------------------------
/lib/typography/san-francisco-display/sanfranciscodisplay-bold-webfont.ttf:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-display/sanfranciscodisplay-bold-webfont.ttf
--------------------------------------------------------------------------------
/lib/typography/san-francisco-display/sanfranciscodisplay-bold-webfont.woff:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-display/sanfranciscodisplay-bold-webfont.woff
--------------------------------------------------------------------------------
/lib/typography/san-francisco-display/sanfranciscodisplay-bold-webfont.woff2:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-display/sanfranciscodisplay-bold-webfont.woff2
--------------------------------------------------------------------------------
/lib/typography/san-francisco-display/sanfranciscodisplay-heavy-webfont.eot:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-display/sanfranciscodisplay-heavy-webfont.eot
--------------------------------------------------------------------------------
/lib/typography/san-francisco-display/sanfranciscodisplay-heavy-webfont.ttf:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-display/sanfranciscodisplay-heavy-webfont.ttf
--------------------------------------------------------------------------------
/lib/typography/san-francisco-display/sanfranciscodisplay-heavy-webfont.woff:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-display/sanfranciscodisplay-heavy-webfont.woff
--------------------------------------------------------------------------------
/lib/typography/san-francisco-display/sanfranciscodisplay-heavy-webfont.woff2:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-display/sanfranciscodisplay-heavy-webfont.woff2
--------------------------------------------------------------------------------
/lib/typography/san-francisco-display/sanfranciscodisplay-light-webfont.eot:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-display/sanfranciscodisplay-light-webfont.eot
--------------------------------------------------------------------------------
/lib/typography/san-francisco-display/sanfranciscodisplay-light-webfont.ttf:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-display/sanfranciscodisplay-light-webfont.ttf
--------------------------------------------------------------------------------
/lib/typography/san-francisco-display/sanfranciscodisplay-light-webfont.woff:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-display/sanfranciscodisplay-light-webfont.woff
--------------------------------------------------------------------------------
/lib/typography/san-francisco-display/sanfranciscodisplay-light-webfont.woff2:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-display/sanfranciscodisplay-light-webfont.woff2
--------------------------------------------------------------------------------
/lib/typography/san-francisco-display/sanfranciscodisplay-medium-webfont.eot:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-display/sanfranciscodisplay-medium-webfont.eot
--------------------------------------------------------------------------------
/lib/typography/san-francisco-display/sanfranciscodisplay-medium-webfont.ttf:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-display/sanfranciscodisplay-medium-webfont.ttf
--------------------------------------------------------------------------------
/lib/typography/san-francisco-display/sanfranciscodisplay-medium-webfont.woff:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-display/sanfranciscodisplay-medium-webfont.woff
--------------------------------------------------------------------------------
/lib/typography/san-francisco-display/sanfranciscodisplay-medium-webfont.woff2:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-display/sanfranciscodisplay-medium-webfont.woff2
--------------------------------------------------------------------------------
/lib/typography/san-francisco-display/sanfranciscodisplay-regular-webfont.eot:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-display/sanfranciscodisplay-regular-webfont.eot
--------------------------------------------------------------------------------
/lib/typography/san-francisco-display/sanfranciscodisplay-regular-webfont.ttf:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-display/sanfranciscodisplay-regular-webfont.ttf
--------------------------------------------------------------------------------
/lib/typography/san-francisco-display/sanfranciscodisplay-regular-webfont.woff:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-display/sanfranciscodisplay-regular-webfont.woff
--------------------------------------------------------------------------------
/lib/typography/san-francisco-display/sanfranciscodisplay-regular-webfont.woff2:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-display/sanfranciscodisplay-regular-webfont.woff2
--------------------------------------------------------------------------------
/lib/typography/san-francisco-display/sanfranciscodisplay-semibold-webfont.eot:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-display/sanfranciscodisplay-semibold-webfont.eot
--------------------------------------------------------------------------------
/lib/typography/san-francisco-display/sanfranciscodisplay-semibold-webfont.ttf:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-display/sanfranciscodisplay-semibold-webfont.ttf
--------------------------------------------------------------------------------
/lib/typography/san-francisco-display/sanfranciscodisplay-semibold-webfont.woff:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-display/sanfranciscodisplay-semibold-webfont.woff
--------------------------------------------------------------------------------
/lib/typography/san-francisco-display/sanfranciscodisplay-semibold-webfont.woff2:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-display/sanfranciscodisplay-semibold-webfont.woff2
--------------------------------------------------------------------------------
/lib/typography/san-francisco-display/sanfranciscodisplay-thin-webfont.eot:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-display/sanfranciscodisplay-thin-webfont.eot
--------------------------------------------------------------------------------
/lib/typography/san-francisco-display/sanfranciscodisplay-thin-webfont.ttf:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-display/sanfranciscodisplay-thin-webfont.ttf
--------------------------------------------------------------------------------
/lib/typography/san-francisco-display/sanfranciscodisplay-thin-webfont.woff:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-display/sanfranciscodisplay-thin-webfont.woff
--------------------------------------------------------------------------------
/lib/typography/san-francisco-display/sanfranciscodisplay-thin-webfont.woff2:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-display/sanfranciscodisplay-thin-webfont.woff2
--------------------------------------------------------------------------------
/lib/typography/san-francisco-display/sanfranciscodisplay-ultralight-webfont.eot:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-display/sanfranciscodisplay-ultralight-webfont.eot
--------------------------------------------------------------------------------
/lib/typography/san-francisco-display/sanfranciscodisplay-ultralight-webfont.ttf:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-display/sanfranciscodisplay-ultralight-webfont.ttf
--------------------------------------------------------------------------------
/lib/typography/san-francisco-display/sanfranciscodisplay-ultralight-webfont.woff:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-display/sanfranciscodisplay-ultralight-webfont.woff
--------------------------------------------------------------------------------
/lib/typography/san-francisco-display/sanfranciscodisplay-ultralight-webfont.woff2:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-display/sanfranciscodisplay-ultralight-webfont.woff2
--------------------------------------------------------------------------------
/lib/typography/san-francisco-text/index.css:
--------------------------------------------------------------------------------
1 |
2 | /**
3 | * San Francisco Text.
4 | */
5 |
6 | @font-face {
7 | font-family: 'San Francisco Text';
8 | src: url('./sanfranciscotext-thin-webfont.eot');
9 | src: url('./sanfranciscotext-thin-webfont.eot?#iefix') format('embedded-opentype'),
10 | url('./sanfranciscotext-thin-webfont.woff2') format('woff2'),
11 | url('./sanfranciscotext-thin-webfont.woff') format('woff'),
12 | url('./sanfranciscotext-thin-webfont.ttf') format('truetype'),
13 | url('./sanfranciscotext-thin-webfont.svg#San Francisco Text thin') format('svg');
14 | font-weight: 200;
15 | font-style: normal;
16 | }
17 |
18 | @font-face {
19 | font-family: 'San Francisco Text';
20 | src: url('./sanfranciscotext-thinitalic-webfont.eot');
21 | src: url('./sanfranciscotext-thinitalic-webfont.eot?#iefix') format('embedded-opentype'),
22 | url('./sanfranciscotext-thinitalic-webfont.woff2') format('woff2'),
23 | url('./sanfranciscotext-thinitalic-webfont.woff') format('woff'),
24 | url('./sanfranciscotext-thinitalic-webfont.ttf') format('truetype'),
25 | url('./sanfranciscotext-thinitalic-webfont.svg#San Francisco Text thin_italic') format('svg');
26 | font-weight: 200;
27 | font-style: italic;
28 | }
29 |
30 | @font-face {
31 | font-family: 'San Francisco Text';
32 | src: url('./sanfranciscotext-light-webfont.eot');
33 | src: url('./sanfranciscotext-light-webfont.eot?#iefix') format('embedded-opentype'),
34 | url('./sanfranciscotext-light-webfont.woff2') format('woff2'),
35 | url('./sanfranciscotext-light-webfont.woff') format('woff'),
36 | url('./sanfranciscotext-light-webfont.ttf') format('truetype'),
37 | url('./sanfranciscotext-light-webfont.svg#San Francisco Text light') format('svg');
38 | font-weight: 300;
39 | font-style: normal;
40 | }
41 |
42 | @font-face {
43 | font-family: 'San Francisco Text';
44 | src: url('./sanfranciscotext-lightitalic-webfont.eot');
45 | src: url('./sanfranciscotext-lightitalic-webfont.eot?#iefix') format('embedded-opentype'),
46 | url('./sanfranciscotext-lightitalic-webfont.woff2') format('woff2'),
47 | url('./sanfranciscotext-lightitalic-webfont.woff') format('woff'),
48 | url('./sanfranciscotext-lightitalic-webfont.ttf') format('truetype'),
49 | url('./sanfranciscotext-lightitalic-webfont.svg#San Francisco Text LtIt') format('svg');
50 | font-weight: 300;
51 | font-style: italic;
52 | }
53 |
54 | @font-face {
55 | font-family: 'San Francisco Text';
56 | src: url('sanfranciscotext-regular-webfont.eot');
57 | src: url('./sanfranciscotext-regular-webfont.eot?#iefix') format('embedded-opentype'),
58 | url('./sanfranciscotext-regular-webfont.woff2') format('woff2'),
59 | url('./sanfranciscotext-regular-webfont.woff') format('woff'),
60 | url('./sanfranciscotext-regular-webfont.ttf') format('truetype'),
61 | url('./sanfranciscotext-regular-webfont.svg#San Francisco Text regular') format('svg');
62 | font-weight: 400;
63 | font-style: normal;
64 | }
65 |
66 | @font-face {
67 | font-family: 'San Francisco Text';
68 | src: url('sanfranciscotext-regularitalic-webfont.eot');
69 | src: url('./sanfranciscotext-regularitalic-webfont.eot?#iefix') format('embedded-opentype'),
70 | url('./sanfranciscotext-regularitalic-webfont.woff2') format('woff2'),
71 | url('./sanfranciscotext-regularitalic-webfont.woff') format('woff'),
72 | url('./sanfranciscotext-regularitalic-webfont.ttf') format('truetype'),
73 | url('./sanfranciscotext-regularitalic-webfont.svg#San Francisco Text italic') format('svg');
74 | font-weight: 400;
75 | font-style: italic;
76 | }
77 |
78 | @font-face {
79 | font-family: 'San Francisco Text';
80 | src: url('./sanfranciscotext-medium-webfont.eot');
81 | src: url('./sanfranciscotext-medium-webfont.eot?#iefix') format('embedded-opentype'),
82 | url('./sanfranciscotext-medium-webfont.woff2') format('woff2'),
83 | url('./sanfranciscotext-medium-webfont.woff') format('woff'),
84 | url('./sanfranciscotext-medium-webfont.ttf') format('truetype'),
85 | url('./sanfranciscotext-medium-webfont.svg#San Francisco Text medium') format('svg');
86 | font-weight: 500;
87 | font-style: normal;
88 | }
89 |
90 | @font-face {
91 | font-family: 'San Francisco Text';
92 | src: url('./sanfranciscotext-mediumitalic-webfont.eot');
93 | src: url('./sanfranciscotext-mediumitalic-webfont.eot?#iefix') format('embedded-opentype'),
94 | url('./sanfranciscotext-mediumitalic-webfont.woff2') format('woff2'),
95 | url('./sanfranciscotext-mediumitalic-webfont.woff') format('woff'),
96 | url('./sanfranciscotext-mediumitalic-webfont.ttf') format('truetype'),
97 | url('./sanfranciscotext-mediumitalic-webfont.svg#San Francisco Text MdIt') format('svg');
98 | font-weight: 500;
99 | font-style: italic;
100 | }
101 |
102 | @font-face {
103 | font-family: 'San Francisco Text';
104 | src: url('./sanfranciscotext-semibold-webfont.eot');
105 | src: url('./sanfranciscotext-semibold-webfont.eot?#iefix') format('embedded-opentype'),
106 | url('./sanfranciscotext-semibold-webfont.woff2') format('woff2'),
107 | url('./sanfranciscotext-semibold-webfont.woff') format('woff'),
108 | url('./sanfranciscotext-semibold-webfont.ttf') format('truetype'),
109 | url('./sanfranciscotext-semibold-webfont.svg#San Francisco Text semibold') format('svg');
110 | font-weight: 600;
111 | font-style: normal;
112 | }
113 |
114 | @font-face {
115 | font-family: 'San Francisco Text';
116 | src: url('./sanfranciscotext-semibolditalic-webfont.eot');
117 | src: url('./sanfranciscotext-semibolditalic-webfont.eot?#iefix') format('embedded-opentype'),
118 | url('./sanfranciscotext-semibolditalic-webfont.woff2') format('woff2'),
119 | url('./sanfranciscotext-semibolditalic-webfont.woff') format('woff'),
120 | url('./sanfranciscotext-semibolditalic-webfont.ttf') format('truetype'),
121 | url('./sanfranciscotext-semibolditalic-webfont.svg#San Francisco Text SBdIt') format('svg');
122 | font-weight: 600;
123 | font-style: italic;
124 | }
125 |
126 | @font-face {
127 | font-family: 'San Francisco Text';
128 | src: url('./sanfranciscotext-bold-webfont.eot');
129 | src: url('./sanfranciscotext-bold-webfont.eot?#iefix') format('embedded-opentype'),
130 | url('./sanfranciscotext-bold-webfont.woff2') format('woff2'),
131 | url('./sanfranciscotext-bold-webfont.woff') format('woff'),
132 | url('./sanfranciscotext-bold-webfont.ttf') format('truetype'),
133 | url('./sanfranciscotext-bold-webfont.svg#San Francisco Text bold') format('svg');
134 | font-weight: 700;
135 | font-style: normal;
136 | }
137 |
138 | @font-face {
139 | font-family: 'San Francisco Text';
140 | src: url('./sanfranciscotext-bolditalic-webfont.eot');
141 | src: url('./sanfranciscotext-bolditalic-webfont.eot?#iefix') format('embedded-opentype'),
142 | url('./sanfranciscotext-bolditalic-webfont.woff2') format('woff2'),
143 | url('./sanfranciscotext-bolditalic-webfont.woff') format('woff'),
144 | url('./sanfranciscotext-bolditalic-webfont.ttf') format('truetype'),
145 | url('./sanfranciscotext-bolditalic-webfont.svg#San Francisco Text bold_italic') format('svg');
146 | font-weight: 700;
147 | font-style: italic;
148 | }
149 |
150 | @font-face {
151 | font-family: 'San Francisco Text';
152 | src: url('./sanfranciscotext-heavy-webfont.eot');
153 | src: url('./sanfranciscotext-heavy-webfont.eot?#iefix') format('embedded-opentype'),
154 | url('./sanfranciscotext-heavy-webfont.woff2') format('woff2'),
155 | url('./sanfranciscotext-heavy-webfont.woff') format('woff'),
156 | url('./sanfranciscotext-heavy-webfont.ttf') format('truetype'),
157 | url('./sanfranciscotext-heavy-webfont.svg#San Francisco Text heavy') format('svg');
158 | font-weight: 800;
159 | font-style: normal;
160 | }
161 |
162 | @font-face {
163 | font-family: 'San Francisco Text';
164 | src: url('./sanfranciscotext-heavyitalic-webfont.eot');
165 | src: url('./sanfranciscotext-heavyitalic-webfont.eot?#iefix') format('embedded-opentype'),
166 | url('./sanfranciscotext-heavyitalic-webfont.woff2') format('woff2'),
167 | url('./sanfranciscotext-heavyitalic-webfont.woff') format('woff'),
168 | url('./sanfranciscotext-heavyitalic-webfont.ttf') format('truetype'),
169 | url('./sanfranciscotext-heavyitalic-webfont.svg#San Francisco Text HvIt') format('svg');
170 | font-weight: 800;
171 | font-style: italic;
172 | }
173 |
--------------------------------------------------------------------------------
/lib/typography/san-francisco-text/sanfranciscotext-bold-webfont.eot:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-text/sanfranciscotext-bold-webfont.eot
--------------------------------------------------------------------------------
/lib/typography/san-francisco-text/sanfranciscotext-bold-webfont.ttf:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-text/sanfranciscotext-bold-webfont.ttf
--------------------------------------------------------------------------------
/lib/typography/san-francisco-text/sanfranciscotext-bold-webfont.woff:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-text/sanfranciscotext-bold-webfont.woff
--------------------------------------------------------------------------------
/lib/typography/san-francisco-text/sanfranciscotext-bold-webfont.woff2:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-text/sanfranciscotext-bold-webfont.woff2
--------------------------------------------------------------------------------
/lib/typography/san-francisco-text/sanfranciscotext-bolditalic-webfont.eot:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-text/sanfranciscotext-bolditalic-webfont.eot
--------------------------------------------------------------------------------
/lib/typography/san-francisco-text/sanfranciscotext-bolditalic-webfont.ttf:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-text/sanfranciscotext-bolditalic-webfont.ttf
--------------------------------------------------------------------------------
/lib/typography/san-francisco-text/sanfranciscotext-bolditalic-webfont.woff:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-text/sanfranciscotext-bolditalic-webfont.woff
--------------------------------------------------------------------------------
/lib/typography/san-francisco-text/sanfranciscotext-bolditalic-webfont.woff2:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-text/sanfranciscotext-bolditalic-webfont.woff2
--------------------------------------------------------------------------------
/lib/typography/san-francisco-text/sanfranciscotext-heavy-webfont.eot:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-text/sanfranciscotext-heavy-webfont.eot
--------------------------------------------------------------------------------
/lib/typography/san-francisco-text/sanfranciscotext-heavy-webfont.ttf:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-text/sanfranciscotext-heavy-webfont.ttf
--------------------------------------------------------------------------------
/lib/typography/san-francisco-text/sanfranciscotext-heavy-webfont.woff:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-text/sanfranciscotext-heavy-webfont.woff
--------------------------------------------------------------------------------
/lib/typography/san-francisco-text/sanfranciscotext-heavy-webfont.woff2:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-text/sanfranciscotext-heavy-webfont.woff2
--------------------------------------------------------------------------------
/lib/typography/san-francisco-text/sanfranciscotext-heavyitalic-webfont.eot:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-text/sanfranciscotext-heavyitalic-webfont.eot
--------------------------------------------------------------------------------
/lib/typography/san-francisco-text/sanfranciscotext-heavyitalic-webfont.ttf:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-text/sanfranciscotext-heavyitalic-webfont.ttf
--------------------------------------------------------------------------------
/lib/typography/san-francisco-text/sanfranciscotext-heavyitalic-webfont.woff:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-text/sanfranciscotext-heavyitalic-webfont.woff
--------------------------------------------------------------------------------
/lib/typography/san-francisco-text/sanfranciscotext-heavyitalic-webfont.woff2:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-text/sanfranciscotext-heavyitalic-webfont.woff2
--------------------------------------------------------------------------------
/lib/typography/san-francisco-text/sanfranciscotext-light-webfont.eot:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-text/sanfranciscotext-light-webfont.eot
--------------------------------------------------------------------------------
/lib/typography/san-francisco-text/sanfranciscotext-light-webfont.ttf:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-text/sanfranciscotext-light-webfont.ttf
--------------------------------------------------------------------------------
/lib/typography/san-francisco-text/sanfranciscotext-light-webfont.woff:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-text/sanfranciscotext-light-webfont.woff
--------------------------------------------------------------------------------
/lib/typography/san-francisco-text/sanfranciscotext-light-webfont.woff2:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-text/sanfranciscotext-light-webfont.woff2
--------------------------------------------------------------------------------
/lib/typography/san-francisco-text/sanfranciscotext-lightitalic-webfont.eot:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-text/sanfranciscotext-lightitalic-webfont.eot
--------------------------------------------------------------------------------
/lib/typography/san-francisco-text/sanfranciscotext-lightitalic-webfont.ttf:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-text/sanfranciscotext-lightitalic-webfont.ttf
--------------------------------------------------------------------------------
/lib/typography/san-francisco-text/sanfranciscotext-lightitalic-webfont.woff:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-text/sanfranciscotext-lightitalic-webfont.woff
--------------------------------------------------------------------------------
/lib/typography/san-francisco-text/sanfranciscotext-lightitalic-webfont.woff2:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-text/sanfranciscotext-lightitalic-webfont.woff2
--------------------------------------------------------------------------------
/lib/typography/san-francisco-text/sanfranciscotext-medium-webfont.eot:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-text/sanfranciscotext-medium-webfont.eot
--------------------------------------------------------------------------------
/lib/typography/san-francisco-text/sanfranciscotext-medium-webfont.ttf:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-text/sanfranciscotext-medium-webfont.ttf
--------------------------------------------------------------------------------
/lib/typography/san-francisco-text/sanfranciscotext-medium-webfont.woff:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-text/sanfranciscotext-medium-webfont.woff
--------------------------------------------------------------------------------
/lib/typography/san-francisco-text/sanfranciscotext-medium-webfont.woff2:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-text/sanfranciscotext-medium-webfont.woff2
--------------------------------------------------------------------------------
/lib/typography/san-francisco-text/sanfranciscotext-mediumitalic-webfont.eot:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-text/sanfranciscotext-mediumitalic-webfont.eot
--------------------------------------------------------------------------------
/lib/typography/san-francisco-text/sanfranciscotext-mediumitalic-webfont.ttf:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-text/sanfranciscotext-mediumitalic-webfont.ttf
--------------------------------------------------------------------------------
/lib/typography/san-francisco-text/sanfranciscotext-mediumitalic-webfont.woff:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-text/sanfranciscotext-mediumitalic-webfont.woff
--------------------------------------------------------------------------------
/lib/typography/san-francisco-text/sanfranciscotext-mediumitalic-webfont.woff2:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-text/sanfranciscotext-mediumitalic-webfont.woff2
--------------------------------------------------------------------------------
/lib/typography/san-francisco-text/sanfranciscotext-regular-webfont.eot:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-text/sanfranciscotext-regular-webfont.eot
--------------------------------------------------------------------------------
/lib/typography/san-francisco-text/sanfranciscotext-regular-webfont.ttf:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-text/sanfranciscotext-regular-webfont.ttf
--------------------------------------------------------------------------------
/lib/typography/san-francisco-text/sanfranciscotext-regular-webfont.woff:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-text/sanfranciscotext-regular-webfont.woff
--------------------------------------------------------------------------------
/lib/typography/san-francisco-text/sanfranciscotext-regular-webfont.woff2:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-text/sanfranciscotext-regular-webfont.woff2
--------------------------------------------------------------------------------
/lib/typography/san-francisco-text/sanfranciscotext-regularitalic-webfont.eot:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-text/sanfranciscotext-regularitalic-webfont.eot
--------------------------------------------------------------------------------
/lib/typography/san-francisco-text/sanfranciscotext-regularitalic-webfont.ttf:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-text/sanfranciscotext-regularitalic-webfont.ttf
--------------------------------------------------------------------------------
/lib/typography/san-francisco-text/sanfranciscotext-regularitalic-webfont.woff:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-text/sanfranciscotext-regularitalic-webfont.woff
--------------------------------------------------------------------------------
/lib/typography/san-francisco-text/sanfranciscotext-regularitalic-webfont.woff2:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-text/sanfranciscotext-regularitalic-webfont.woff2
--------------------------------------------------------------------------------
/lib/typography/san-francisco-text/sanfranciscotext-semibold-webfont.eot:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-text/sanfranciscotext-semibold-webfont.eot
--------------------------------------------------------------------------------
/lib/typography/san-francisco-text/sanfranciscotext-semibold-webfont.ttf:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-text/sanfranciscotext-semibold-webfont.ttf
--------------------------------------------------------------------------------
/lib/typography/san-francisco-text/sanfranciscotext-semibold-webfont.woff:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-text/sanfranciscotext-semibold-webfont.woff
--------------------------------------------------------------------------------
/lib/typography/san-francisco-text/sanfranciscotext-semibold-webfont.woff2:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-text/sanfranciscotext-semibold-webfont.woff2
--------------------------------------------------------------------------------
/lib/typography/san-francisco-text/sanfranciscotext-semibolditalic-webfont.eot:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-text/sanfranciscotext-semibolditalic-webfont.eot
--------------------------------------------------------------------------------
/lib/typography/san-francisco-text/sanfranciscotext-semibolditalic-webfont.ttf:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-text/sanfranciscotext-semibolditalic-webfont.ttf
--------------------------------------------------------------------------------
/lib/typography/san-francisco-text/sanfranciscotext-semibolditalic-webfont.woff:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-text/sanfranciscotext-semibolditalic-webfont.woff
--------------------------------------------------------------------------------
/lib/typography/san-francisco-text/sanfranciscotext-semibolditalic-webfont.woff2:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-text/sanfranciscotext-semibolditalic-webfont.woff2
--------------------------------------------------------------------------------
/lib/typography/san-francisco-text/sanfranciscotext-thin-webfont.eot:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-text/sanfranciscotext-thin-webfont.eot
--------------------------------------------------------------------------------
/lib/typography/san-francisco-text/sanfranciscotext-thin-webfont.ttf:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-text/sanfranciscotext-thin-webfont.ttf
--------------------------------------------------------------------------------
/lib/typography/san-francisco-text/sanfranciscotext-thin-webfont.woff:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-text/sanfranciscotext-thin-webfont.woff
--------------------------------------------------------------------------------
/lib/typography/san-francisco-text/sanfranciscotext-thin-webfont.woff2:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-text/sanfranciscotext-thin-webfont.woff2
--------------------------------------------------------------------------------
/lib/typography/san-francisco-text/sanfranciscotext-thinitalic-webfont.eot:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-text/sanfranciscotext-thinitalic-webfont.eot
--------------------------------------------------------------------------------
/lib/typography/san-francisco-text/sanfranciscotext-thinitalic-webfont.ttf:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-text/sanfranciscotext-thinitalic-webfont.ttf
--------------------------------------------------------------------------------
/lib/typography/san-francisco-text/sanfranciscotext-thinitalic-webfont.woff:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-text/sanfranciscotext-thinitalic-webfont.woff
--------------------------------------------------------------------------------
/lib/typography/san-francisco-text/sanfranciscotext-thinitalic-webfont.woff2:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/stevenmiller888/matter/d440f944895979ef7c31f1ec23f823efc918734d/lib/typography/san-francisco-text/sanfranciscotext-thinitalic-webfont.woff2
--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "matterjs",
3 | "version": "0.1.3",
4 | "repository": {
5 | "type": "git",
6 | "url": "https://github.com/stevenmiller888/matter.git"
7 | },
8 | "style": "index.css",
9 | "scripts": {
10 | "lint": "eslint src",
11 | "pretest": "npm run lint",
12 | "preview": "node support/preview.js",
13 | "test-local": "zuul --local 7000 -- test/*.js",
14 | "test": "zuul -- test/*.js"
15 | },
16 | "keywords": [
17 | "matter",
18 | "matterjs",
19 | "components",
20 | "deku",
21 | "deku-component",
22 | "ui"
23 | ],
24 | "devDependencies": {
25 | "autoprefixer": "^6.1.2",
26 | "babel-plugin-transform-react-jsx": "^6.3.13",
27 | "babel-preset-es2015": "^6.3.13",
28 | "babel-preset-react": "^6.3.13",
29 | "babelify": "^7.2.0",
30 | "browserify": "^12.0.1",
31 | "budo": "^7.0.2",
32 | "compat-trigger-event": "^1.0.0",
33 | "deku-testutils": "^1.0.2",
34 | "eslint": "^1.2.1",
35 | "gh-pages": "^0.3.1",
36 | "postcss": "^5.0.12",
37 | "postcss-cli": "^2.3.2",
38 | "postcss-cssnext": "^2.2.0",
39 | "postcss-import": "^7.1.3",
40 | "postcss-middleware": "^1.0.0",
41 | "postcss-url": "^5.0.2",
42 | "suitcss-base": "^1.0.1",
43 | "zuul": "^3.8.0"
44 | },
45 | "license": "MIT",
46 | "dependencies": {
47 | "deku": "^1.0.0",
48 | "highlight-bash": "0.0.1",
49 | "highlight-csharp": "0.0.1",
50 | "highlight-css": "0.0.2",
51 | "highlight-go": "0.0.1",
52 | "highlight-java": "0.0.1",
53 | "highlight-javascript": "0.0.3",
54 | "highlight-objective-c": "0.0.1",
55 | "highlight-php": "0.0.1",
56 | "highlight-python": "0.0.3",
57 | "highlight-ruby": "0.0.1",
58 | "highlight-xml": "0.0.1",
59 | "highlight-yaml": "0.0.1",
60 | "syntax-highlighter": "0.0.3",
61 | "virtual-element": "^1.2.0"
62 | },
63 | "browserify": {
64 | "transform": [
65 | "babelify"
66 | ]
67 | }
68 | }
69 |
--------------------------------------------------------------------------------
/preview.css:
--------------------------------------------------------------------------------
1 | @import 'suitcss-base';
2 | @import './lib';
3 |
4 | html,body {
5 | height: 100%;
6 | }
7 |
8 | body {
9 | background: radial-gradient(ellipse farthest-side at 100% 100%, #F8FFF3 1%, #CEF1EC 1%, #1380A0 120%);
10 | }
11 |
12 | header {
13 | position: relative;
14 | text-align: center;
15 | overflow: hidden;
16 | height: 180px;
17 | color: #fff;
18 | }
19 |
20 | header div {
21 | position: absolute;
22 | width: 100%;
23 | text-align: center;
24 | }
25 |
26 | header div h1 {
27 | position: relative;
28 | line-height: normal;
29 | padding-bottom: 7px;
30 | font-weight: 100;
31 | font-size: 105px;
32 | text-shadow: 0 2px 0 rgba(0,91,103,.15);
33 | }
34 |
35 | header div p {
36 | width: 380px;
37 | margin: .7em auto 1.35em;
38 | font-size: 20px;
39 | line-height: 1.3;
40 | text-shadow: 0 1px 0 rgba(0,91,103,.3);
41 | }
42 |
43 | .App {
44 | box-sizing: border-box;
45 | margin: 30px auto;
46 | display: flex;
47 | padding: 10px;
48 | width: 60%;
49 | }
50 |
51 | .App-menu {
52 | order: 1;
53 | }
54 |
55 | .App-example {
56 | box-shadow: color(black alpha(0.117647)) 0px 1px 6px, color(black alpha(0.239216)) 0px 1px 4px;
57 | margin-left: 30px;
58 | order: 2;
59 | flex-direction: column;
60 | position: relative;
61 | display: flex;
62 | flex: 1;
63 | width: 363.203px;
64 | height: 524px;
65 | }
66 |
67 | .App-example-component {
68 | justify-content: center;
69 | background: #FFF;
70 | order: 1;
71 | flex-grow: 1;
72 | display: flex;
73 | align-items: center;
74 | overflow: hidden;
75 | }
76 |
77 | .App-example-code {
78 | order: 2;
79 | width: 100%;
80 | }
81 |
--------------------------------------------------------------------------------
/preview.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | matter
5 |
6 |
12 |
13 |
19 |
20 |
21 |
22 |
23 |
24 |
25 |
--------------------------------------------------------------------------------
/preview.js:
--------------------------------------------------------------------------------
1 | import element from 'virtual-element';
2 | import { deku, render } from 'deku';
3 | import { Menu, Code } from './lib';
4 | import examples from './examples' ;
5 |
6 | /**
7 | * App.
8 | */
9 |
10 | let App = {
11 | render({ props, state }, updateState) {
12 | let { examples } = props;
13 | let example = state.example || examples.Code;
14 | let items = Object.keys(examples);
15 |
16 | return (
17 |
18 |
21 |
22 |
23 | { example.component }
24 |
25 |
26 |
27 | { example.code }
28 |
29 |
30 |
31 |
32 | );
33 |
34 | function changeExample(expl) {
35 | analytics.track('Viewed Example', expl);
36 | updateState({ example: examples[expl] });
37 | }
38 | }
39 | };
40 |
41 | let app = deku();
42 | render(app, document.querySelector('main'));
43 |
--------------------------------------------------------------------------------
/support/deploy.js:
--------------------------------------------------------------------------------
1 | var deploy = require('gh-pages').publish;
2 | var exec = require('child_process').exec;
3 | var resolve = require('path').resolve;
4 |
5 | /**
6 | * Settings.
7 | */
8 |
9 | var matter = resolve(__dirname, '../build');
10 | var url = 'http://stevenmiller888.github.io/matter/';
11 |
12 | /**
13 | * Publish.
14 | */
15 |
16 | exec('make', { cwd: process.cwd }, function(err) {
17 | if (err) console.error(err);
18 |
19 | deploy(matter, { message: 'matter deploy' }, function(err) {
20 | if (err) console.error(err);
21 | console.log('Deployed successfully! You can see it live at ' + url);
22 | });
23 | });
24 |
--------------------------------------------------------------------------------
/support/duo.js:
--------------------------------------------------------------------------------
1 | var babel = require('duo-babel');
2 | var myth = require('duo-myth');
3 |
4 | module.exports = [
5 | babel({
6 | jsxPragma: 'element'
7 | }),
8 |
9 | myth()
10 | ];
11 |
--------------------------------------------------------------------------------
/support/preview.js:
--------------------------------------------------------------------------------
1 | var fs = require('fs');
2 | var url = require('url');
3 | var path = require('path');
4 | var budo = require('budo');
5 | var babelify = require('babelify');
6 | var postcss = require('postcss');
7 | var postcssUrl = require('postcss-url');
8 | var postcssImport = require('postcss-import');
9 | var postcssNext = require('postcss-cssnext');
10 | var autoprefixer = require('autoprefixer');
11 |
12 | var index = path.resolve(__dirname, '../preview.html');
13 | var css = path.resolve(__dirname, '../preview.css');
14 |
15 | function buildCSS(req, res, next) {
16 | if (url.parse(req.url).pathname !== '/preview.css') return next();
17 | postcss([
18 | postcssImport,
19 | postcssUrl({ url: 'copy' }),
20 | postcssNext,
21 | autoprefixer
22 | ])
23 | .process(fs.readFileSync(css), { from: 'preview.css', to: 'preview.css' })
24 | .catch(function(error) {
25 | if (error.name === 'CssSyntaxError') {
26 | process.stderr.write(error.message + error.showSourceCode());
27 | } else {
28 | throw error;
29 | }
30 | })
31 | .then(function(result) {
32 | res.setHeader('Content-Type', 'text/css');
33 | res.write(result.css);
34 | res.end();
35 | return next();
36 | });
37 | }
38 |
39 | var app = budo('preview.js', {
40 | port: 3000,
41 | middleware: buildCSS,
42 | defaultIndex: function() {
43 | return fs.createReadStream(index, 'utf8');
44 | },
45 | browserify: {
46 | transform: babelify
47 | }
48 | }).on('connect', () => {
49 | console.log('preview server listening on port 3000');
50 | });
51 |
--------------------------------------------------------------------------------
/test/button.js:
--------------------------------------------------------------------------------
1 | /** @jsx element **/
2 |
3 | import { Mock, mount, assert as assertElement } from 'deku-testutils';
4 | import trigger from 'compat-trigger-event';
5 | import assert from 'assert';
6 | import element from 'virtual-element';
7 | import { Button } from '../';
8 |
9 | describe('Button', () => {
10 | const mock = Mock(Button);
11 |
12 | it('returns a button with the right classes', () => {
13 | const node = mock.render();
14 | assertElement.isNode(node, 'button');
15 | assertElement.hasClass(node, 'matter-Button');
16 | });
17 |
18 | describe('with props', () => {
19 | describe('.type', () => {
20 | it('sets the `type` attribute', () => {
21 | const props = { type: 'secondary' };
22 | const node = mock.render({ props });
23 | assertElement.hasAttribute(node, 'type', 'secondary');
24 | });
25 | it('sets the `type` attribute to `primary` by default', () => {
26 | const node = mock.render();
27 | assertElement.hasAttribute(node, 'type', 'primary');
28 | });
29 | });
30 | describe('.size', () => {
31 | it('sets the `size` attribute', () => {
32 | const props = { size: 'small' };
33 | const node = mock.render({ props });
34 | assertElement.hasAttribute(node, 'size', 'small');
35 | });
36 | it('sets the `size` attribute to `medium` by default', () => {
37 | const node = mock.render();
38 | assertElement.hasAttribute(node, 'size', 'medium');
39 | });
40 | });
41 | describe('.onClick(e)', () => {
42 | it('fires the event handler', (done) => {
43 | const app = mount();
44 |
45 | function handle(e) {
46 | assert.strictEqual(e.type, 'click');
47 | app.unmount;
48 | done();
49 | }
50 |
51 | trigger(app.element.querySelector('button'), 'click');
52 | });
53 | });
54 | });
55 | });
56 |
--------------------------------------------------------------------------------
/test/checkbox.js:
--------------------------------------------------------------------------------
1 | /** @jsx element **/
2 |
3 | import { Mock, mount, assert as assertElement } from 'deku-testutils';
4 | import trigger from 'compat-trigger-event';
5 | import assert from 'assert';
6 | import element from 'virtual-element';
7 | import { Checkbox } from '../';
8 |
9 | describe('Checkbox', () => {
10 | const mock = Mock(Checkbox);
11 |
12 | it('returns a checkbox with the right classes', () => {
13 | const node = mock.render();
14 | assertElement.isNode(node, 'input');
15 | assertElement.hasAttribute(node, 'type', 'checkbox');
16 | assertElement.hasClass(node, 'matter-Checkbox');
17 | });
18 |
19 | describe('with props', () => {
20 | describe('.checked', () => {
21 | it('sets the `checked` attribute', () => {
22 | const props = { checked: true };
23 | const node = mock.render({ props });
24 | assertElement.hasAttribute(node, 'checked', true);
25 | });
26 | });
27 | describe('.size', () => {
28 | it('sets the `size` attribute', () => {
29 | const props = { size: 'small' };
30 | const node = mock.render({ props });
31 | assertElement.hasAttribute(node, 'size', 'small');
32 | });
33 | it('sets the `size` attribute to `medium` by default', () => {
34 | const node = mock.render();
35 | assertElement.hasAttribute(node, 'size', 'medium');
36 | });
37 | });
38 | describe('.onClick(e)', () => {
39 | it('fires the event handler', (done) => {
40 | const app = mount();
41 |
42 | function handle(e) {
43 | assert.strictEqual(e.type, 'click');
44 | app.unmount;
45 | done();
46 | }
47 |
48 | trigger(app.element.querySelector('input'), 'click');
49 | });
50 | });
51 | });
52 | });
53 |
--------------------------------------------------------------------------------
/test/code.js:
--------------------------------------------------------------------------------
1 | import { Mock, assert as assertElement } from 'deku-testutils';
2 | import { Code } from '../';
3 |
4 | const innerHTML = 'body {}';
5 |
6 | describe('Code', () => {
7 | const mock = Mock(Code);
8 | const props = {
9 | language: 'css',
10 | children: ['body {}']
11 | };
12 |
13 | it('returns a code element wrapped in a div with the right classes', () => {
14 | const node = mock.render({ props });
15 | assertElement.isNode(node, 'div');
16 | assertElement.hasClass(node, 'matter-Code');
17 | assertElement.hasChildren(node, (child) => {
18 | assertElement.isNode(child, 'code');
19 | assertElement.hasClass(child, 'matter-Code-code');
20 | });
21 | });
22 |
23 | it('sets the code innerHTML attribute to the given child' , () => {
24 | const node = mock.render({ props });
25 | const codeNode = node.children[0];
26 | assertElement.hasAttribute(codeNode, 'innerHTML', innerHTML);
27 | });
28 | });
29 |
--------------------------------------------------------------------------------
/test/grid.js:
--------------------------------------------------------------------------------
1 | /** @jsx element **/
2 |
3 | import { Mock, assert as assertElement } from 'deku-testutils';
4 | import element from 'virtual-element';
5 | import { Grid } from '../';
6 |
7 | describe('Grid', () => {
8 | const mock = Mock(Grid);
9 | const props = { children };
10 |
11 | it('returns a ul with the right classes', () => {
12 | const node = mock.render();
13 | assertElement.isNode(node, 'ul');
14 | assertElement.hasClass(node, 'matter-Grid');
15 | });
16 |
17 | describe('with children', () => {
18 | it('wraps any children', () => {
19 | const children = [ 'Hello World' ];
20 | const node = mock.render({ props });
21 | assertElement.hasChildren(node, children);
22 | });
23 | });
24 | });
25 |
--------------------------------------------------------------------------------
/test/menu.js:
--------------------------------------------------------------------------------
1 | /** @jsx element **/
2 |
3 | import { Mock, mount, assert as assertElement } from 'deku-testutils';
4 | import trigger from 'compat-trigger-event';
5 | import assert from 'assert';
6 | import element from 'virtual-element';
7 | import { Menu } from '../';
8 |
9 | describe('Menu', () => {
10 | const mock = Mock(Menu);
11 | const props = { items: ['foo', 'bar', 'baz'] };
12 |
13 | it('returns a menu with the right classes', () => {
14 | const node = mock.render({ props });
15 | assertElement.isNode(node, 'div');
16 | assertElement.hasClass(node, 'matter-Menu');
17 | assertElement.hasChildren(node, (child) => {
18 | assertElement.hasClass(child, 'matter-Menu-item');
19 | });
20 | });
21 |
22 | describe('with state', () => {
23 | describe('.activeItem', () => {
24 | it('gets activeItem from state if it exists', () => {
25 | const state = { activeItem: 'bar' };
26 | const node = mock.render({ props, state });
27 | assertElement.hasAttribute(node.children[1], 'active', true);
28 | });
29 | });
30 | });
31 |
32 | describe('with props', () => {
33 | describe('.items', () => {
34 | it('creates a menu item for each member', () => {
35 | const node = mock.render({ props });
36 | assertElement.hasChildren(node, 3);
37 | });
38 | it('sets the first item as active by default', () => {
39 | const node = mock.render({ props });
40 | assertElement.hasAttribute(node.children[0], 'active', true);
41 | });
42 | });
43 | describe('.defaultActive', () => {
44 | it('sets the active item', () => {
45 | const props = {
46 | items: ['foo', 'bar', 'baz'],
47 | defaultActive: 'bar'
48 | };
49 | const node = mock.render({ props });
50 | assertElement.hasAttribute(node.children[1], 'active', true);
51 | });
52 | });
53 | describe('.onChange(item)', () => {
54 | it('fires the event handler', (done) => {
55 | const items = ['foo'];
56 | const app = mount();
57 |
58 | function handle(item) {
59 | assert.strictEqual(item, 'foo');
60 | app.unmount;
61 | done();
62 | }
63 |
64 | trigger(app.element.querySelector('.matter-Menu-item'), 'click');
65 | });
66 | });
67 | });
68 | });
69 |
--------------------------------------------------------------------------------
/test/shape.js:
--------------------------------------------------------------------------------
1 | /** @jsx element **/
2 |
3 | import { Mock, assert as assertElement } from 'deku-testutils';
4 | import element from 'virtual-element';
5 | import { Shape } from '../';
6 |
7 | describe('Shape', () => {
8 | const mock = Mock(Shape);
9 |
10 | it('returns a div with the right classes', () => {
11 | const node = mock.render();
12 | assertElement.isNode(node, 'div');
13 | assertElement.hasClass(node, 'matter-Shape');
14 | });
15 |
16 | describe('with props', () => {
17 | describe('.color', () => {
18 | it('sets the `color` attribute', () => {
19 | const props = { color: 'fire' };
20 | const node = mock.render({ props });
21 | assertElement.hasAttribute(node, 'color', 'fire');
22 | });
23 | });
24 | describe('.size', () => {
25 | it('sets the `size` attribute', () => {
26 | const props = { size: 'small' };
27 | const node = mock.render({ props });
28 | assertElement.hasAttribute(node, 'size', 'small');
29 | });
30 | it('sets the `size` attribute to `medium` by default', () => {
31 | const node = mock.render();
32 | assertElement.hasAttribute(node, 'size', 'medium');
33 | });
34 | });
35 | describe('.kind', () => {
36 | it('sets the `kind` attribute', () => {
37 | const props = { kind: 'circle' };
38 | const node = mock.render({ props });
39 | assertElement.hasAttribute(node, 'kind', 'circle');
40 | });
41 | it('sets the `kind` attribute to `rectangle` by default', () => {
42 | const node = mock.render();
43 | assertElement.hasAttribute(node, 'kind', 'rectangle');
44 | });
45 | });
46 | describe('.space', () => {
47 | it('sets the `space` attribute', () => {
48 | const props = { space: 'small' };
49 | const node = mock.render({ props });
50 | assertElement.hasAttribute(node, 'space', 'small');
51 | });
52 | it('sets the `space` attribute to `medium` by default', () => {
53 | const node = mock.render();
54 | assertElement.hasAttribute(node, 'space', 'medium');
55 | });
56 | });
57 | });
58 | describe('with children', () => {
59 | it('wraps children', () => {
60 | const props = { children: [ 'Hello World' ] };
61 | const node = mock.render({ props });
62 | assertElement.hasChildren(node, props.children);
63 | });
64 | });
65 | });
66 |
--------------------------------------------------------------------------------
/test/table.js:
--------------------------------------------------------------------------------
1 | /** @jsx element **/
2 |
3 | import { Mock, assert as assertElement, findAllWithClass } from 'deku-testutils';
4 | import element from 'virtual-element';
5 | import { Table } from '../';
6 |
7 | describe('Table', () => {
8 | const mock = Mock(Table);
9 | const props = {
10 | rows: [
11 | ['foo', 'bar'],
12 | ['baz', 'quz']
13 | ]
14 | };
15 |
16 | it('returns a table with the right classes', () => {
17 | const node = mock.render({ props });
18 | assertElement.isNode(node, 'table');
19 | assertElement.hasClass(node, 'matter-Table');
20 | });
21 |
22 | describe('with props', () => {
23 | describe('.rows', () => {
24 | it('creates rows with the right classes', () => {
25 | const node = mock.render({ props });
26 | assertElement.hasChildren(node, (tbody) => {
27 | assertElement.isNode(tbody, 'tbody');
28 | assertElement.hasChildren(tbody, (row) => {
29 | assertElement.isNode(row, 'tr');
30 | assertElement.hasClass(row, 'matter-Table-row');
31 | });
32 | });
33 | });
34 |
35 | it('creates cells with the right classes', () => {
36 | const node = mock.render({ props });
37 | const rows = findAllWithClass(node, 'matter-Table-row');
38 | assertElement.hasChildren(rows[0], (cell) => {
39 | assertElement.isNode(cell, 'td');
40 | assertElement.hasClass(cell, 'matter-Table-cell');
41 | });
42 | });
43 | });
44 | });
45 | });
46 |
--------------------------------------------------------------------------------
/test/text-field.js:
--------------------------------------------------------------------------------
1 | /** @jsx element **/
2 |
3 | import { Mock, assert as assertElement } from 'deku-testutils';
4 | import element from 'virtual-element';
5 | import { TextField } from '../';
6 |
7 | describe('TextField', () => {
8 | const mock = Mock(TextField);
9 | const props = {
10 | placeholder: 'foo'
11 | };
12 |
13 | it('returns an input field with the right classes', () => {
14 | const node = mock.render({ props });
15 | assertElement.isNode(node, 'input');
16 | assertElement.hasClass(node, 'matter-TextField');
17 | });
18 |
19 | describe('with props', () => {
20 | describe('.placeholder', () => {
21 | it('sets the `placeholder` attribute', () => {
22 | const node = mock.render({ props });
23 | assertElement.hasAttribute(node, 'placeholder', 'foo');
24 | });
25 | });
26 | });
27 | });
28 |
--------------------------------------------------------------------------------