git ssb - have cards arrive more gently · mixmix/ticktack@4e6ec209

mix irving committed on 2/13/2018, 11:36:38 PM
Parent: 140bd2aa4c9baa0075ccea378b2376a4c90cf8fc

app/html/blogCard.js	changed
app/html/blogCard.mcss	changed
app/html/channelCard.mcss	changed
app/html/comments.mcss	changed
app/page/blogIndex.mcss	changed
app/page/blogSearch.mcss	changed
app/page/blogShow.mcss	changed
app/page/channelShow.mcss	changed
app/page/channelSubscriptions.mcss	changed
app/page/settings.mcss	changed
app/page/userShow.mcss	changed
styles/mixins.js	changed

app/html/blogCard.jsView
		@@ -1,6 +1,6 @@
1	1 …	var nest = require('depnest')
2		-var h = require('mutant/h')
	2 …	+var { h, Array: MutantArray } = require('mutant')
3	3 …	// var maxBy = require('lodash/maxBy')
4	4 …	// var markdown = require('ssb-markdown')
5	5 …	// var ref = require('ssb-ref')
6	6 …	// var htmlEscape = require('html-escape')
		@@ -103,11 +103,13 @@
103	103 …	h('i.fa.fa-file-text-o')
104	104 …	])
105	105 …	}
106	106 …
107		- const className = blog.unread ? '-unread' : ''
	107 …	+ var classList = MutantArray(['-arriving'])
	108 …	+ if (blog.unread) classList.push('-unread')
	109 …	+ setImmediate(() => classList.delete('-arriving'))
108	110 …
109		- var b = h('BlogCard', { id, className, 'ev-click': onClick }, [
	111 …	+ var b = h('BlogCard', { id, classList, 'ev-click': onClick }, [
110	112 …	h('div.context', [
111	113 …	api.about.html.avatar(author, 'tiny'),
112	114 …	h('div.name', api.about.obs.name(author)),
113	115 …	api.message.html.timeago(blog)

app/html/channelCard.mcssView
		@@ -2,9 +2,9 @@
2	2 …	$backgroundPrimaryText
3	3 …	padding: 2rem 1.5rem 2rem 1.5rem
4	4 …	flex-basis: 100%
5	5 …
6		- border-bottom: 1px solid rgba(0,0,0, .1)
	6 …	+ $borderBottomLight
7	7 …	transition: all .5s ease
8	8 …
9	9 …	div.content {
10	10 …	padding: 2rem 0

app/html/comments.mcssView
		@@ -19,9 +19,9 @@
19	19 …
20	20 …	div.right {
21	21 …	flex-grow: 1
22	22 …
23		- border-bottom: 1px solid gainsboro
	23 …	+ $borderBottomLight
24	24 …	padding-bottom: 1rem
25	25 …	margin-bottom: 1rem
26	26 …
27	27 …	section.context {

app/page/blogSearch.mcssView
		@@ -46,9 +46,9 @@
46	46 …	section.content {
47	47 …	div.BlogCard {
48	48 …	flex-basis: 100%
49	49 …
50		- border-bottom: 1px solid gainsboro
	50 …	+ $borderBottomLight
51	51 …
52	52 …	:last-child {
53	53 …	border-bottom: none
54	54 …	}

app/page/blogShow.mcssView
		@@ -77,9 +77,9 @@
77	77 …
78	78 …	hr {
79	79 …	margin: 0
80	80 …	border: none
81		- border-bottom: 1px solid gainsboro
	81 …	+ $borderBottomLight
82	82 …	}
83	83 …	}
84	84 …
85	85 …	section.blog {

app/page/channelShow.mcssView
		@@ -48,9 +48,9 @@
48	48 …
49	49 …	div.BlogCard {
50	50 …	flex-basis: 100%
51	51 …
52		- border-bottom: 1px solid gainsboro
	52 …	+ $borderBottomLight
53	53 …
54	54 …	:last-child {
55	55 …	border-bottom: none
56	56 …	}

app/page/channelSubscriptions.mcssView
		@@ -5,9 +5,9 @@
5	5 …	margin: 0 auto
6	6 …	padding: .5rem 2rem
7	7 …
8	8 …	div.ChannelCard {
9		- border-bottom: 1px solid rgba(0,0,0, .1)
	9 …	+ $borderBottomLight
10	10 …	}
11	11 …
12	12 …	div.Button {
13	13 …	max-width: 20rem

app/page/settings.mcssView
		@@ -10,9 +10,9 @@
10	10 …	font-size: 1.5rem
11	11 …	font-weight: 300
12	12 …
13	13 …	padding-bottom: 1rem
14		- border-bottom: 1px solid gainsboro
	14 …	+ $borderBottomLight
15	15 …	margin-top: 0
16	16 …	margin-bottom: 4rem
17	17 …	}
18	18 …

mixmix / ticktack