fix head.tsx

This commit is contained in:
Jacky Zhao
2023-08-08 20:36:24 -07:00
parent 41b4ce443b
commit e0d145a0f5
4 changed files with 29 additions and 26 deletions

View File

@ -3,14 +3,14 @@ import { JSResourceToScriptElement } from "../resources"
import { QuartzComponentConstructor, QuartzComponentProps } from "./types"
export default (() => {
function Head({ fileData, externalResources }: QuartzComponentProps) {
function Head({ cfg, fileData, externalResources }: QuartzComponentProps) {
const slug = canonicalizeServer(fileData.slug!)
const title = fileData.frontmatter?.title ?? "Untitled"
const description = fileData.description ?? "No description provided"
const description = fileData.description?.trim() ?? "No description provided"
const { css, js } = externalResources
const baseDir = pathToRoot(slug)
const iconPath = baseDir + "/static/icon.png"
const ogImagePath = baseDir + "/static/og-image.png"
const ogImagePath = `https://${cfg.baseUrl}/static/og-image.png`
return (
<head>
@ -18,8 +18,8 @@ export default (() => {
<meta charSet="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta property="og:title" content={title} />
<meta property="og:description" content={title} />
<meta property="og:image" content={ogImagePath} />
<meta property="og:description" content={description} />
{cfg.baseUrl && <meta property="og:image" content={ogImagePath} />}
<meta property="og:width" content="1200" />
<meta property="og:height" content="675" />
<link rel="icon" href={iconPath} />

BIN
quartz/static/og-image.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 38 KiB

View File

@ -269,24 +269,28 @@ h6 {
// typography improvements
h1 {
font-size: 1.75rem;
margin-top: 2.75rem;
margin-top: 2.25rem;
margin-bottom: 1rem;
}
h2 {
font-size: 1.4rem;
margin-top: 2.4rem;
margin-top: 1.9rem;
margin-bottom: 1rem;
}
h3 {
font-size: 1.12rem;
margin-top: 2.12rem;
margin-top: 1.62rem;
margin-bottom: 1rem;
}
h4,
h5,
h6 {
font-size: 1rem;
margin-top: 2rem;
margin-top: 1.5rem;
margin-bottom: 1rem;
}
div[data-rehype-pretty-code-fragment] {