git ssb - seperated styles into it · punkmonk/double@6f9ed108

Commit 6f9ed10872eb05dbde900a885c8e412c20447599

seperated styles into it

s own component

austinfrey committed on 11/7/2018, 3:59:34 AM
Parent: 98f461d19e74598f16307611691908bfb204ccad

Files changed

components/nav.js	changed
components/styles.js	added
index.js	changed
package-lock.json	changed
package.json	changed
stores/ledger.js	changed
views/accounts.js	changed
views/entries.js	changed
views/transactions.js	changed
views/404.js	deleted
manifest.json	deleted

components/nav.jsView
		@@ -1,24 +1,22 @@
1	1 …	var Component = require('choo/component')
2	2 …	const h = require('hyperscript')
3		-const style = require('../assets/styles')
4	3 …
5	4 …	class Nav extends Component {
6	5 …	constructor (id, state, emit) {
7	6 …	super(id)
8	7 …	this.local = state.components[id] = {}
9	8 …	}
10	9 …
11	10 …	createElement () {
12		- return h('nav.pv3', [
13		- style,
14		- h('a.link.dim.black.b.f6.f5-ns.dib.mr3', {
	11 …	+ return h('nav.tc.pv5', [
	12 …	+ h('a.link.dim.black.b.f6.f5-ns.dib.mr5', {
15	13 …	href: '/'
16	14 …	}, 'home'),
17		- h('a.link.dim.gray.f6.f5-ns.dib.mr3', {
	15 …	+ h('a.link.dim.gray.f6.f5-ns.dib.mr5', {
18	16 …	href: '/transactions'
19	17 …	}, 'transactions'),
20		- h('a.link.dim.gray.f6.f5-ns.dib.mr3', {
	18 …	+ h('a.link.dim.gray.f6.f5-ns.dib', {
21	19 …	href: '/accounts'
22	20 …	}, 'accounts')
23	21 …	])
24	22 …	}

components/styles.jsView
		@@ -1,0 +1,20 @@
	1 …	+var Component = require('choo/component')
	2 …	+const h = require('hyperscript')
	3 …	+const stylesheet = require('../assets/styles')
	4 …	+
	5 …	+class Styles extends Component {
	6 …	+ constructor (id, state, emit) {
	7 …	+ super(id)
	8 …	+ this.local = state.components[id] = {}
	9 …	+ }
	10 …	+
	11 …	+ createElement () {
	12 …	+ return h('div', stylesheet)
	13 …	+ }
	14 …	+
	15 …	+ update () {
	16 …	+ return true
	17 …	+ }
	18 …	+}
	19 …	+
	20 …	+module.exports = Styles

index.jsView
		@@ -1,9 +1,5 @@
1		-var css = require('sheetify')
2	1 …	var choo = require('choo')
3		-
4		-css('tachyons')
5		-
6	2 …	var app = choo()
7	3 …
8	4 …	if (process.env.NODE_ENV !== 'production') {
9	5 …	app.use(require('choo-devtools')())
		@@ -15,7 +11,6 @@
15	11 …
16	12 …	app.route('/', require('./views/entries'))
17	13 …	app.route('/transactions', require('./views/transactions'))
18	14 …	app.route('/accounts', require('./views/accounts'))
19		-app.route('/*', require('./views/404'))
20	15 …
21	16 …	module.exports = app.mount('body')

package-lock.jsonView
The diff is too large to show. Use a local git client to view these changes. Old file size: 384592 bytes New file size: 187662 bytes

package.jsonView
		@@ -2,31 +2,24 @@
2	2 …	"name": "double",
3	3 …	"version": "1.0.0",
4	4 …	"private": true,
5	5 …	"scripts": {
6		- "build": "bankai build index.js",
7	6 …	"create": "choo-scaffold",
8	7 …	"electro": "electro .",
9	8 …	"electro:clean": "rm .test.db accounts.json entries.json && electro .",
10		- "inspect": "bankai inspect index.js",
11		- "start": "bankai start index.js",
12	9 …	"test": "standard && npm run test-deps",
13	10 …	"test-deps": "dependency-check . && dependency-check . --extra --no-dev -i tachyons"
14	11 …	},
15	12 …	"dependencies": {
16	13 …	"choo": "^6.13.0",
17		- "choo-service-worker": "^2.4.0",
18	14 …	"flumecodec": "0.0.1",
19	15 …	"flumedb": "^1.0.0",
20	16 …	"flumelog-offset": "^3.3.2",
21	17 …	"flumeview-reduce": "^1.3.14",
22	18 …	"hyperscript": "^2.0.2",
WritePreview
23		- "pull-paramap": "^1.2.2",
24		- "sheetify": "^7.3.3",
25		- "tachyons": "^4.11.1"
	19 …	+ "pull-paramap": "^1.2.2"
26	20 …	},
27	21 …	"devDependencies": {
28		- "bankai": "^9.15.0",
29	22 …	"choo-devtools": "^2.5.1",
30	23 …	"choo-scaffold": "^1.2.0",
31	24 …	"dependency-check": "^3.2.1",
32	25 …	"electro": "^2.1.1",

stores/ledger.jsView
		@@ -15,16 +15,20 @@
15	15 …	function ledgerStore (state, emitter) {
16	16 …	state.accounts = {}
17	17 …	state.entries = []
18	18 …
19		- pull(db.accounts.stream(), drain(acctState => {
20		- state.accounts = acctState
21		- emitter.emit.RENDER
	19 …	+ pull(
	20 …	+ db.accounts.stream(),
	21 …	+ drain(acctState => {
	22 …	+ state.accounts = acctState
	23 …	+ emitter.emit.RENDER
22	24 …	}, onDone))
23	25 …
24		- pull(db.entries.stream(), drain(entryState => {
25		- state.entries = entryState
26		- emitter.emit.RENDER
	26 …	+ pull(
	27 …	+ db.entries.stream(),
	28 …	+ drain(entryState => {
	29 …	+ state.entries = entryState
	30 …	+ emitter.emit.RENDER
27	31 …	}, onDone))
28	32 …
29	33 …	function onLoad () {
30	34 …	emitter.on('accounts', onEvent)
		@@ -57,8 +61,9 @@
57	61 …
58	62 …	return acc
59	63 …	}
60	64 …	if (item.type !== 'accounts') return acc
	65 …	+
61	66 …	const { msg } = item
62	67 …
63	68 …	if (!acc[msg.name]) {
64	69 …	acc[msg.name] = msg

views/accounts.jsView
		@@ -1,31 +1,33 @@
1	1 …	const h = require('hyperscript')
2	2 …	const TITLE = 'double - acounts'
3	3 …	const Nav = require('../components/nav')
	4 …	+const Styles = require('../components/styles')
4	5 …
5	6 …	function accountsView (state, emit) {
6	7 …	return h('body.code.ph3.lh-copy', [
	8 …	+ state.cache(Styles, 'styles').render(),
7	9 …	state.cache(Nav, 'nav').render(),
8		- h('table', [
	10 …	+ h('table.center', [
9	11 …	h('thead', h('tr', [
10	12 …	h('td.pr2.red', 'account'),
11	13 …	h('td.pr2', 'balance')
12	14 …	])),
13	15 …	h('tbody', Object.keys(state.accounts).map(key => {
14	16 …	return state.accounts[key].archived
15	17 …	? h('tr', [
16		- h('td.strike', state.accounts[key].name),
	18 …	+ h('td.strike', {onclick: handleAccountArchive}, state.accounts[key].name),
17	19 …	h('td.tr.strike', state.accounts[key].debit - state.accounts[key].credit)
18	20 …	])
19	21 …	: h('tr', [
20	22 …	h('td', {onclick: handleAccountArchive}, state.accounts[key].name),
21	23 …	h('td.tr', state.accounts[key].debit - state.accounts[key].credit)
22	24 …	])
23	25 …	}))
24	26 …	]),
25		- h('div', [
	27 …	+ h('div.tc', [
26	28 …	h('div.pt4', 'create a new account'),
27		- h('form.pb3', h('input#account')),
	29 …	+ h('form.pb3', h('input#account', {placeholder: 'account name'})),
28	30 …	h('button', { onclick: handleAccountCreate }, 'create')
29	31 …	])
30	32 …	])
31	33 …
		@@ -36,9 +38,11 @@
36	38 …	}
37	39 …
38	40 …	function handleAccountArchive () {
39	41 …	const name = this.innerHTML
40		-
	42 …	+ if (state.accounts[name].archived) {
	43 …	+ return emit('accounts', { type: 'accounts', msg: { name, archived: false } })
	44 …	+ }
41	45 …	emit('accounts', { type: 'accounts', msg: { name, archived: true } })
42	46 …	}
43	47 …	}
44	48 …

views/entries.jsView
		@@ -1,7 +1,8 @@
1	1 …	const h = require('hyperscript')
2	2 …	const TITLE = 'double - entries'
3	3 …	const Nav = require('../components/nav')
	4 …	+const Styles = require('../components/styles')
4	5 …
5	6 …	function view (state, emit) {
6	7 …	if (state.title !== TITLE) emit(state.events.DOMTITLECHANGE, TITLE)
7	8 …
		@@ -26,10 +27,11 @@
26	27 …
27	28 …	const submit = h('div.pb3', h('button', { onclick: handleEntry }, 'submit'))
28	29 …
29	30 …	return h('body.code.ph3.lh-copy', [
	31 …	+ state.cache(Styles, 'styles').render(),
30	32 …	state.cache(Nav, 'nav').render(),
31		- h('main', [
	33 …	+ h('main.tc', [
32	34 …	form,
33	35 …	submit
34	36 …	])
35	37 …	])

views/transactions.jsView
		@@ -1,11 +1,12 @@
1	1 …	var h = require('hyperscript')
2	2 …	const TITLE = 'double - transactions'
3	3 …	const Nav = require('../components/nav')
	4 …	+const Styles = require('../components/styles')
4	5 …
5	6 …	function transactionsView (state, emit) {
6		- const entries = h('div.pb6', [
7		- h('table', [
	7 …	+ const entries = h('div.tc.pb6', [
	8 …	+ h('table.center', [
8	9 …	h('thead', h('tr', [
9	10 …	h('td.pr2', 'account'),
10	11 …	h('td.pr2', 'debit'),
11	12 …	h('td.pr2', 'credit'),
		@@ -29,8 +30,9 @@
29	30 …	])
30	31 …	])
31	32 …
32	33 …	return h('body.code.ph3.lh-copy', [
	34 …	+ state.cache(Styles, 'styles').render(),
33	35 …	state.cache(Nav, 'nav').render(),
34	36 …	entries
35	37 …	])
36	38 …	}

views/404.jsView
		@@ -1,15 +1,0 @@
1		-var html = require('choo/html')
2		-
3		-var TITLE = 'double - route not found'
4		-
5		-module.exports = view
6		-
7		-function view (state, emit) {
8		- if (state.title !== TITLE) emit(state.events.DOMTITLECHANGE, TITLE)
9		- return html`
10		- <body class="sans-serif pa3">
11		- <h1>Route not found.</h1>
12		- <a class="pt2" href="/">Back to main.</a>
13		- </body>
14		- `
15		-}

manifest.jsonView
		@@ -1,14 +1,0 @@
1		-{
2		- "name": "double",
3		- "short_name": "double",
4		- "description": "double entry accounting app",
5		- "start_url": "/",
6		- "display": "standalone",
7		- "background_color": "#000",
8		- "theme_color": "#000",
9		- "icons": [{
10		- "src": "/assets/icon.png",
11		- "type": "image/png",
12		- "sizes": "512x512"
13		- }]
14		-}

Built with git-ssb-web

punkmonk / double

Commit 6f9ed10872eb05dbde900a885c8e412c20447599

seperated styles into it

Files changed