How I Use the Badges Plugin in Obsidian
Badges is a small Obsidian plugin by gapmiss that turns a bit of inline code into a colored label. What it does, the few conventions I settled on, and the parts of my setup that are still on the to-do list.
Tagged · 14 notes
Everything tagged CSS, wherever it's filed, newest first.
Badges is a small Obsidian plugin by gapmiss that turns a bit of inline code into a colored label. What it does, the few conventions I settled on, and the parts of my setup that are still on the to-do list.
Vignelli is my open-source Obsidian theme for people who want their notes to read like a well-set print document, with serif type, gold rules and a teal highlighter.
Thread: The design notebook ↗The section order I use for a one-page site, which sections are required and which earn their place, rough sizes for each, and why the call to action sits right under the hero.
Thread: Building a site for someone ↗A small Chrome extension that swaps the new tab page for a clock, a rotating Unsplash background and a grid of site shortcuts with screenshot thumbnails.
Thread: Desktop tinkering ↗Terminal UI Components is my open-source, pure CSS framework for building terminal-style web interfaces, with ten color themes and box-drawing decorations.
Thread: The design notebook ↗Fine Use is my open-source design system for terminal-style interfaces, a React component plan with CSS themes and a Python desktop implementation, and it's honest about being mostly a specification so far.
Thread: The design notebook ↗Kaybl turns a Plex or Jellyfin library into something that feels like flipping channels. The hard part isn't the channels. It's drawing one guide that works on a TV, a phone and a desktop.
Thread: The design notebook ↗Six colors sampled from a screenshot of a dark RSS reader, the rules that keep amber from turning into a Halloween theme, and what the contrast math actually says.
Thread: The design notebook ↗Massimo Vignelli spent sixty years proving you need a grid, a handful of typefaces and a lot of discipline. What that looks like when the page is a browser window.
Thread: The design notebook ↗How this site borrows the warmth of early-'90s Apple ads (editorial type, cream paper, slate ink) and why the fake menu bars and little beige Mac didn't make the cut.
Thread: The design notebook ↗Hitting print on a recipe blog usually gets you five pages of sidebar. Here's how the recipes on this site print just the card, and why visibility:hidden was the wrong first try.
Thread: Building this notebook ↗Deckport is my open-source Python tool that registers portable native Linux games as Steam Deck non-Steam shortcuts, with artwork, so they show up in Game Mode ready to play.
Thread: Games and gear ↗Your scroll area has overflow:auto, the layout is 100vh, and the whole page scrolls anyway. Blame the automatic minimum size of flex items, and fix it with one line.
Thread: Building this notebook ↗The site looked perfect on my machine and wrong everywhere else. The sneaky reason, and how to self-host web fonts properly.
Thread: Building this notebook ↗