A Hugo theme optimized for publishing personal evergreen notes.
It is forked from Jethro Kuan's Cortex theme, with a number of enhancements to more closely mimic Andy Matuschak's notes site.
Example Site: Little Ocean Star Wars Knowledge Graph
Features:
- Opens new pages in an ever-growing list to maintain context of how you arrived at a page.
- Tracks and displays "backlinks" between pages to allow for related concept exploration.
- Shows preview of content on link hover to get a peek at the content before opening.
- Customizable look-and-feel via configuration to personalize.
- Text search to find interesting starting points into the knowledge graph.
In order for search to work, you must have a /content/search/_index.md
file, so that /search
is a valid url.
The default theme style matches Andy Matuschak's notes site. You can configure the look and feel of the site using the [params.styles]
property in your config.toml
.
Here is a basic dark theme that can be tweaked:
[params.styles]
# Base styles for entire site
color = "#fff"
backgroundColor = "#000"
lineHeight = "1.6"
fontFamily = "Arial, sans-serif"
# Styles for header
headerBackgroundColor = "#111"
headerBorderBottomColor = "#666"
headerColor = "#fafafa"
# Styles for pages
pageBackgroundColor = "#000"
pageBorderLeftColor = "#333"
pageLinkColor = "#10B981"
pageMaxWidth = "625px"
pageFontSize = "16px"
pageLineHeight = "22px"
# Styles for the "backlink" section at the bottom of each page
backlinksBackgroundColor = "#222"
backlinksBorderRadius = "3px"
backlinkLabelColor = "#aaa"
backlinkTitleColor = "#ccc"
backlinkPreviewColor = "#eee"
backlinkHoverBackgroundColor = "#444"
# Styles for the preview hover popup
previewWidth = "500px"
previewMaxHeight = "350px"
previewScale = "0.7"
previewBoxShadowTopColor = "rgba(255, 255, 255, 0.08)"
previewBoxShadowRightColor = "rgba(255, 255, 255, 0.04)"
previewBoxShadowBottomColor = "rgba(255, 255, 255, 0.15)"
previewBoxShadowLeftColor = "rgba(255, 255, 255, 0.04)"
# Styles for the search page
searchExtractColor = "#666"