Commit ce182a6ed828db9aa940f352cf28de6409530165
mvp settings page with style hacking (pairing with Zach!)
mix irving committed on 4/8/2018, 10:01:05 AMParent: 0aa1e55ffcfbd06056d917ca218a05fb8733cbae
Files changed
app/html/app.js | changed |
app/page/settings.js | added |
router/sync/routes.js | changed |
app/html/app.js | ||
---|---|---|
@@ -22,9 +22,9 @@ | ||
22 | 22 … | console.log('STARTING app') |
23 | 23 … | |
24 | 24 … | window = api.app.sync.window(window) |
25 | 25 … | |
26 | - const initialTabs = ['/public', '/inbox', '/notifications'] // NB router converts these to { page: '/public' } | |
26 … | + const initialTabs = ['/settings','/public', '/inbox', '/notifications'] // NB router converts these to { page: '/public' } | |
27 | 27 … | const App = h('App', api.app.html.tabs(initialTabs)) |
28 | 28 … | |
29 | 29 … | api.app.sync.initialise(App) |
30 | 30 … | // runs all the functions in app/sync/initialise |
app/page/settings.js | |||
---|---|---|---|
@@ -1,0 +1,48 @@ | |||
1 … | +const nest = require('depnest') | ||
2 … | +const { h } = require('mutant') | ||
3 … | +const insertCss = require('insert-css') | ||
4 … | +const compileCss = require('micro-css') | ||
5 … | + | ||
6 … | +exports.gives = nest({ | ||
7 … | + 'app.html.menuItem': true, | ||
8 … | + 'app.page.settings': true | ||
9 … | +}) | ||
10 … | + | ||
11 … | +exports.needs = nest({ | ||
12 … | + 'app.sync.goTo': 'first' | ||
13 … | +}) | ||
14 … | + | ||
15 … | +exports.create = function (api) { | ||
16 … | + return nest({ | ||
17 … | + 'app.html.menuItem': menuItem, | ||
18 … | + 'app.page.settings': publicPage | ||
19 … | + }) | ||
20 … | + | ||
21 … | + function menuItem () { | ||
22 … | + return h('a', { | ||
23 … | + style: { order: 1 }, | ||
24 … | + 'ev-click': () => api.app.sync.goTo({ page: 'settings' }) | ||
25 … | + }, '/settings') | ||
26 … | + } | ||
27 … | + | ||
28 … | + function publicPage (location) { | ||
29 … | + const styles = h('textarea') | ||
30 … | + return h('SettingsPage', [ | ||
31 … | + styles, | ||
32 … | + h('button', {'ev-click': () => peachify(styles)}, 'peachify') | ||
33 … | + ]) | ||
34 … | + | ||
35 … | + function peachify (styles) { | ||
36 … | + const css = compileCss(styles.value) | ||
37 … | + // body{ | ||
38 … | + // background-color: peachpuff; | ||
39 … | + // color: indigo; } | ||
40 … | + | ||
41 … | + // a:link, a:visited, a:active { | ||
42 … | + // color: #116a6a; } | ||
43 … | + // ` | ||
44 … | + insertCss(css) | ||
45 … | + } | ||
46 … | + } | ||
47 … | + | ||
48 … | +} |
router/sync/routes.js | ||
---|---|---|
@@ -12,9 +12,11 @@ | ||
12 | 12 … | 'profile': 'first', |
13 | 13 … | 'search': 'first', |
14 | 14 … | 'blob': 'first', |
15 | 15 … | 'thread': 'first', |
16 | - 'channel': 'first' | |
16 … | + 'channel': 'first', | |
17 … | + 'settings': 'first' | |
18 … | + | |
17 | 19 … | }, |
18 | 20 … | 'keys.sync.id': 'first' |
19 | 21 … | }) |
20 | 22 … | |
@@ -30,8 +32,9 @@ | ||
30 | 32 … | [ loc => loc.page === 'notifications', pages.notifications ], |
31 | 33 … | [ loc => loc.page === 'errors', pages.errors ], |
32 | 34 … | [ loc => loc.page === 'profile', () => pages.profile({ feed: myId }) ], |
33 | 35 … | [ loc => loc.page === 'search' && loc.query, pages.search ], |
36 … | + [ loc => loc.page === 'settings', pages.settings], | |
34 | 37 … | |
35 | 38 … | [ loc => isBlob(loc.blob), pages.blob ], |
36 | 39 … | [ loc => isPresent(loc.channel), pages.channel ], |
37 | 40 … | [ loc => isFeed(loc.feed), pages.profile ], |
Built with git-ssb-web