proper backlink and graph display in footer

nondescryptid · Jul 18, 2021 · 6896cb0 · 6896cb0
1 parent 672a641
commit 6896cb0
Show file tree

Hide file tree

Showing 14 changed files with 96 additions and 20 deletions.
diff --git a/assets/base.scss b/assets/base.scss
@@ -198,4 +198,33 @@ a[href^="/"] {
   @media all and (max-width: 1200px) {
     margin: 25px 5vw;
   }
+}
+
+.page-end {
+  display: flex;
+  flex-direction: row;
+
+  & > * {
+    flex: 1 0 0;
+  }
+
+  & > .backlinks-container {
+    & > ul {
+      list-style: none;
+      padding-left: 0;
+      margin-right: 2em;
+
+      & > li {
+        margin: 0.5em 0;
+        padding: 0.25em 1em;
+        border: var(--outlinegray) 1px solid;
+        border-radius: 5px
+      }
+    }
+  }
+
+  & #graph-container {
+    border: var(--outlinegray) 1px solid;
+    border-radius: 5px
+  }
 }
diff --git a/config.toml b/config.toml
@@ -1,6 +1,6 @@
 baseURL = "https://quartz.jzhao.xyz/"
 languageCode = "en-us"
-googleAnalytics = "UA-148413215-1"
+googleAnalytics = "G-XYFD95KB4J"
 pygmentsUseClasses = true
 ignoreFiles = ["/content/templates/*"]
 

diff --git a/content/_index.md b/content/_index.md
@@ -1,7 +1,21 @@
-# 💎 Quartz
-Simple second brain and digital garden. 🌱
+# 🌱 Quartz
+Simple second brain and digital garden.
 
 ## Why Quartz?
+Hosting a public digital garden isn't easy. There are an overwhelming number of tutorials, resources, and guides for tools like [Notion](https://www.notion.so/), [Roam](https://roamresearch.com/), and [Obsidian](https://obsidian.md/), yet none of them have super easy to use *free* tools to publish that garden to the world.
+
+I've personally found that 
+1. It's nice to access notes from anywhere
+2. Having a public digital garden invites open conversations
+3. It makes keeping personal notes and knowledge *playful and fun*
+
+> “He who works with the door open gets all kinds of interruptions, but he also occasionally gets clues as to what the world is and what might be important.” — Richard Hamming
+
+**The goal of Quartz is to make hosting your own public digital garden free and simple.**
 
 ## Get Started
-[directory](moc/directory.md)
+The entire Quartz documentation is fully hosted using Quartz! You can navigate it using the interactive Graph view below.
+
+If you'd prefer more traditional navigation, you can also find all relevant pages through the main directory.
+
+👉  [Directory](moc/directory.md)
diff --git a/content/moc/directory.md b/content/moc/directory.md
@@ -1,7 +1,16 @@
 ---
-title: "Directory"
+title: "Quartz Documentation"
 ---
 
-[setup](notes/setup.md)
+Welcome to Quartz! Whether you're setting up a website and project for the first time or a seasoned digital gardener, I hope that you'll find something useful about this project.
+
+Let's get to business and get you started!
+
+## Setup
+📚 [setup](notes/setup.md)
+
+## Configuration
 [config](notes/config.md)
+
+## Troubleshooting
 [troubleshooting](notes/troubleshooting.md)
diff --git a/content/notes/config.md b/content/notes/config.md
@@ -1,3 +1,3 @@
 ---
-title: "config"
+title: "Configuration"
 ---
diff --git a/content/notes/hosting.md b/content/notes/hosting.md
@@ -0,0 +1,9 @@
+---
+title: "Deploying to GitHub Pages"
+---
+
+Change `baseURL` in `/config.toml`
+
+```toml
+baseURL = "https://quartz.jzhao.xyz/"
+```
diff --git a/content/notes/obsidian.md b/content/notes/obsidian.md
@@ -0,0 +1,3 @@
+---
+title: "Obsidian Vault Integration"
+---
diff --git a/data/graphConfig.yaml b/data/graphConfig.yaml
@@ -1,6 +1,6 @@
 enableLegend: false
 enableDrag: true
-enableZoom: false
+enableZoom: true
 base:
   node: "#284b63"
   activeNode: "#f28482"

diff --git a/layouts/404.html b/layouts/404.html
@@ -3,9 +3,9 @@
 {{ partial "head.html" . }}
 
 <body>
-<div id="landing-container">
+<div>
     {{partial "darkmode.html" .}}
-    <div id="landing-overlay" class="lt-content-column">
+    <div>
         <h1>404.</h1>
         <h3>Hey! You look a little lost.</h3>
         <ul id="sub-nav">

diff --git a/layouts/index.html b/layouts/index.html
@@ -9,7 +9,7 @@
     {{.Content}}
 
     <!-- Contact Info -->
-    <div class="lt-centre">
+    <div>
         {{partial "footer.html" .}}
     </div>
 </div>

diff --git a/layouts/partials/backlinks.html b/layouts/partials/backlinks.html
@@ -1,9 +1,16 @@
-<ol class="backlinks">
+<h3>Backlinks</h3>
+<ul class="backlinks">
     {{$curPage := strings.TrimRight "/" .Page.RelPermalink }}
     {{$inbound := index $.Site.Data.linkIndex.index.backlinks $curPage}}
+    {{if $inbound}}
     {{- range $inbound -}}
     <li>
         <a href="{{index . "source"}}">{{index . "source"}}</a>
     </li>
     {{- end -}}
-</ol>
+    {{else}}
+    <li>
+        No backlinks found
+    </li>
+    {{end}}
+</ul>
diff --git a/layouts/partials/footer.html b/layouts/partials/footer.html
@@ -1,11 +1,15 @@
-<div>
-    <hr/>
-    {{partial "backlinks.html" .}}
-    {{partial "graph.html" .}}
+<hr/>
+<div class="page-end">
+    <div class="backlinks-container">
+        {{partial "backlinks.html" .}}
+    </div>
+    <div>
+        {{partial "graph.html" .}}
+    </div>
 </div>
 
 <!-- Contact Info -->
-<div id="contact_buttons" class="lt-centre">
+<div id="contact_buttons">
     <footer>
         <p>Made by {{ $.Site.Data.config.name }} using <a href="https://github.com/jackyzha0/quartz">Quartz</a>, © {{ dateFormat "2006" now }}</p>
         {{ if not .IsHome }}

diff --git a/layouts/partials/graph.html b/layouts/partials/graph.html
@@ -1,4 +1,5 @@
 <script src="https://cdn.jsdelivr.net/npm/d3@6"></script>
+<h3>Interactive Graph</h3>
 <div id="graph-container"></div>
 <style>
     :root {

diff --git a/layouts/partials/head.html b/layouts/partials/head.html
@@ -1,12 +1,12 @@
 <head>
     <link rel="preconnect" href="https://www.googletagmanager.com">
     <link crossorigin rel="preconnect" href="https://www.google-analytics.com">
-    {{ template "_internal/google_analytics_async.html" . }}
+    {{ template "_internal/google_analytics.html" . }}
 
     <!-- Meta tags -->
     <meta charset="UTF-8">
     <meta name="description" content="{{$.Site.Data.config.description}}">
-    <title>{{$.Site.Data.config.page_title}}</title>
+    <title>{{ if .Title }}{{ .Title }}{{ else }}{{ $.Site.Data.config.page_title }}{{ end }}</title>
     <meta name="viewport" content="width=device-width, initial-scale=1">
     <link rel="shortcut icon" type="image/png" href="/icon.png" />