Anson/brain-quartz
1
0
Fork 0
mirror of https://gitlab.com/MisterBiggs/brain-quartz.git synced 2025-07-27 00:31:29 +00:00
Code Releases Activity
Files
.github
content
advanced
features
Latex.md
Mermaid diagrams.md
RSS Feed.md
SPA Routing.md
backlinks.md
callouts.md
folder and tag listings.md
full-text search.md
graph view.md
index.md
no-code layout configuration.md
popover previews.md
syntax highlighting.md
table of contents.md
upcoming features.md
tags
build.md
configuration.md
custom domain.md
hosting.md
index.md
migrating from Quartz 3.md
philosophy.md
quartz-layout.png
quartz-transform-pipeline.png
showcase.md
quartz
.gitattributes
.gitignore
.prettierignore
.prettierrc
CODE_OF_CONDUCT.md
LICENSE.txt
README.md
globals.d.ts
index.d.ts
package-lock.json
package.json
quartz.config.ts
quartz.layout.ts
tsconfig.json
028bcec62c3ca019a96783f17eaee1ecce6e092b
brain-quartz/content/features/popover previews.md

939 B
Raw Blame History

title
title
Popover Previews

Like Wikipedia, when you hover over a link in Quartz, there is a popup of a page preview that you can scroll to see the entire content. Links to headers will also scroll the popup to show that specific header in view.

By default, Quartz only fetches previews for pages inside your vault due to CORS. It does this by selecting all HTML elements with the popover-hint class. For most pages, this includes the page title, page metadata like words and time to read, tags, and the actual page content.

When creating components, you can include this popover-hint class to also include it in the popover.

Configuration

  • Remove popovers: set the enablePopovers field in quartz.config.ts to be false.
  • Style: quartz/components/styles/popover.scss
  • Script: quartz/components/scripts/popover.inline.ts