xP: indicate hidden buffer lines

xP/public/xP.css

@@ -43,6 +43,9 @@ body {
 	bottom: -1px;
 	background: #ccc;
 }
+button {
+	font: inherit;
+}
 
 .middle {
 	flex: auto;
@@ -111,9 +114,8 @@ body {
 	font-weight: bold;
 }
 .unread {
-	height: 1px;
 	grid-column: span 2;
-	background: #ff5f00;
+	border-top: 1px solid #ff5f00;
 }
 .time {
 	padding: .1em .3em;
@@ -121,6 +123,13 @@ body {
 	color: #bbb;
 	border-right: 1px solid #ccc;
 }
+.time.hidden:after {
+	border-top: .2em dotted #ccc;
+	display: block;
+	width: 50%;
+	margin: 0 auto;
+	content: "";
+}
 .mark {
 	padding-right: .3em;
 	text-align: center;

xP/public/xP.js

@@ -580,13 +580,20 @@ let Buffer = {
 			return m('.buffer')
 
 		let lastDateMark = undefined
+		let squashing = false
 		let markBefore = b.lines.length
 			- b.newMessages - b.newUnimportantMessages
 		b.lines.forEach((line, i) => {
 			if (i == markBefore)
 				lines.push(m('.unread'))
-			if (line.isUnimportant && b.hideUnimportant)
+
+			if (!line.isUnimportant || !b.hideUnimportant) {
+				squashing = false
+			} else if (squashing) {
 				return
+			} else {
+				squashing = true
+			}
 
 			let date = new Date(line.when)
 			let dateMark = date.toLocaleDateString()
@@ -594,6 +601,11 @@ let Buffer = {
 				lines.push(m('.date', {}, dateMark))
 				lastDateMark = dateMark
 			}
+			if (squashing) {
+				lines.push(m('.time.hidden'))
+				lines.push(m('.content'))
+				return
+			}
 
 			let attrs = {}
 			if (line.leaked)