diff --git a/content/index.md b/content/index.md index 843085d00..f4303f3e6 100644 --- a/content/index.md +++ b/content/index.md @@ -1,115 +1,41 @@ --- -title: Welcome to Quartz - Color Preview +title: Welcome to My Brain Dump --- -# Quartz Color Configuration Preview +# Welcome to My Brain Dump -This page showcases all the color configurations available in this Quartz repository using Obsidian-formatted markdown. +This is my personal digital garden where I capture thoughts, ideas, and notes on anything that sparks my curiosity. -## Text Colors & Highlights +## What is this place? -Regular text appears in the default dark color (`#2b2b2b`). +This brain dump serves as my external memory—a place where I can: -==This text is highlighted using the text highlight color (`#fff23688`)== +- **Document Learning**: Notes from courses, books, articles, and videos +- **Explore Ideas**: Thoughts on technology, design, philosophy, and more +- **Track Projects**: Development logs, experiments, and side projects +- **Connect Concepts**: Links between different areas of knowledge -> [!info] Information Callout -> This callout uses the secondary color (`#284b63`) for its accent. Callouts are great for drawing attention to important information. +## How to Navigate -> [!tip] Tip Callout -> This callout uses the tertiary color (`#84a59d`) for its accent. Tips provide helpful suggestions. +Feel free to explore using: -> [!warning] Warning Callout -> Warning callouts help highlight potential issues or important considerations. +- The **search bar** to find specific topics +- The **explorer** on the left to browse folders +- The **graph view** to see connections between notes +- **Tags** to find related content -> [!example] Example Callout -> Example callouts are useful for demonstrating concepts or providing samples. +## Recent Areas of Interest -## Links and Interactive Elements +- Software Engineering & Architecture +- Machine Learning & AI +- Product Design & UX +- Robotics & Automation +- Philosophy & Ethics in Technology -Here's a [[non-existent page]] wiki-link that will appear in gray (`#b8b8b8`). +## A Living Document -Regular [markdown links](https://quartz.jzhao.xyz) use the secondary color (`#284b63`). - -## Code Blocks - -Inline code like `const color = "#284b63"` uses the darkgray color (`#4e4e4e`) for background. - -```javascript -// Code blocks showcase syntax highlighting -const theme = { - light: "#e8e6dd", - lightgray: "#e5e5e5", - gray: "#b8b8b8", - darkgray: "#4e4e4e", - dark: "#2b2b2b", - secondary: "#284b63", - tertiary: "#84a59d", - highlight: "rgba(143, 159, 169, 0.15)", - textHighlight: "#fff23688" -}; - -console.log("Colors configured!"); -``` - -```bash -chmod +x executable -``` - -## Typography Showcase - -### Headers use Schibsted Grotesk font - -Body text uses Source Sans Pro font for optimal readability. - -`Code uses IBM Plex Mono` for clear distinction. - -## Lists and Formatting - -- **Bold text** stands out -- *Italic text* for emphasis -- ~~Strikethrough~~ for deprecated content - -### Task Lists -- [ ] Uncompleted task -- [x] Completed task using tertiary color - -## Tables - -| Color Variable | Hex Value | Usage | -|---------------|-----------|--------| -| light | #e8e6dd | Background color | -| lightgray | #e5e5e5 | Borders and dividers | -| gray | #b8b8b8 | Muted text | -| darkgray | #4e4e4e | Code backgrounds | -| dark | #2b2b2b | Main text color | -| secondary | #284b63 | Links and accents | -| tertiary | #84a59d | Secondary accents | - -## Block Quotes - -> Block quotes use the lightgray color (`#e5e5e5`) for their left border. -> -> They're great for highlighting important passages or quotes. - -## Horizontal Rules - -The line below uses the lightgray color: +This space is constantly evolving. Notes may be incomplete, ideas might be half-formed, and thoughts could change over time. That's the beauty of a brain dump—it's a work in progress, just like learning itself. --- -## Mathematical Expressions - -Inline math: $E = mc^2$ - -Block math: -$$ -\int_{-\infty}^{\infty} e^{-x^2} dx = \sqrt{\pi} -$$ - -## Tags and Metadata - -Tags like #color-preview #theme-configuration use the tertiary color. - ---- - -*Note: This preview page demonstrates how the color scheme defined in `quartz.config.ts` is applied throughout the site. The background uses the light color (`#e8e6dd`), while various UI elements utilize the full color palette for visual hierarchy.* +*If you're interested in more polished content, you can learn more [about me](https://ededdyedward.com/about)* or check out my [blog](https://ededdyedward.com/blog) diff --git a/quartz.layout.ts b/quartz.layout.ts index ad06366da..55a095cad 100644 --- a/quartz.layout.ts +++ b/quartz.layout.ts @@ -8,8 +8,9 @@ export const sharedPageComponents: SharedLayout = { afterBody: [], footer: Component.Footer({ links: { - GitHub: "https://github.com/jackyzha0/quartz", - "Discord Community": "https://discord.gg/cRFFHYye7t", + GitHub: "https://github.com/Edwardius", + LinkedIn: "https://www.linkedin.com/in/eddy-zhou-6968b8184/", + YouTube: "https://www.youtube.com/channel/UCBYnPI9wfTCs-dCgo6_B45g", }, }), } @@ -26,7 +27,7 @@ export const defaultContentPageLayout: PageLayout = { Component.TagList(), ], left: [ - Component.PageTitle(), + Component.LogoLink(), Component.MobileOnly(Component.Spacer()), Component.Flex({ components: [ @@ -50,7 +51,7 @@ export const defaultContentPageLayout: PageLayout = { export const defaultListPageLayout: PageLayout = { beforeBody: [Component.Breadcrumbs(), Component.ArticleTitle(), Component.ContentMeta()], left: [ - Component.PageTitle(), + Component.LogoLink(), Component.MobileOnly(Component.Spacer()), Component.Flex({ components: [ diff --git a/quartz/components/Footer.tsx b/quartz/components/Footer.tsx index cff28cbb9..47b5c68b2 100644 --- a/quartz/components/Footer.tsx +++ b/quartz/components/Footer.tsx @@ -14,8 +14,7 @@ export default ((opts?: Options) => { return (