From f672e3492eb875cbf374cd8515a4a2ab01c8ff4d Mon Sep 17 00:00:00 2001 From: "@gapmiss" Date: Fri, 29 May 2026 17:19:19 -0500 Subject: [PATCH] Document data-badge-type CSS attribute for plain-text badges Co-Authored-By: Claude Opus 4.5 --- README.md | 20 ++++++++++++++++++++ 1 file changed, 20 insertions(+) diff --git a/README.md b/README.md index c84633c..b09752f 100644 --- a/README.md +++ b/README.md @@ -264,6 +264,26 @@ body { } ``` +##### Styling plain-text badges by type + +Plain-text badges include a `data-badge-type` attribute containing the `KEY` value, enabling CSS targeting of specific badge types. + +###### examples + +```css +/* Style all "Status" badges */ +.inline-badge-extra[data-badge-type="Status"] { + background-color: rgba(var(--color-green-rgb), .22); + color: rgba(var(--color-green-rgb), .88); +} + +/* Style "Priority" badges differently */ +.inline-badge-extra[data-badge-type="Priority"] { + background-color: rgba(var(--color-red-rgb), .22); + color: rgba(var(--color-red-rgb), .88); +} +``` + ### Dataview View and copy example dataview queries: [badges-dataview](assets/badges-dataview.md)