Add blog to docs (#484)

* Adding social card infrastructure
* Upgrades doc project to .NET 6
* Adds Playwright
* Changes the console to a web project for Playwright
* Adds social card template
* Added blog content
* Parallelized social image processing
* Updating CI to use .NET 6 for docs build
This commit is contained in:
Phil Scott
2021-07-15 13:53:01 -04:00
committed by GitHub
parent 32d7ea15bd
commit 223642b797
62 changed files with 962 additions and 61 deletions

View File

@ -14,11 +14,21 @@
<link rel="icon" type="image/png" sizes="16x16" href="@Context.GetLink("/assets/favicons/favicon-16x16.png")">
@{
string title = @Document.ContainsKey(Keys.Title) ? $"Spectre.Console - {Document.GetString(Keys.Title)}" : "Spectre.Console";
string description = @Document.ContainsKey(Constants.Description) ? Document.GetString(Constants.Description) : "Spectre.Console is a .NET Standard 2.0 library that makes it easier to create beautiful console applications";
string title = Document.ContainsKey(Keys.Title) ? $"Spectre.Console - {Document.GetString(Keys.Title)}" : "Spectre.Console";
string description = Document.ContainsKey(Constants.Description) ? Document.GetString(Constants.Description) : "Spectre.Console is a .NET Standard 2.0 library that makes it easier to create beautiful console applications";
var card = Outputs.FirstOrDefault(i => i.GetString("DocId") == Model.Id.ToString());
var urlBase = $"https://{Document.GetString(Keys.Host)}/";
}
<title>@title</title>
<meta name="description" content="@description" />
@if(card != null){
<meta name="twitter:card" content="summary_large_image" />
<meta name="og:title" content="@title" />
<meta name="og:description" content="@description" />
<meta name="og:image" content="@(urlBase + card.Destination)" />
}
</head>
<body class="antialiased text-gray-600 min-h-full flex flex-col bg-gray-50">
<header class="flex-none text-sm font-medium bg-gradient-to-b from-gray-200 to-gray-100 ring-1 ring-gray-900 ring-opacity-5 shadow py-2 md:py-4">
@ -66,7 +76,7 @@
}
</div>
@foreach (IDocument document in OutputPages.GetChildrenOf(root).OnlyVisible())
@foreach (IDocument document in OutputPages.GetChildrenOf(root).OrderBy(i => i.GetInt("Order")).OnlyVisible())
{
if(string.IsNullOrWhiteSpace(document.GetTitle()))
{
@ -100,7 +110,10 @@
}
</nav>
<article class="flex-1 min-w-0">
<h1 class="text-gray-800 text-4xl mb-4 font-extrabold">@(Document.GetString(Keys.Title) ?? Document.GetTitle())</h1>
<header class="text-gray-800 mb-4">
<h1 class="text-4xl font-extrabold">@(Document.GetString(Keys.Title) ?? Document.GetTitle())</h1>
@RenderSection("subheading", required: false)
</header>
<div class="prose max-w-none prose-sm lg:prose lg:max-w-none 2xl:prose-xl 2xl:max-w-none text-gray-700 font-light">
@RenderBody()
</div>

View File

@ -1,42 +0,0 @@
<div>
@foreach (IDocument post in Document.GetChildren())
{
IDocument topicDocument = Outputs[nameof(Archives)][$"blog/topics/{post.GetString("topic")}/index.html"];
string excerpt = post.GetString(Statiq.Html.HtmlKeys.Excerpt);
<div>
<div class="p-3 mb-2 bg-light page-box">
<h5><a href="@Context.GetLink(post)">@post.GetString("Title")</a></h5>
<div class="small text-black-50">
@post.GetDateTime("Published").ToLongDateString() in
<a href="@(topicDocument.GetLink())"><span class="badge badge-light">@topicDocument.GetTitle()</span></a>
</div>
@if (!string.IsNullOrEmpty(excerpt))
{
@Html.Raw(excerpt)
<p class="small"><a href="@Context.GetLink(post)">Read more...</a></p>
}
</div>
</div>
}
@{
IDocument older = Document.GetDocument(Keys.Next);
IDocument newer = Document.GetDocument(Keys.Previous);
}
@if (older != null || newer != null)
{
<div class="d-flex flex-row justify-content-between">
<div>
@if (older != null)
{
<a class="btn btn-primary" href="@Context.GetLink(older)" role="button">Older</a>
}
</div>
<div>
@if (newer != null)
{
<a class="btn btn-primary" href="@Context.GetLink(newer)" role="button">Newer</a>
}
</div>
</div>
}
</div>

View File

@ -1,5 +1,11 @@
Title: Borders
Order: 2
Description: "*Spectre.Console* makes it easy to create tables and panels with a variety of different styles of borders."
Highlights:
- Rounded
- Square
- Heavy
- And more...
---
There is different built-in borders you can use for tables and panels.

View File

@ -1,5 +1,9 @@
Title: Colors
Order: 0
Description: "*Spectre.Console* allows easy rendering of the standard ANSI colors of your terminal, and also supports rendering up to 24-bit colors depending on the capabilities of your terminal."
Highlights:
- Predefined common colors
- Easy syntax for inline styling
---
The following is a list of the standard 8-bit colors supported in terminals.

View File

@ -1,5 +1,9 @@
Title: Emojis
Order: 3
Description: "For terminals that support Emojis, *Spectre.Console* supports a simple syntax for rendering emojis."
Highlights:
- ":rocket: becomes 🚀"
- ":waning_gibbous_moon: becomes 🌖"
---
Please note that what emojis that can be used is completely up to

View File

@ -1,5 +1,9 @@
Title: Spinners
Order: 4
Description: "*Spectre.Console* supports over 80 different types of spinners, and allows new ones to be defined. They are used automatically with the controls"
Highlights:
- Status display
- Progress display
---
For all available spinners, see https://jsfiddle.net/sindresorhus/2eLtsbey/embedded/result/

View File

@ -1,5 +1,10 @@
Title: Styles
Order: 1
Description: "*Spectre.Console* makes it easy to write text with different styles beyond colors. Depending on your terminal, it can make it easy to use styles such as"
Highlights:
- Bold, Italic, Underline, strikethrough
- Dim, Invert
- Conceal, slowblink, rapidblink
---
Note that what styles that can be used is defined by the system or your terminal software, and may not appear as they should.

View File

@ -0,0 +1,15 @@
ArchiveSources: => $"blog/posts/**/*"
ArchiveKey: Category
ArchiveKeyComparer: => StringComparer.OrdinalIgnoreCase.ToConvertingEqualityComparer()
ArchiveDestination: >
=> GetInt("Index") <= 1 ? $"blog/{NormalizedPath.OptimizeFileName(GetString("GroupKey"))}/index.html" : $"blog/{NormalizedPath.OptimizeFileName(GetString("GroupKey"))}/{GetInt("Index")}.html"
ArchivePageSize: => 5
ArchiveOrderKey: published
ArchiveOrderDescending: true
Title: Categories
ArchiveTitle: => GetString("GroupKey")
# we only show if we have a group key which means we are a category and not the index and also
# if we are the first page
Hidden: >
=> doc.GetString("GroupKey") != null && doc.GetInt("Index") <= 1 ? false : true
Order: 250

View File

@ -0,0 +1,2 @@
Hidden: true
Order: 1000

View File

@ -0,0 +1,10 @@
Title: Recent Blog Posts
ArchiveSources: => $"blog/posts/**/*"
ArchiveDestination: >
=> GetInt("Index") <= 1 ? $"blog/index.html" : $"blog/{GetInt("Index")}.html"
ArchivePageSize: => 5
ArchiveOrderKey: Published
ArchiveOrderDescending: true
Hidden: >
=> doc.GetInt("Index") == 1 ? false : true
Order: 25

View File

@ -0,0 +1,27 @@
@inherits StatiqRazorPage<IDocument>
@model IDocument
@{
var older = Model.GetDocument(Keys.Next);
var newer = Model.GetDocument(Keys.Previous);
}
@if (older != null || newer != null)
{
<div class="flex flex-row justify-content-between">
<div>
@if (older != null)
{
<a class="py-0.5 px-1 mr-4 text-blue-900 bg-grey-50 border border-blue-200 hover:bg-grey-100 hover:text-blue-800 hover:border-blue-300 rounded transition-colors" href="@Context.GetLink(older)" role="button">Older</a>
}
</div>
<div>
@if (newer != null)
{
<a class="py-0.5 px-1 mr-4 text-blue-900 bg-grey-50 border border-blue-200 hover:bg-grey-100 hover:text-blue-800 hover:border-blue-300 rounded transition-colors" href="@Context.GetLink(newer)" role="button">Newer</a>
}
</div>
</div>
}

View File

@ -0,0 +1,33 @@
@inherits StatiqRazorPage<IEnumerable<IDocument>>
@foreach (var post in Model)
{
<div>
<h3 class="mb-0"><a href="@Context.GetLink(post)">@post.GetString("Title")</a></h3>
@{
var author = post.GetString("Author");
var published = post.GetDateTime("Published");
var category = post.GetString("Category");
}
<div class="mt-2 font-light text-xs md:text-sm">
<span>Posted </span>
@if (published != default(DateTime)) {
<span>@published.ToLongDateString() </span>
}
@if (author != null) {
<span>by @author </span>
}
@if (category != null) {
var categoryUrl = @Context.GetLink($"blog/{NormalizedPath.OptimizeFileName(category)}/index.html");
<span>
to <a class="text-blue-800 underline" href="@categoryUrl">
@category
</a>
</span>
}
</div>
<article>
@Html.Raw(@post.GetString("Excerpt"))
</article>
</div>
}

View File

@ -0,0 +1,14 @@
@inherits StatiqRazorPage<IDocument>
@if (Document.ContainsKey(Keys.GroupKey))
{
@Html.Partial("_posts.cshtml", Document.GetChildren())
@Html.Partial("_nextprevious.cshtml", Document)
}
else
{
@foreach (var tag in Document.GetChildren().OrderByDescending(x => x.GetChildren().Count()))
{
var postCount = tag.GetChildren().Count().ToString();
<a role="button" href="@Context.GetLink(tag)" class="badge badge-light"> @tag.GetTitle() (@postCount)</a>
}
}

View File

@ -0,0 +1,3 @@
@inherits StatiqRazorPage<IDocument>
@Html.Partial("_posts.cshtml", Document.GetChildren())
@Html.Partial("_nextprevious.cshtml", Document)

View File

@ -0,0 +1,9 @@
Title: Hello, World
Description: To help track new releases, updates and planning for Spectre.Console, we've added a new blog to the documentation.
Published: 20210711
Category: News
---
To help track new releases, updates and planning for Spectre.Console, we've added a new blog to the documentation.
Stay tuned for upcoming information related to the 0.41 release!

View File

@ -0,0 +1,19 @@
Title: Short title, less than 50 characters
Description: Longer description, with optional *bold* and **italic** characters. Shouldn't be TOO long but can span multiple lines.
Published: 20210710
Category: Release Notes | News | or whatever
Excluded: true
---
Intro paragraph, maybe even just the description. No need for a title that's included automatically.
## Use second level headers
Main title will be set with h1
## Tasks
1. Set title and description
2. Set proper publish date
3. Set proper category
4. Remove excluded attribute.

View File

@ -0,0 +1,3 @@
@{
Layout = @$"_layout.cshtml";
}

View File

@ -0,0 +1,34 @@
@{
Layout = @"../../_layout.cshtml";
}
@inherits StatiqRazorPage<IDocument>
@{
var author = Model.GetString("Author");
var published = Model.GetDateTime("Published");
var category = Model.GetString("Category");
}
@section subheading{
<div class="mt-2 font-light text-xs md:text-sm">
<span>Posted </span>
@if (published != default(DateTime)) {
<span>@published.ToLongDateString() </span>
}
@if (author != null) {
<span>by @author </span>
}
@if (category != null) {
<span>
to <a class="text-blue-800 underline" href="@Context.GetLink($"blog/{NormalizedPath.OptimizeFileName(@category)}/index.html")">
@category
</a>
</span>
}
</div>
}
@RenderBody()

View File

@ -1,5 +1,6 @@
Title: CommandApp
Order: 2
Description: "**CommandApp** is the entry point for a *Spectre.Console.Cli* command line application. It is used to configure the settings and commands used for execution of the application."
---
`CommandApp` is the entry point for a `Spectre.Console.Cli` command line application. It is used to configure the settings and commands used for execution of the application. Most `Spectre.Console.Cli` applications will need to specify a custom configuration using the `Configure` method.

View File

@ -1,5 +1,6 @@
Title: Creating Commands
Order: 6
Description: "How to create commands for *Spectre.Console.Cli*"
---
Commands in `Spectre.Console.Cli` are defined by creating a class that inherits from either `Spectre.Console.Cli.Command<TSettings>` or `Spectre.Console.Cli.AsyncCommand<TSettings>`. `Command<TSettings>` must implement an `Execute` method that returns an int where as `AsyncCommand<TSettings>` must implement `ExecuteAsync` returning `Task<int>`.

View File

@ -1,6 +1,8 @@
Title: Composing Commands
RedirectFrom: introduction
Order: 8
Description: "The underlying philosophy behind *Spectre.Console.Cli* is to rely on the .NET type system to
declare the commands, but tie everything together via composition."
---
The underlying philosophy behind `Spectre.Console.Cli` is to rely on the .NET type system to

View File

@ -1,5 +1,6 @@
Title: Getting Started
Order: 1
Description: "How to get started using *Spectre.Console.Cli* to write a modern console application that follows industry conventions for command line parsing."
---
`Spectre.Console.Cli` is a modern library for parsing command line arguments. While it's extremely

View File

@ -1,5 +1,6 @@
Title: Spectre.Console.Cli
Order: 10
Order: 80
Description: "The command line interface for the *Spectre.Console* project."
---
<p>Spectre.Console.Cli is a modern library for parsing command line arguments. While it's extremely opinionated in what it does, it tries to follow established industry conventions, and draws its inspiration from applications you use everyday.</p>

View File

@ -1,5 +1,8 @@
Title: Introduction
Order: 1
Description: "*Spectre.Console.Cli* is a modern library for parsing command line arguments. While it's extremely
opinionated in what it does, it tries to follow established industry conventions, and draws
its inspiration from applications you use everyday."
---
`Spectre.Console.Cli` is a modern library for parsing command line arguments. While it's extremely

View File

@ -1,5 +1,6 @@
Title: Migrate from Spectre.Cli
Order: 10
Description: "Migrating from *Specte.Cli* to *Spectre.Console.Cli*"
---
The functionality in `Spectre.Cli` has been moved into the `Spectre.Console`

View File

@ -1,5 +1,6 @@
Title: Specifying Settings
Order: 5
Description: "How to define command line argument settings for your *Spectre.Console.Cli* Commands"
---
Settings for `Spectre.Console.Cli` commands are defined via classes that inherit from `CommandSettings`. Attributes are used to indicate how the parser interprets the command line arguments and create a runtime instance of the settings to be used.

View File

@ -1,5 +1,9 @@
Title: Exceptions
Order: 3
Order: 40
Description: "Exceptions aren't always readable when viewed in the terminal. You can make exception a bit more readable by using the **WriteException** method."
Highlights:
- Color coded output.
- Shorten long identifiers and paths.
---
Exceptions aren't always readable when viewed in the terminal.

View File

@ -1,4 +1,5 @@
Title: Welcome
Description: Spectre.Console is a .NET Standard 2.0 library that makes it easier to create beautiful console applications.
Order: 0
---

View File

@ -1,5 +1,6 @@
Title: Live
Order: 4
Order: 50
Description: Live displays continue to redraw their contents until an action is complete.
---
Live displays continue to redraw their contents until an action is complete.

View File

@ -1,5 +1,9 @@
Title: Live Display
Order: 0
Description: "*Spectre.Console* can update arbitrary widgets in-place."
Highlights:
- Update tables or graphs with new updates.
- Create a custom progress bar that extends the existing control.
---
Spectre.Console can update arbitrary widgets in-place.

View File

@ -1,6 +1,11 @@
Title: Progress
Order: 5
RedirectFrom: progress
Description: "*Spectre.Console* can display information about long running tasks in the console using progress bars."
Highlights:
- Custom styling of progress bars.
- Multiple predefined columns such as Throughput, Estimated Time Remaining, and more.
- Fallback for non-interactive consoles such as CI runners.
---
Spectre.Console can display information about long running tasks in the console.

View File

@ -1,6 +1,10 @@
Title: Status
Order: 10
RedirectFrom: status
Description: "*Spectre.Console* can display information about long running tasks in the console with the Status control."
Highlights:
- Custom spinner control for running tasks.
- Fallback for non-interactive consoles such as CI runners.
---
Spectre.Console can display information about long running tasks in the console.

View File

@ -1,5 +1,10 @@
Title: Markup
Order: 2
Order: 30
Description: The Markup class allows you to output rich text to the console.
Highlights:
- Easily add *color*.
- Add hyperlinks to for supported terminals.
- Emoji 🚀 parsing.
---
The `Markup` class allows you to output rich text to the console.

View File

@ -1,5 +1,6 @@
Title: Prompts
Order: 5
Order: 60
Description: "*Spectre.Console* has multiple controls to assist in user input."
---
<ul>

View File

@ -1,5 +1,10 @@
Title: Multi Selection
Order: 3
Description: "The **MultiSelectionPrompt** can be used when you want the user to select one or many items from a provided list."
Highlights:
- Display multiple items for a user to scroll and choose from.
- Custom page sizes.
- Provide groups of selectable items.
---
The `MultiSelectionPrompt` can be used when you want the user to select

View File

@ -1,5 +1,6 @@
Title: Selection
Order: 1
Description: "The **SelectionPrompt** can be used when you want the user to select a single item from a provided list."
---
The `SelectionPrompt` can be used when you want the user to select

View File

@ -1,6 +1,12 @@
Title: Text prompt
Order: 0
RedirectFrom: prompt
Description: "*Spectre.Console* has multiple input functions for helping receive strongly typed input from a user."
Highlights:
- Confirmation.
- Strongly typed input.
- Input restricted to specific items.
- Secrets such as passwords or keys.
---
Sometimes you want to get some input from the user, and for this

View File

@ -1,5 +1,6 @@
Title: Quick Start
Order: 1
Order: 20
Description: Getting started with *Spectre.Console*
---
The fastest way of getting started using Spectre.Console is

View File

@ -1,5 +1,6 @@
Title: Sponsors
Order: 0
Order: 10
Description: The longevity of *Spectre.Console* is thanks to the support of our sponsors.
---
The following people are [sponsoring](https://github.com/sponsors/patriksvensson)

View File

@ -1,5 +1,10 @@
Title: Bar Chart
Order: 20
Description: "Use **BarChart** to render bar charts to the console."
Highlights:
- Custom colors
- Labels
- Use your own data with a converter.
---
Use `BarChart` to render bar charts to the console.

View File

@ -1,6 +1,11 @@
Title: Calendar
Order: 40
RedirectFrom: calendar
Description: "The **Calendar** is used to render a calendar to the terminal."
Highlights:
- Include highlighted events.
- Culture aware.
- Custom headers.
---
The `Calendar` is used to render a calendar to the terminal.

View File

@ -1,5 +1,6 @@
Title: Canvas Image
Order: 70
Description: "Use *ImageSharp* to parse images and render them as Ascii art to the console."
---
To add [ImageSharp](https://github.com/SixLabors/ImageSharp) superpowers to

View File

@ -1,5 +1,6 @@
Title: Canvas
Order: 60
Description: "**Canvas** is a widget that allows you to render arbitrary pixels to the console."
---
`Canvas` is a widget that allows you to render arbitrary "pixels"

View File

@ -1,6 +1,7 @@
Title: Figlet
Order: 50
RedirectFrom: figlet
Description: "*Spectre.Console* can render FIGlet text by using the **FigletText** class."
---
Spectre.Console can render [FIGlet](http://www.figlet.org/) text by using the `FigletText` class.

View File

@ -1,5 +1,6 @@
Title: Widgets
Order: 9
Order: 70
Description: "*Spectre.Console* supports many built-in widgets to help render beautiful output."
---
<ul>

View File

@ -1,6 +1,11 @@
Title: Rule
Order: 30
RedirectFrom: rule
Description: "The **Rule** class is used to render a horizontal rule (line) to the terminal."
Highlights:
- Custom colors for line and title.
- Specify left, center or right aligned title.
---
The `Rule` class is used to render a horizontal rule (line) to the terminal.

View File

@ -1,6 +1,7 @@
Title: Table
Order: 0
RedirectFrom: tables
Description: "Tables are a perfect way of displaying tabular data in a terminal. *Spectre.Console* is super smart about rendering tables and will adjust all columns to fit whatever is inside them."
---
Tables are a perfect way of displaying tabular data in a terminal.

View File

@ -1,5 +1,9 @@
Title: Tree
Order: 10
Description: "The **Tree** widget can be used to render hierarchical data."
Highlights:
- Custom colors and styles for guidelines.
- Include any *Spectre.Console* widgets as child nodes.
---
The `Tree` widget can be used to render hierarchical data.