git ssb - first pass dark them · mixmix/ticktack@2034e26e

mix irving committed on 5/9/2018, 12:49:42 AM
Parent: 81bbaa6bd8489fef897a37bb689a642019279f22

app/html/header.js	changed
app/html/header.mcss	changed
app/html/sideNav/sideNav.mcss	changed
app/page/settings.js	changed
app/sync/initialize/settings.js	changed
app/sync/initialize/styles.js	changed
package-lock.json	changed
package.json	changed
translations/en.js	changed

app/html/header.jsView
		@@ -28,21 +28,27 @@
28	28 …
29	29 …	return h('Header', [
30	30 …	windowControls(),
31	31 …	h('nav', [
32		- h('img.feed', {
33		- src: when(isFeed, assetPath('feed_on.png'), assetPath('feed.png')),
34		- 'ev-click': () => push({page: 'blogIndex'})
35		- }),
36		- h('img.addressBook', {
37		- src: when(isAddressBook, assetPath('address_bk_on.png'), assetPath('address_bk.png')),
38		- 'ev-click': () => push({page: 'addressBook'})
39		- }),
40		- h('img.settings', {
41		- src: when(isSettings, assetPath('settings_on.png'), assetPath('settings.png')),
42		- 'ev-click': () => push({page: 'settings'})
43		- }),
44		- h('i.fa', {
	32 …	+ h('i.feed', [
	33 …	+ h('img', {
	34 …	+ src: when(isFeed, assetPath('feed_on.png'), assetPath('feed.png')),
	35 …	+ 'ev-click': () => push({page: 'blogIndex'})
	36 …	+ })
	37 …	+ ]),
	38 …	+ h('i.addressBook', [
	39 …	+ h('img', {
	40 …	+ src: when(isAddressBook, assetPath('address_bk_on.png'), assetPath('address_bk.png')),
	41 …	+ 'ev-click': () => push({page: 'addressBook'})
	42 …	+ })
	43 …	+ ]),
	44 …	+ h('i.settings', [
	45 …	+ h('img.settings', {
	46 …	+ src: when(isSettings, assetPath('settings_on.png'), assetPath('settings.png')),
	47 …	+ 'ev-click': () => push({page: 'settings'})
	48 …	+ })
	49 …	+ ]),
	50 …	+ h('i.notifications.fa', {
45	51 …	className: when(isNotifications, 'fa-bell', 'fa-bell-o'),
46	52 …	'ev-click': () => push({page: 'statsShow'})
47	53 …	})
48	54 …	])

app/html/header.mcssView
		@@ -28,17 +28,19 @@
28	28 …	display: flex
29	29 …	align-items: center
30	30 …	justify-content: center
31	31 …
32		- img, i {
	32 …	+ i {
33	33 …	cursor: pointer
34	34 …	text-decoration: none
	35 …	+ font-size: 1.4rem
35	36 …
	37 …	+ display: flex
36	38 …	margin: 0 2rem
37	39 …	}
38	40 …
39		- i { font-size: 1.4rem }
40		- i.fa-bell-o { color: #7da9ea }
	41 …	+ i.notifications { color: #7da9ea }
	42 …	+ i.fa-bell.notifications { color: #fff }
41	43 …
42	44 …	(a) {
43	45 …	color: #222
44	46 …	margin-right: 1rem

app/html/sideNav/sideNav.mcssView
		@@ -60,8 +60,9 @@
60	60 …	div.spacer {
61	61 …	display: flex
62	62 …	align-self: center
63	63 …	div.alert {
	64 …	+ z-index: 99
WritePreview
64	65 …	position: relative
65	66 …	width: 1.2rem
66	67 …	height: 1.2rem
67	68 …	border-radius: 1rem

app/page/settings.jsView
		@@ -80,8 +80,12 @@
80	80 …	h('section -zoom', [
81	81 …	h('div.left', strings.settingsPage.section.zoom),
82	82 …	h('div.right', [zoomButton(-0.1, '-'), zoomButton(+0.1, '+')])
83	83 …	]),
	84 …	+ h('section -theme', [
	85 …	+ h('div.left', strings.settingsPage.section.theme),
	86 …	+ h('div.right', ['light', 'dark'].map(Theme))
	87 …	+ ]),
84	88 …	h('section -sharing', [
85	89 …	h('div.left', strings.share.settings.caption),
86	90 …	h('div.right', [].concat(
87	91 …	webSharingOption('public', strings.share.settings.publicOption),
		@@ -108,8 +112,21 @@
108	112 …	strings.languages[lang]
109	113 …	)
110	114 …	}
111	115 …
	116 …	+ function Theme (theme) {
	117 …	+ const currentTheme = api.settings.obs.get('ticktack.theme')
	118 …	+ const className = computed(currentTheme, t => t === theme ? '-strong' : '')
	119 …	+
	120 …	+ return h('Button -language',
	121 …	+ {
	122 …	+ 'ev-click': () => currentTheme.set(theme),
	123 …	+ className
	124 …	+ },
	125 …	+ strings.themes[theme]
	126 …	+ )
	127 …	+ }
	128 …	+
112	129 …	function zoomButton (increment, symbol) {
113	130 …	const { getCurrentWebContents } = electron.remote
114	131 …	return h('Button -zoom',
115	132 …	{

app/sync/initialize/settings.jsView
		@@ -14,9 +14,10 @@
14	14 …	ticktack: {
15	15 …	websharemetrics: 'public',
16	16 …	electron: {
17	17 …	zoomFactor: 1
18		- }
	18 …	+ },
	19 …	+ theme: 'light'
19	20 …	}
20	21 …	}
21	22 …
22	23 …	exports.create = function (api) {

app/sync/initialize/styles.jsView
		@@ -1,19 +1,43 @@
1	1 …	const nest = require('depnest')
2		-const insertCss = require('insert-css')
	2 …	+const { h, computed } = require('mutant')
3	3 …	const values = require('lodash/values')
4	4 …
5	5 …	exports.gives = nest('app.sync.initialize')
6	6 …
7	7 …	exports.needs = nest({
8		- 'styles.css': 'reduce'
	8 …	+ 'styles.css': 'reduce',
	9 …	+ 'settings.obs.get': 'first'
9	10 …	})
10	11 …
	12 …	+const darkMod = `
	13 …	+body {
	14 …	+ filter: invert(88%);
	15 …	+}
	16 …	+
	17 …	+body .Page img {
	18 …	+ filter: invert();
	19 …	+}
	20 …	+div.Thumbnail {
	21 …	+ filter: invert();
	22 …	+}
	23 …	+body .Lightbox img {
	24 …	+ filter: invert();
	25 …	+}
	26 …	+`
	27 …	+
11	28 …	exports.create = (api) => {
12	29 …	return nest({
13	30 …	'app.sync.initialize': function initializeStyles () {
14	31 …	console.log('> initialise: styles')
15	32 …	const css = values(api.styles.css()).join('\n')
16		- insertCss(css)
	33 …	+
	34 …	+ document.head.appendChild(
	35 …	+ h('style', {
	36 …	+ innerHTML: computed(api.settings.obs.get('ticktack.theme'), theme => {
	37 …	+ return [css, theme === 'dark' ? darkMod : ''].join('\n')
	38 …	+ })
	39 …	+ })
	40 …	+ )
17	41 …	}
18	42 …	})
19	43 …	}

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

translations/en.jsView
		@@ -2,8 +2,12 @@
2	2 …	stats: 'Stats',
3	3 …	comments: 'Comments',
4	4 …	likes: 'Likes',
5	5 …	shares: 'Shares',
	6 …	+ themes: {
	7 …	+ light: 'Light',
	8 …	+ dark: 'Dark'
	9 …	+ },
6	10 …	splash: {
7	11 …	about: [
8	12 …	'A social network that values openness, equality, and freedom.',
9	13 …	'A new social network for people seeking an equitable world that values the value people create and successfully balances freedom, solidarity, privacy, and openness.',
		@@ -74,9 +78,10 @@
74	78 …	name: 'Name',
75	79 …	introduction: 'Introduction',
76	80 …	language: 'Language',
77	81 …	zoom: 'Zoom',
78		- version: 'Version'
	82 …	+ version: 'Version',
	83 …	+ theme: 'Theme (beta)'
79	84 …	}
80	85 …	},
81	86 …	addressBook: {
82	87 …	action: {

mixmix / ticktack