git ssb - settings page includes profile · mixmix/ticktack@ee8e7246

Commit ee8e72469e3082880b91e42e3ed64747ad35033f

settings page includes profile

mix irving committed on 8/27/2017, 11:11:32 PM
Parent: 0052f2414e13f7d307466526f1eeceabc0d27695

Files changed

app/page/groupFind.mcss	changed
app/page/settings.js	changed
app/page/settings.mcss	changed
app/page/userEdit.mcss	changed
app/page/userFind.mcss	changed
styles/mixins.js	changed
translations/en.js	changed
translations/zh.js	changed

app/page/groupFind.mcssView
		@@ -1,7 +1,7 @@
1	1	Page -groupFind {
2	2	div.container {
3		- max-width: 40rem
	3	+ $maxWidthSmaller
4	4	div.search {
5	5	background-color: #fff
6	6
7	7	margin-bottom: 1rem
		@@ -25,9 +25,9 @@
25	25	}
26	26
27	27
28	28	div.results {
29		- max-width: 40rem
	29	+ $maxWidthSmaller
30	30
31	31	div.Link {
32	32	div.result {
33	33	background-color: #fff

app/page/settings.jsView
		@@ -3,8 +3,12 @@
3	3
4	4	exports.gives = nest('app.page.settings')
5	5
6	6	exports.needs = nest({
	7	+ 'about.html.image': 'first',
	8	+ 'about.obs.name': 'first',
	9	+ 'history.sync.push': 'first',
	10	+ 'keys.sync.id': 'first',
7	11	'settings.sync.get': 'first',
8	12	'settings.sync.set': 'first',
9	13	'settings.obs.get': 'first',
10	14	'translations.sync.strings': 'first',
		@@ -23,11 +27,35 @@
23	27	api.settings.obs.get()(() => {
24	28	window.location.reload()
25	29	})
26	30
	31	+ const feed = api.keys.sync.id()
27	32	const strings = api.translations.sync.strings()
28	33	const currentLanguage = api.settings.sync.get('language')
29	34
	35	+ return h('Page -settings', [
	36	+ h('div.container', [
	37	+ h('h1', strings.settingsPage.title),
	38	+ h('section -profile', [
	39	+ h('header', strings.settingsPage.section.profile),
	40	+ h('div.profile', [
	41	+ h('div.name', api.about.obs.name(feed)),
	42	+ api.about.html.image(feed),
	43	+ ]),
	44	+ h('div.actions', [
	45	+ h('Button', { 'ev-click': () => api.history.sync.push({page:'userEdit', feed}) }, [
	46	+ strings.settingsPage.action.edit,
	47	+ h('i.fa.fa-pencil')
	48	+ ])
	49	+ ])
	50	+ ]),
	51	+ h('section -language', [
	52	+ h('header', strings.settingsPage.section.language),
	53	+ h('div.languages', LANGUAGES.map(Language))
	54	+ ])
	55	+ ])
	56	+ ])
	57	+
30	58	function Language (lang) {
31	59	const selectLang = () => api.settings.sync.set({ language: lang })
32	60	const className = currentLanguage === lang ? '-primary' : ''
33	61
		@@ -39,13 +67,7 @@
39	67	lang
40	68	)
41	69	}
42	70
43		- return h('Page -settings', [
44		- h('div.container', [
45		- h('h1', strings.settings),
46		- h('div.languages', LANGUAGES.map(Language))
47		- ])
48		- ])
49	71	}
50	72	}
51	73

app/page/settings.mcssView
		@@ -1,15 +1,54 @@
1	1	Page -settings {
	2	+ padding-top: 1rem
	3	+
2	4	div.container {
3		- div.languages {
4		- background: #fff
5		- padding: 1rem
6		- padding-bottom: 14rem
	5	+ background: #fff
	6	+ padding: 1rem
	7	+ $maxWidthSmaller
7	8
8		- display: flex
	9	+ section {
	10	+ padding-bottom: 2rem
	11	+ margin-bottom: 2rem
	12	+
	13	+ header {
	14	+ font-size: 1.4rem
	15	+ margin-bottom: 1rem
	16	+ }
	17	+
	18	+ -profile {
	19	+ div.profile {
	20	+ display: flex
	21	+ flex-direction: column
	22	+
	23	+ div.name {
	24	+ margin-bottom: .5rem
	25	+ }
	26	+ img.Avatar {
	27	+ width: 8rem
	28	+ height: 8rem
	29	+ }
	30	+ margin-bottom: .5rem
	31	+ }
	32	+
	33	+ div.actions {
	34	+ display:flex
	35	+
	36	+ div.Button {
	37	+ i.fa { margin-left: .4rem }
	38	+ }
	39	+ }
	40	+ }
	41	+
	42	+ -language {
	43	+ div.languages {
	44	+ display: flex
	45	+ }
	46	+ }
9	47	}
10	48	}
11	49	}
12	50
13	51	Button -language {
14	52	margin-right: 1rem
15	53	}
	54	+

app/page/userEdit.mcssView
		@@ -1,7 +1,7 @@
1	1	Page -userEdit {
2	2	div.container {
3		- max-width: 40rem
	3	+ $maxWidthSmaller
4	4
5	5	}
6	6	}
7	7

app/page/userFind.mcssView
		@@ -1,7 +1,7 @@
1	1	Page -userFind {
2	2	div.container {
3		- max-width: 40rem
	3	+ $maxWidthSmaller
4	4	div.search {
5	5	background-color: #fff
6	6
7	7	margin-bottom: 1rem
		@@ -25,9 +25,9 @@
25	25	}
26	26
27	27
28	28	div.results {
29		- max-width: 40rem
	29	+ $maxWidthSmaller
30	30
31	31	div.Link {
32	32	div.result {
33	33	background-color: #fff

styles/mixins.jsView
		@@ -19,8 +19,12 @@
19	19	$maxWidth {
20	20	max-width: 1200px
21	21	}
22	22
	23	+$maxWidthSmaller {
	24	+ max-width: 40rem
	25	+}
	26	+
23	27	$colorPrimary {
24	28	color: white
25	29	background-color: #3dc8c3
26	30

translations/en.jsView
		@@ -25,9 +25,18 @@
25	25	createFirstThread: 'Start this group by posting the first thread.'
26	26	}
27	27	},
28	28	groupIndex: "Group Index",
29		- settings: "Settings",
	29	+ settingsPage: {
	30	+ title: "Settings",
	31	+ action: {
	32	+ edit: 'Edit',
	33	+ },
	34	+ section: {
	35	+ language: 'Language',
	36	+ profile: 'Profile',
	37	+ }
	38	+ },
30	39	threadNew: {
31	40	pageTitle: 'New Thread',
32	41	field: {
33	42	to: 'To',

translations/zh.jsView
		@@ -25,9 +25,11 @@
25	25	createFirstThread: '发布第一个话题来开始群组讨论'
26	26	}
27	27	},
28	28	groupIndex: '群组列表',
29		- settings: '设置',
	29	+ settingsPage: {
	30	+ title: '设置',
	31	+ },
30	32	threadNew: {
31	33	pageTitle: '新建话题',
32	34	field: {
33	35	to: '发送给',

Built with git-ssb-web

mixmix / ticktack

Commit ee8e72469e3082880b91e42e3ed64747ad35033f

settings page includes profile

Files changed