git ssb - minimal frameless setup · mixmix/ticktack@ab603970

Commit ab6039706a099a9c4a6c9e4ff04749ba3ed998d6

minimal frameless setup

mix irving committed on 2/11/2018, 1:42:35 AM
Parent: 9a9177d891de3415bfefa1a639dd2ca57dcf7cce

Files changed

app/html/header.js	changed
app/html/header.mcss	changed
index.js	changed

app/html/header.jsView
		@@ -1,8 +1,9 @@
1	1	const nest = require('depnest')
2	2	const { h, computed, when } = require('mutant')
3	3	const get = require('lodash/get')
4	4	const path = require('path')
	5	+const remote = require('electron').remote
5	6
6	7	exports.gives = nest('app.html.header')
7	8
8	9	exports.needs = nest('keys.sync.id', 'first')
		@@ -23,23 +24,45 @@
23	24	})
24	25
25	26	if (loc().page === 'splash') return
26	27
	28	+ const window = remote.getCurrentWindow()
	29	+ const minimize = () => window.minimize()
	30	+ const maximize = () => {
	31	+ if (!window.isMaximized()) window.maximize()
	32	+ else window.unmaximize()
	33	+ }
	34	+ const close = () => window.close()
	35	+
27	36	const isSettings = computed(loc, loc => SETTINGS_PAGES.includes(loc.page))
28	37	const isAddressBook = computed(loc, loc => loc.page === 'addressBook')
29	38	const isFeed = computed([isAddressBook, isSettings], (p, s) => !p && !s)
30	39
31	40	return h('Header', [
	41	+ h('div.window-controls', [
	42	+ h('img.min', {
	43	+ src: assetPath('minimize.png'),
	44	+ 'ev-click': minimize
	45	+ }),
	46	+ h('img.max', {
	47	+ src: assetPath('maximize.png'),
	48	+ 'ev-click': maximize
	49	+ }),
	50	+ h('img.close', {
	51	+ src: assetPath('close.png'),
	52	+ 'ev-click': close
	53	+ })
	54	+ ]),
32	55	h('nav', [
33		- h('img.feed', {
	56	+ h('img.feed', {
34	57	src: when(isFeed, assetPath('feed_on.png'), assetPath('feed.png')),
35	58	'ev-click': () => push({page: 'blogIndex'}),
36	59	}),
37		- h('img.addressBook', {
	60	+ h('img.addressBook', {
38	61	src: when(isAddressBook, assetPath('address_bk_on.png'), assetPath('address_bk.png')),
39	62	'ev-click': () => push({page: 'addressBook'})
40	63	}),
41		- h('img.settings', {
	64	+ h('img.settings', {
42	65	src: when(isSettings, assetPath('settings_on.png'), assetPath('settings.png')),
43	66	'ev-click': () => push({page: 'settings'})
44	67	}),
45	68	]),
		@@ -49,5 +72,4 @@
49	72
50	73	function assetPath (name) {
51	74	return path.join(__dirname, '../../assets', name)
52	75	}
53		-

app/html/header.mcssView
		@@ -1,8 +1,23 @@
1	1	Header {
	2	+ div.window-controls {
	3	+ position: fixed
	4	+ right: 0
	5	+ z-index: 100
	6	+
	7	+ display: flex
	8	+
	9	+ img {
	10	+ padding: .5rem
	11	+ cursor: pointer
	12	+ :hover {
	13	+ filter: drop-shadow(rgba(255, 255, 255, .5) 0 0 2px)
	14	+ }
	15	+ }
	16	+ }
	17	+
2	18	nav {
3	19	$colorPrimary
4		- $navFA
5	20	padding: 1rem 0
6	21
7	22	width: 100%
8	23	height: 1.5rem
		@@ -29,5 +44,4 @@
29	44	text-decoration: underline
30	45	}
31	46	}
32	47	}
33		-

index.jsView
		@@ -85,8 +85,10 @@
85	85	width: windowState.width,
86	86	height: windowState.height,
87	87	autoHideMenuBar: true,
88	88	title: 'Ticktack',
	89	+ frame: false,
	90	+ titleBarStyle: 'hidden',
89	91	show: true,
90	92	backgroundColor: '#EEE',
91	93	icon: './assets/icon.png'
92	94	})
		@@ -132,5 +134,4 @@
132	134
133	135	window.loadURL('file://' + Path.join(__dirname, 'assets', 'base.html'))
134	136	return window
135	137	}
136		-

Built with git-ssb-web

mixmix / ticktack

Commit ab6039706a099a9c4a6c9e4ff04749ba3ed998d6

minimal frameless setup

Files changed