ssb: Show unread status on all message types.

apps/ssb.json

@@ -1,5 +1,5 @@
 {
 	"type": "tildefriends-app",
 	"emoji": "🐌",
-	"previous": "&jsq+9gvTsDRmi/t0t1wzftsi/IxkBwivsJEUpA7X/lE=.sha256"
+	"previous": "&k7Wg0DJDUwCnJewRYVmuqF6hL7GEHJzVZic2KO4Z7BQ=.sha256"
 }

apps/ssb/tf-message.js

@@ -423,7 +423,7 @@ ${JSON.stringify(mention, null, 2)}</pre
 			let body;
 			return html`
 				<div
-					class="w3-card-4 w3-theme-d4 w3-border-theme"
+					class="w3-card-4 ${class_background} w3-border-theme"
 					style="margin-top: 8px; padding: 16px; display: inline-block; overflow-wrap: anywhere"
 				>
 					<tf-user id=${self.message.author} .users=${self.users}></tf-user>
@@ -453,7 +453,7 @@ ${JSON.stringify(mention, null, 2)}</pre
 		}
 		if (this.message?.type === 'contact_group') {
 			return html` <div
-				class="w3-card-4 w3-theme-d4 w3-border-theme"
+				class="w3-card-4 ${class_background} w3-border-theme"
 				style="margin-top: 8px; padding: 16px; overflow-wrap: anywhere"
 			>
 				${this.message.messages.map(
@@ -471,7 +471,7 @@ ${JSON.stringify(mention, null, 2)}</pre
 			</div>`;
 		} else if (this.message.placeholder) {
 			return html` <div
-				class="w3-card-4 w3-theme-d4 w3-border-theme"
+				class="w3-card-4 ${class_background} w3-border-theme"
 				style="margin-top: 8px; padding: 16px; overflow-wrap: anywhere"
 			>
 				<a target="_top" href=${'#' + encodeURIComponent(this.message.id)}
@@ -773,7 +773,7 @@ ${JSON.stringify(content, null, 2)}</pre
 						}
 					</style>
 					<div
-						class="w3-card-4 w3-theme-d4 w3-border-theme"
+						class="w3-card-4 ${class_background} w3-border-theme"
 						style="margin-top: 8px; padding: 16px"
 					>
 						<div style="display: flex; flex-direction: row">