LUCASTUCIOUS
072ee64127
feat: Feature/custom callout icon (#727)
* Add icons as masks To handle a simple way to add custom icons, i made it pure css. Icon are now a mask for the callout-icon div, so they always follow the --color form the current callout. Now to add a custom icon, you simply add ```css .callout { &[data-callout="custom"] { --color: #customcolor; --border: #custombordercolor; --bg: #custombg; --callout-icon: url('data:image/svg+xml; utf8, <custom formatted svg>'); } ``` to custom.scss * remove now unused code * Make callouts an enum * docs: update instructions for custom callouts * Prettier & run format * dynamic matching For maintainability, make dynamic mathching. If we or Obsidian want to support more callouts, we simply add it to the enum * callout mapping const Getting ride of the enum entierly as it's not worth here? * fix callout icon styling * Add forgotten icons * Rebase * harmonize callout icon and fold icon * fix docs + prettier * Update docs/features/callouts.md Co-authored-by: Jacky Zhao <j.zhao2k19@gmail.com> * Update quartz/plugins/transformers/ofm.ts Co-authored-by: Jacky Zhao <j.zhao2k19@gmail.com> * Suggestions fix * remove unecessary rules * comment is always nice * Update docs/features/callouts.md --------- Co-authored-by: Jacky Zhao <j.zhao2k19@gmail.com>
Quartz v4
“[One] who works with the door open gets all kinds of interruptions, but [they] also occasionally gets clues as to what the world is and what might be important.” — Richard Hamming
Quartz is a set of tools that helps you publish your digital garden and notes as a website for free. Quartz v4 features a from-the-ground rewrite focusing on end-user extensibility and ease-of-use.
🔗 Read the documentation and get started: https://quartz.jzhao.xyz/
Sponsors
Description
Languages
TypeScript
85.3%
SCSS
8.8%
JavaScript
5.8%