TokamakPublish
Use Tokamak in your themes for the Publish static generator.
You can either write your entire theme with Tokamak, or integrate it with your existing Plot HTML.
A Tokamak implementation of the .foundation theme is provided under the name .tokamakFoundation.
TokamakHTMLFactory
To make your own Tokamak theme, conform to the TokamakHTMLFactory protocol. That requires the following functions:
struct MyThemeFactory<Site: Website>: TokamakHTMLFactory {
func makeIndexView(for index: Index, context: PublishingContext<Self.Site>) throws -> IndexView
func makeSectionView(
for section: Publish.Section<Self.Site>,
context: PublishingContext<Self.Site>
) throws -> SectionView
func makeItemView(for item: Item<Self.Site>, context: PublishingContext<Self.Site>) throws -> ItemView
func makePageView(for page: Page, context: PublishingContext<Self.Site>) throws -> PageView
func makeTagListView(for page: TagListPage, context: PublishingContext<Self.Site>) throws -> TagListView
func makeTagDetailsView(for page: TagDetailsPage, context: PublishingContext<Self.Site>) throws -> TagDetailsView
}In these functions, you can build a View with SwiftUI-compatible syntax:
struct MyThemeFactory<Site: Website>: TokamakHTMLFactory {
func makePageView(for page: Page, context: PublishingContext<Self.Site>) throws -> PageView {
Text("Welcome to my website")
.font(.largeTitle)
VStack(alignment: .leading) {
page.body
}
.frame(idealWidth: 820, maxWidth: 820)
.padding(.vertical, 40)
Text("2020 © Tokamak Contributors")
.font(.caption)
}
...
}Plot integration
You can include Tokamak views in your Plot HTML with the view Node:
let myHTML = Plot.HTML(
.body(
.h1(.text("My Website")),
.view {
Text("This is a Tokamak ") + Text("View")
.font(.system(.body, design: .monospaced))
},
.view(MyTokamakView())
)
)You can include Plot nodes in your Tokamak views just as easily:
struct ContentView: View {
var body: some View {
Text("My Website")
.font(.largeTitle)
Node.p(
.span("This is a Plot "),
.span(.text("Node"), .style("font-family: monospace"))
)
}
}