Initial work on macOS About Design

Mac/MainWindow/About/CreditsNetNewsWireView.swift

@@ -7,71 +7,52 @@
 //
 
 import SwiftUI
+import WebKit
+import Html
+ 
+@available(macOS 12, *)
+struct WebView: NSViewRepresentable {
+
+	var htmlString: String
+ 
+	func makeNSView(context: Context) -> WKWebView {
+		let view = WKWebView()
+		view.loadHTMLString(htmlString, baseURL: nil)
+		return view
+	}
+ 
+	func updateNSView(_ webView: WKWebView, context: Context) {
+		
+	}
+}
 
 @available(macOS 12, *)
 struct CreditsNetNewsWireView: View, LoadableAboutData {
 	var body: some View {
-		ScrollView(.vertical, showsIndicators: false) {
-			Spacer()
-				.frame(height: 12)
-			Section("Primary Contributors") {
-				GroupBox {
-					ForEach(0..<about.PrimaryContributors.count, id: \.self) { i in
-						contributorView(about.PrimaryContributors[i])
-							.padding(.vertical, 2)
-							.listRowInsets(EdgeInsets(top: 0, leading: 12, bottom: 0, trailing: 12))
-					}
-				}
-				
-			}
+		VStack {
+			Image("About")
+				.resizable()
+				.frame(width: 75, height: 75)
 			
-			Section("Additional Contributors") {
-				GroupBox {
-					ForEach(0..<about.AdditionalContributors.count, id: \.self) { i in
-						contributorView(about.AdditionalContributors[i])
-							.padding(.vertical, 2)
-							.listRowInsets(EdgeInsets(top: 0, leading: 12, bottom: 0, trailing: 12))
-					}
-				}
-				
-			}
+			Text(verbatim: "NetNewsWire")
+				.font(.headline)
 			
-			Section("Thanks") {
-				GroupBox {
-					Text(about.ThanksMarkdown)
-						.multilineTextAlignment(.center)
-						.font(.callout)
-						.padding(.vertical, 2)
-				}
-				
-			}
-			Spacer()
-				.frame(height: 12)
+			Text("\(Bundle.main.versionNumber) (\(Bundle.main.buildNumber))")
+				.foregroundColor(.secondary)
+				.font(.callout)
+			
+			Text("label.text.netnewswire-byline", comment: "By Brent Simmons and the NetNewsWire team.")
+				.font(.subheadline)
+			
+			Text("label.markdown.netnewswire-website", comment: "Markdown formatted link to netnewswire.com")
+				.font(.callout)
+			
+			WebView(htmlString: AboutHTML().renderedDocument())
 		}
-		.padding(.horizontal)
-		.frame(width: 400, height: 400)
+		
+		.frame(width: 500, height: 700)
 	}
 	
-	func contributorView(_ appCredit: AboutData.Contributor) -> some View {
-		HStack {
-			Text(appCredit.name)
-			Spacer()
-			if let role = appCredit.role {
-				Text(role)
-					.foregroundColor(.secondary)
-			}
-			Image(systemName: "info.circle")
-				.foregroundColor(.secondary)
-		}
-		.onTapGesture {
-			guard let url = appCredit.url else { return }
-			if let _ = URL(string: url) {
-				Task { @MainActor in
-					Browser.open(url, inBackground: false)
-				}
-			}
-		}
-	}
 }
 
 @available(macOS 12, *)

Mac/Resources/AboutHTML.swift

@@ -0,0 +1,61 @@
+//
+//  AboutHTML.swift
+//  NetNewsWire
+//
+//  Created by Stuart Breckenridge on 28/05/2023.
+//  Copyright © 2023 Ranchero Software. All rights reserved.
+//
+
+import Html
+
+@available(macOS 12, *)
+struct AboutHTML: LoadableAboutData {
+
+	private func stylesheet() -> StaticString {
+	"""
+		body {
+			margin: 2em;
+			color: #333333;
+			background-color: white;
+			line-height: 0.7em;
+			font-family: -apple-system;
+			text-align: center;
+			font-size: 0.7em;
+		}
+		
+		h3 { padding-top: 10px; padding-bottom: 10px; }
+		@media (prefers-color-scheme: dark) {
+			body {
+			color: white;
+			background-color: #333333;
+			}
+			
+			a { color: rgba(94, 158, 244, 1); }
+		}
+	"""
+	}
+	
+	private func document() -> Node {
+		return Node.document(
+			.html(
+				.head(
+					  .style(safe: stylesheet())
+				),
+				.body(
+					Node.h3(.text(NSLocalizedString("label.text.primary-contributors", comment: "Primary Contributors"))),
+					Node.fragment(about.PrimaryContributors.map { .p(.a(attributes: [.href($0.url ?? "")], "\($0.name)")) }),
+					Node.h3(.text(NSLocalizedString("label.text.additional-contributors", comment: "Additional Contributors"))),
+					Node.fragment(about.AdditionalContributors.map { .p(.a(attributes: [.href($0.url ?? "")], "\($0.name)")) })
+				)
+			)
+		)
+	}
+	
+	func renderedDocument() -> String {
+		return render(document())
+	}
+}
+
+
+
+

Mac/Resources/en-GB.lproj/Localizable.strings

@@ -454,6 +454,12 @@
 /* You've added all available extensions. */
 "label.text.added-all-extensions" = "You've added all available extensions.";
 
+/* Primary Contributors */
+"label.text.primary-contributors" = "Primary Contributors";
+
+/* Additional Contributors */
+"label.text.additional-contributors" = "Additional Contributors";
+
 /* Article */
 "label.text.article" = "Article";
 

Mac/Resources/en.lproj/Localizable.strings

@@ -447,6 +447,12 @@
 /* You've added all available extensions. */
 "label.text.added-all-extensions" = "You've added all available extensions.";
 
+/* Primary Contributors */
+"label.text.primary-contributors" = "Primary Contributors";
+
+/* Additional Contributors */
+"label.text.additional-contributors" = "Additional Contributors";
+
 /* Article */
 "label.text.article" = "Article";