diff --git a/assets/css/layout.css b/assets/css/layout.css index 20b7b8d..b0602e5 100644 --- a/assets/css/layout.css +++ b/assets/css/layout.css @@ -80,6 +80,14 @@ main header { margin-bottom: 3rem; } +main header .draft-label { + display: inline-block; + padding: 0.5rem 1rem; + border: 1px solid; + border-radius: 5px; + font-weight: bold; +} + main header h1 { margin-bottom: 1.6rem; } @@ -105,7 +113,11 @@ main .article-list .item { } main .article-list .item h3 { - margin-bottom: 1rem; + margin-bottom: 0.5rem; +} + +main .article-list p { + margin-top: 0.5rem; } main article footer { diff --git a/assets/css/themes/default-light.css b/assets/css/themes/default-light.css index 513bb28..aba1576 100644 --- a/assets/css/themes/default-light.css +++ b/assets/css/themes/default-light.css @@ -34,6 +34,11 @@ dl dt { color: #888; } +main header .draft-label { + color: #770202; + border-color: #770202; +} + main header .meta .date { color: #888; } diff --git a/html.ts b/html.ts index 1c1633a..a1e0256 100644 --- a/html.ts +++ b/html.ts @@ -40,10 +40,16 @@ export function errorPageHtml(statusCode: number, title: string): string { export function articleHtml(article: Article, profile: Profile): string { const publishedAtFormatted = localizeDate(article.publishedAt); + const pageTitle = article.isDraft ? `Draft: ${article.title}` : article.title; + let draftLabel = ``; + if (article.isDraft) { + draftLabel = `
Draft version
`; + } const body = `