Make date line a lighter text color. Issue #2361

Shared/Article Rendering/ArticleRenderer.swift

@@ -164,6 +164,12 @@ private extension ArticleRenderer {
 		else {
 			d["avatars"] = ""
 		}
+		
+		if self.title.isEmpty {
+			d["dateline_style"] = "articleDatelineTitle"
+		} else {
+			d["dateline_style"] = "articleDateline"
+		}
 
 		var feedLink = ""
 		if let feedTitle = article.webFeed?.nameForDisplay {

Shared/Article Rendering/shared.css

@@ -34,6 +34,7 @@ a:hover {
 	--system-message-color: #cbcbcb;
 	--feedlink-color: rgba(0, 0, 0, 0.3);
 	--article-title-color: #333;
+	--article-date-color: rgba(0, 0, 0, 0.5);
 	--table-cell-border-color: lightgray;
 }
 
@@ -44,6 +45,7 @@ a:hover {
 		--system-message-color: #5f5f5f;
 		--feedlink-color: rgba(255, 255, 255, 0.7);
 		--article-title-color: #e0e0e0;
+		--article-date-color: rgba(255, 255, 255, 0.5);
 		--table-cell-border-color: dimgray;
 	}
 }
@@ -60,10 +62,6 @@ body .header {
 	color: var(--header-color);
 }
 
-body .articleDateline, body .articleDateLine.a:link, body .articleDateline a:visited {
-	color: var(--header-color);
-}
-
 body code, body pre {
 	color: var(--body-code-color);
 }
@@ -101,6 +99,15 @@ body > .systemMessage {
 }
 
 .articleDateline a:link, .articleDateline a:visited {
+	color: var(--article-date-color);
+}
+
+.articleDatelineTitle {
+	margin-bottom: 25px;
+	font-weight: bold;
+}
+
+.articleDatelineTitle a:link, .articleDatelineTitle a:visited {
 	color: var(--article-title-color);
 }
 

Shared/Article Rendering/template.html

@@ -9,6 +9,6 @@
 
 <article>
 <div class="articleTitle"><h1>[[title]]</h1></div>
-<div class="articleDateline">[[date_medium]]</div>
+<div class="[[dateline_style]]">[[date_medium]]</div>
 <div class="articleBody">[[body]]</div>
 </article>