← Back to stylesheets index

XSLT Documentation Renderer

Overview

This stylesheet turns an XSLT source file into a prose-and-diagram documentation page. It is the renderer invoked by the stylesheet route template in src/xsl/index.xsl, which loads an XSL document via document(@src) and applies templates against it.

The page you are reading is produced by running this stylesheet against itself, which means every rendered element below is both an example of the vocabulary and a live demonstration of the template that consumes it.

The doc: vocabulary

Authors annotate an XSLT module by interleaving elements in the 'https://swa.sh/doc/' namespace between the normal xsl: declarations. The most common elements are listed below.

  • doc:module — top-of-file header with title, version, and sections.
  • doc:section / doc:subsection — narrative groupings with headings.
  • doc:para — a paragraph; may contain inline doc:ref, doc:code, doc:file, doc:path, doc:attr, doc:em, doc:string.
  • doc:note — boxed aside with a doc:type chooser (architecture, implementation, performance, security, design, convention, UX, pattern, styling).
  • doc:example — dispatches on structure: doc:input/doc:output/doc:process/doc:result, or doc:code[@language], or doc:flow/doc:case/doc:parsed.
  • doc:algorithm with doc:step children (optionally nested doc:substep, doc:code, doc:note).
  • doc:template / doc:param / doc:variable / doc:key — placed as a following sibling of the matching xsl: declaration; the renderer couples them by name/match/mode.

Rendering pipeline

The main entry point matches the root xsl:stylesheet and walks its children in document order, dispatching each to a type-specific template.

High-level flow for a single stylesheet source
→Load the XSL source via document(@src)
→Match /xsl:stylesheet and iterate its declarations
→For each xsl:template, render the header then walk its body in template-body mode
→Pair each declaration with its following-sibling doc:* counterpart
→Render inline HTML elements with Tailwind-aware class tokenization
Version 1
match/xslt:stylesheet | /xsl:stylesheet
Entry point. Wraps the output in a prose article and dispatches each top-level declaration of the source stylesheet in document order.
Interface:
Output:
An HTML article with paired narrative and declaration blocks.
Algorithm:
  1. Emit the article shell with Tailwind typography.
  2. Apply templates to the union of doc:* authoring elements and xsl:* declarations.
  3. Each matched element chooses its own presentation template.
article xslt-docproseprose-invertdark:prose-invertmax-w-nonebg-whitedark:bg-gray-900
div p-8
div space-y-6
applydoc:module | doc:section | doc:para | doc:note | doc:example | doc:subsection | xslt:key | xslt:template | xslt:param | xslt:variable | xsl:key | xsl:template | xsl:param | xsl:variable
matchdoc:module
header mb-12pb-8border-b-2border-gray-200dark:border-gray-700
div
h1 doc-titletext-4xlsmallcapstext-gray-900dark:text-gray-100font-seriftext-centermb-12
doc:title
applydoc:section
ifdoc:para[not(parent::doc:section)]
div mt-6text-lgtext-gray-700dark:text-gray-300leading-relaxedmax-w-4xlmx-auto
applydoc:para[not(parent::doc:section)]
ifdoc:version
div doc-metamt-4text-center
span doc-versiontext-smtext-gray-500dark:text-gray-400
Version
doc:version
matchdoc:section
section doc-sectionmb-10 #{@id}
ifdoc:heading
h2 doc-section-titletext-2xlfont-seriftext-gray-800dark:text-gray-200mb-4pb-2border-bborder-gray-200dark:border-gray-700
doc:heading
ifdoc:title
h2 doc-section-titletext-2xlfont-seriftext-gray-800dark:text-gray-200mb-4pb-2border-bborder-gray-200dark:border-gray-700
doc:title
div doc-section-bodyspace-y-4
applydoc:para | doc:example | doc:list | doc:subsection | doc:note | doc:concept
matchdoc:subsection
section doc-subsectionml-6mb-6 #{@id}
h3 doc-subsection-titletext-xlfont-semiboldtext-gray-700dark:text-gray-300mb-3
doc:title | doc:heading
div doc-subsection-bodyspace-y-3
applydoc:para | doc:example | doc:list | doc:note
matchdoc:concept
div doc-conceptbg-blue-50dark:bg-blue-950/30rounded-lgp-4mb-4
h4 font-semiboldtext-blue-900dark:text-blue-300mb-2
doc:term
div text-gray-700dark:text-gray-300
applydoc:definition
applydoc:example
matchdoc:para
p doc-paratext-gray-700dark:text-gray-300leading-relaxedmb-4
apply
matchdoc:example
div doc-examplebg-gray-50dark:bg-gray-800rounded-lgp-4my-4
ifdoc:description
div doc-example-descriptiontext-smtext-gray-600dark:text-gray-400mb-2font-medium
doc:description
whendoc:input | doc:output | doc:process
div space-y-3
ifdoc:input
div doc-example-input
div text-xsuppercasetracking-widertext-gray-500dark:text-gray-400mb-1
Input
div
applydoc:input/*in mode inspector
with$expand-depth=999
ifdoc:variables
div doc-example-variables
div text-xsuppercasetracking-widertext-gray-500dark:text-gray-400mb-1
Variables
div
applydoc:variables/*in mode inspector
with$expand-depth=999
ifdoc:database
div doc-example-database
div text-xsuppercasetracking-widertext-gray-500dark:text-gray-400mb-1
Database
div
applydoc:database/*in mode inspector
with$expand-depth=999
ifdoc:process
div doc-example-process
div text-xsuppercasetracking-widertext-gray-500dark:text-gray-400mb-1
Process
div bg-amber-50dark:bg-amber-950/30roundedborderborder-amber-200dark:border-amber-800p-2text-sm
doc:process
ifdoc:output
div doc-example-output
div text-xsuppercasetracking-widertext-gray-500dark:text-gray-400mb-1
Output
div bg-green-50roundedborderborder-green-200p-2
whendoc:output/*
applydoc:output/*in mode inspector
with$expand-depth=999
otherwise
code text-sm
doc:output
ifdoc:result
div doc-example-result
div text-xsuppercasetracking-widertext-gray-500dark:text-gray-400mb-1
Result
div bg-green-50dark:bg-green-950/30roundedborderborder-green-200dark:border-green-800p-2text-sm
doc:result
whendoc:code[@language]
div doc-code-block
div text-xsuppercasetracking-widertext-gray-500mb-1
doc:code/@language
pre bg-gray-900dark:bg-gray-950text-gray-100dark:text-gray-200roundedp-1overflow-x-auto
doc:code
whendoc:flow
div doc-flowspace-y-2
for eachdoc:flow/doc:stage
div flexitems-center
span text-gray-400mr-2
→
span text-sm
.
whendoc:case
ul list-disclist-insidespace-y-1
for eachdoc:case
li text-smtext-gray-700
code
.
whendoc:parsed
div bg-whiteroundedborderborder-gray-200p-2
applydoc:parsed/*in mode inspector
with$expand-depth=999
ifdoc:reason
div mt-2text-smtext-red-600
strong
Reason:
doc:reason
otherwise
apply*[not(self::doc:description)]in mode inspector
with$expand-depth=999
matchdoc:list
ul doc-listlist-disclist-insidespace-y-1ml-4
for eachdoc:item
li text-gray-700dark:text-gray-300
apply
matchdoc:note
Renders a typed aside. The optional doc:type child picks a color palette and glyph; unknown or missing types fall back to a neutral gray.
Authoring a performance note
xml
<doc:note>
  <doc:type>performance</doc:type>
  <doc:content>XSL keys give O(1) lookup instead of a linear scan.</doc:content>
</doc:note>
aside rolenote
class←
whendoc:type = 'architecture'
whendoc:type = 'implementation'
whendoc:type = 'performance'
whendoc:type = 'security'
whendoc:type = 'design'
whendoc:type = 'convention'
whendoc:type = 'UX'
whendoc:type = 'pattern'
whendoc:type = 'styling'
otherwise
div flexitems-start
span doc-note-markermr-3text-lg
whendoc:type = 'architecture'
whendoc:type = 'implementation'
whendoc:type = 'performance'
whendoc:type = 'security'
whendoc:type = 'design'
whendoc:type = 'convention'
whendoc:type = 'UX'
whendoc:type = 'pattern'
whendoc:type = 'styling'
otherwise
div doc-note-contentflex-1
ifdoc:type
div text-xsuppercasetracking-widermb-1font-semibold
class←
whendoc:type = 'architecture'
whendoc:type = 'implementation'
whendoc:type = 'performance'
whendoc:type = 'security'
whendoc:type = 'design'
whendoc:type = 'convention'
whendoc:type = 'UX'
whendoc:type = 'pattern'
whendoc:type = 'styling'
otherwise
doc:type
applydoc:content | text()[normalize-space()]
matchxslt:param | xsl:param
article borderpy-3px-4border-l-4border-blue-400dark:border-blue-600bg-blue-50dark:bg-blue-950/30rounded-r-lgmb-6
header flexitems-baselinegap-3
span uppercasetracking-widertext-blue-700dark:text-blue-400text-smfont-semibold
Parameter
h3 text-lg
span font-monotext-blue-900dark:text-blue-300
$
@name
if@select
span text-gray-600dark:text-gray-400ml-2
span font-light
(default:
span font-monotext-sm
@select
)
applyfollowing-sibling::doc:param[@name = current()/@name]in mode doc
matchdoc:parammode: doc
div mt-3space-y-3
ifdoc:description
div text-gray-700dark:text-gray-300leading-relaxed
applydoc:description
ifdoc:values
div doc-values
div text-smfont-semiboldtext-gray-600dark:text-gray-400mb-1
Possible values:
ul list-nonespace-y-1
for eachdoc:values/doc:value
li ml-4text-sm
code font-monotext-purple-700dark:text-purple-400
@name
span text-gray-600dark:text-gray-400ml-2
—
.
applydoc:algorithm | doc:note | doc:example
matchxslt:key | xsl:key
article doc-itemdoc-keymb-8border-l-4border-purple-400dark:border-purple-600pl-4
header doc-item-headerflexitems-baselinegap-3
span text-smuppercasetracking-widertext-purple-700dark:text-purple-400font-semibold
Key
h3 doc-item-nametext-lg
span doc-key-namefont-monotext-purple-900dark:text-purple-300
@name
div doc-item-detailsmt-2space-y-1
div doc-detailtext-sm
span doc-detail-labeltext-gray-500dark:text-gray-400
matches
span doc-xpathfont-monotext-gray-700dark:text-gray-300ml-2bg-gray-100dark:bg-gray-800px-2py-1rounded
@match
div doc-detailtext-sm
span doc-detail-labeltext-gray-500dark:text-gray-400
indexed by
span doc-xpathfont-monotext-gray-700dark:text-gray-300ml-2bg-gray-100dark:bg-gray-800px-2py-1rounded
@use
applyfollowing-sibling::doc:key[@name = current()/@name]in mode doc
matchdoc:keymode: doc
div doc-item-bodymt-4space-y-3
ifdoc:description
div text-gray-700dark:text-gray-300leading-relaxed
applydoc:description
ifdoc:performance
div doc-performancebg-green-50dark:bg-green-950/30roundedp-2text-sm
span font-semiboldtext-green-700dark:text-green-400
Performance:
doc:performance
applydoc:algorithm | doc:example | doc:note
matchxslt:variable | xsl:variable
ifnot(@name = 'route' or @name = 'container' or @name = 'slug' or @name = 'home' or @name = 'page' or @name = 'item')
article doc-itemdoc-variablemy-2border-l-4border-green-400pl-4
header doc-item-headerflexitems-baselinegap-3leading-none
span text-smuppercasetracking-widertext-green-700font-semibold
Variable
h3 doc-item-nametext-lg
span font-monotext-green-900
$
@name
if@select
div doc-item-metatext-gray-600
span font-light
≔
code doc-valuefont-monotext-smbg-gray-100px-2py-1rounded
@select
applyfollowing-sibling::doc:variable[@name = current()/@name]in mode doc
matchdoc:variablemode: doc
div mt-4space-y-3
ifdoc:description
div text-gray-700dark:text-gray-300leading-relaxed
applydoc:description
applydoc:algorithm | doc:example | doc:note
matchdoc:algorithm
Renders a numbered list of doc:step children. Each step may embed a short doc:code snippet, a doc:note, or a list of doc:substep children for finer detail.
div doc-algorithmbg-amber-50dark:bg-amber-950/30rounded-lgp-4my-3
div font-semiboldtext-amber-900dark:text-amber-300mb-2
Algorithm:
ol doc-algorithm-stepslist-decimallist-insidespace-y-2ml-4
for eachdoc:step
li text-gray-700dark:text-gray-300
ifdoc:description
span font-medium
doc:description
iftext()[normalize-space()]
text()[normalize-space()]
ifdoc:code
div ml-6mt-1
code bg-whitepx-2py-1roundedtext-sm
doc:code
ifdoc:note
div ml-6mt-1text-smtext-gray-600dark:text-gray-400
doc:note
ifdoc:substep
ul list-disclist-insideml-6mt-2space-y-1
for eachdoc:substep
li text-smtext-gray-600dark:text-gray-400
.
matchxslt:template | xsl:template
$template-num←count(preceding::xslt:template | preceding::xsl:template) + 1
article flexflex-colmb-10borderborder-l-4border-gray-300dark:border-gray-600/70rounded-lg
header flexitems-centergap-5doc-template-headerborder-bbg-gray-200/30dark:bg-gray-800/30border-gray-300dark:border-gray-600px-4py-1
div doc-template-signaturetext-lgflexgap-4items-centerpx-1
when@match
span text-gray-600dark:text-gray-400smallcapsfont-semibold
match
span font-monotext-gray-800dark:text-gray-200
@match
if@mode
span template-modetext-gray-700dark:text-gray-300ml-3
mode:
@mode
if@priority
span template-prioritytext-gray-500dark:text-gray-400ml-3
priority:
@priority
when@name
span text-gray-600dark:text-gray-400smallcapsfont-semibold
template
span font-sansfont-semiboldtext-gray-800dark:text-gray-200
@name
iffollowing-sibling::doc:template[1][ (@match = current()/@match or (not(@match) and not(current()/@match))) and (@name = current()/@name or (not(@name) and not(current()/@name))) and (@mode = current()/@mode or (not(@mode) and not(current()/@mode))) ]
div px-4
applyfollowing-sibling::doc:template[1][ (@match = current()/@match or (not(@match) and not(current()/@match))) and (@name = current()/@name or (not(@name) and not(current()/@name))) and (@mode = current()/@mode or (not(@mode) and not(current()/@mode))) ]in mode doc
div bg-whitedark:bg-blackroundedpx-4py-2
apply*in mode template-body
matchdoc:templatemode: doc
div space-y-3
ifdoc:description
div text-gray-700dark:text-gray-300leading-relaxed
applydoc:description
ifdoc:pattern-analysis
div doc-pattern-analysisbg-yellow-50dark:bg-yellow-950/30roundedp-3
div text-smfont-semiboldtext-yellow-800dark:text-yellow-400mb-2
Pattern Analysis:
dl space-y-2
for eachdoc:pattern-analysis/doc:condition
div flex
dt font-monotext-smtext-yellow-700dark:text-yellow-400mr-3
.
dd text-smtext-gray-700dark:text-gray-300
→
following-sibling::doc:meaning[1]
ifdoc:interface
div doc-interfacebg-cyan-50dark:bg-cyan-950/30roundedp-3
div text-smfont-semiboldtext-cyan-800dark:text-cyan-400mb-2
Interface:
ifdoc:interface/doc:input
div mb-2
span text-smtext-gray-600dark:text-gray-400
Input:
applydoc:interface/doc:input
ifdoc:interface/doc:output
div
span text-smtext-gray-600dark:text-gray-400
Output:
div ml-4text-sm
doc:interface/doc:output
ifdoc:features
div doc-features
div text-smfont-semiboldtext-gray-700mb-1
Features:
ul list-disclist-insideml-4space-y-1
for eachdoc:features/doc:feature
li text-smtext-gray-600
.
applydoc:algorithm | doc:example | doc:note
matchdoc:param[parent::doc:input or parent::doc:output]
div ml-4text-sm
code font-monotext-blue-700
@name
if@optional = 'true'
span text-gray-500ml-1
(optional)
iftext()
span text-gray-600ml-2
—
.
matchxslt:param | xsl:parammode: template-body
div text-gray-600dark:text-gray-400
span text-gray-500dark:text-gray-500
parameter
span text-blue-700dark:text-blue-400ml-2
$
@name
if@select
span text-gray-400mx-1
=
span text-gray-700dark:text-gray-300
@select
matchxslt:variable | xsl:variablemode: template-body
div text-gray-600dark:text-gray-400flexgap-x-2items-baseline
span text-gray-700dark:text-gray-300
$
@name
when@select
span text-gray-400
←
span text-gray-700dark:text-gray-300
@select
when*
span text-gray-400
←
apply*in mode template-body
matchxslt:apply-templates | xsl:apply-templatesmode: template-body
div flexgap-4text-gray-600
span text-gray-700dark:text-gray-300font-medium
apply
if@select
span text-gray-700font-monodark:text-gray-400
@select
if@mode
span text-gray-600dark:text-gray-400
in mode
@mode
ifxslt:with-param | xsl:with-param
div ml-6
for eachxslt:with-param | xsl:with-param
div text-gray-500
span text-gray-400
with
span text-blue-700dark:text-blue-400ml-2
$
@name
span text-gray-400mx-1
=
span text-gray-600
@select
matchxslt:call-template | xsl:call-templatemode: template-body
div text-gray-600ml-4flexitems-centerflex-wrapgap-2
span text-cyan-600dark:text-cyan-500font-medium
call
span text-blue-700dark:text-slate-400underlineunderline-offset-4font-mono
@name
ifxslt:with-param | xsl:with-param
for eachxslt:with-param | xsl:with-param
div text-gray-500flexgap-2
span text-gray-400
with
span text-blue-700dark:text-slate-400
@name
span text-gray-600dark:text-gray-400font-mono
@select
matchxslt:choose | xsl:choosemode: template-body
div text-gray-600py-0my-1rounded-mdshadow-lg
div template-branchesflexflex-wrapgap-x-1gap-y-2
apply*in mode template-body
matchxslt:when | xsl:whenmode: template-body
div template-when
span text-stone-700dark:text-stone-300font-medium
when
span text-gray-600dark:text-gray-400ml-2font-mono
@test
div template-blockpl-4flexflex-col
apply*in mode template-body
matchxslt:otherwise | xsl:otherwisemode: template-body
div template-otherwise
span text-stone-700dark:text-stone-300font-medium
otherwise
div template-blockpl-4flexgap-2flex-col
apply*in mode template-body
matchxslt:value-of | xsl:value-ofmode: template-body
span inline-blocktext-teal-600dark:text-teal-400font-monobg-teal-100dark:bg-teal-800/70px-2py-1
@select
matchxslt:if | xsl:ifmode: template-body
div text-gray-600dark:text-gray-400my-1ml-4py-1pl-2
span text-zinc-700dark:text-zinc-300font-medium
if
span text-gray-600dark:text-gray-400ml-2font-mono
@test
div template-blockml-4mt-1
apply*in mode template-body
matchxslt:for-each | xsl:for-eachmode: template-body
div inline-flexflex-wrapgap-3text-gray-600dark:text-gray-400my-1py-1shadow-lgleading-none
span text-slate-700dark:text-slate-300font-medium
for each
span text-gray-600dark:text-gray-400font-mono
@select
ifxslt:sort | xsl:sort
div flexgap-2
for eachxslt:sort | xsl:sort
span text-slate-600dark:text-slate-400
sorted by
span text-gray-600dark:text-gray-400
@select
if@order
span text-slate-600dark:text-slate-400
@order
div template-blockpl-2flexflex-wrapitems-centergap-x-2
apply*[not(self::xslt:sort or self::xsl:sort)]in mode template-body
matchxslt:attribute | xsl:attributemode: template-body
div text-gray-600ml-4inline-flexitems-centergap-1
span text-cyan-600dark:text-cyan-500font-medium
@name
when@select
span text-gray-400
←
span text-amber-600dark:text-amber-400font-mono
{
@select
}
when*
span text-gray-400
←
apply*in mode template-body
whentext()
span text-gray-400
←
span text-amber-600dark:text-slate-400font-mono
.
matchxslt:text | xsl:textmode: template-body
span inline-blocktext-gray-600dark:text-gray-300px-0.5font-monobg-gray-100dark:bg-gray-800px-2py-1
"
.
"
matchxslt:comment | xsl:commentmode: template-body
div text-gray-400ml-4italic
span text-gray-400
<!--
when@select
span text-gray-500ml-1
{
@select
}
when*
apply*in mode template-body
otherwise
span text-gray-500ml-1
.
span text-gray-400
-->
matchxslt:copy | xsl:copymode: template-body
div text-gray-600ml-4
span text-gray-600dark:text-gray-400
copy
if@select
span text-gray-600dark:text-gray-400ml-2font-mono
@select
if*
div template-blockml-4mt-1
apply*in mode template-body
matchxslt:copy-of | xsl:copy-ofmode: template-body
div text-gray-600ml-4
span text-gray-600dark:text-gray-400
copy of
span text-gray-600dark:text-gray-400ml-2font-mono
@select
matchhtml | head | meta | img | script | title | link | body | div | p | span | h1 | h2 | h3 | h4 | h5 | h6 | a | code | article | header | section | aside | nav | footer | main | ul | ol | li | dl | dt | dd | blockquote | pre | em | strong | small | mark | del | ins | sub | supmode: template-body
div html-elementflexflex-wrapgap-y-1items-centermy-1py-1relativepx-2border-l-4rounded-mdborder-gray-300dark:border-gray-600/70bg-whitedark:bg-blue-900/10shadow-sm
div html-tagflexgap-x-4items-start
span
class←
whenself::section | self::article | self::aside | self::nav | self::main | self::header | self::footer
whenself::h1 | self::h2 | self::h3 | self::h4 | self::h5 | self::h6
whenself::p | self::blockquote
whenself::ul | self::ol | self::li | self::dl | self::dt | self::dd
whenself::a
whenself::code | self::pre
whenself::em | self::strong | self::small | self::mark | self::del | self::ins | self::sub | self::sup
otherwise
local-name()
span flexflex-wrapgap-x-4gap-y-2
for each@*
" "
whenname() = 'class'
span html-class-listinline-flexflex-wrapgap-1align-baseline
callrender-class-list
withclasses.
whenname() = 'id'
span
span text-gray-400dark:text-gray-500
#
span text-cyan-600dark:text-cyan-400
.
otherwise
span inline-flexgap-2
span html-attr-nametext-cyan-600dark:text-cyan-400
name()
span html-attr-valuefont-monotext-green-700dark:text-green-300/80
.
if*|text()[normalize-space()]
div html-contentml-1
apply*|text()in mode template-body
templaterender-class-list
Splits a whitespace-separated class attribute into individual tokens recursively. XSLT 1.0 lacks tokenize(), so this named template walks the string, peeling off one class at a time and calling render-single-class.
Interface:
Input:
classes— The raw space-separated class attribute value.
processed(optional)— Accumulator (currently unused; reserved for future deduplication).
Output:
A sequence of colored token spans, one per class.
Algorithm:
  1. Normalize whitespace.
  2. If the remainder contains a space, split into first/rest, render first, recurse on rest.
  3. Otherwise render the final token and stop.
parameter$classes
parameter$processed=''
$normalized←normalize-space($classes)
whencontains($normalized, ' ')
$first←substring-before($normalized, ' ')
$rest←substring-after($normalized, ' ')
callrender-single-class
withclass$first
callrender-class-list
withclasses$rest
when$normalized != ''
callrender-single-class
withclass$normalized
templaterender-single-class
parameter$class
span html-class-tokeninline-block
class←
whenstarts-with($class, 'dark:')
whencontains($class, 'bg-blue') or contains($class, 'text-blue') or contains($class, 'border-blue')
whencontains($class, 'bg-red') or contains($class, 'text-red') or contains($class, 'border-red')
whencontains($class, 'bg-green') or contains($class, 'text-green') or contains($class, 'border-green')
whencontains($class, 'bg-yellow') or contains($class, 'text-yellow') or contains($class, 'border-yellow')
whencontains($class, 'bg-purple') or contains($class, 'text-purple') or contains($class, 'border-purple')
whencontains($class, 'bg-pink') or contains($class, 'text-pink') or contains($class, 'border-pink')
whencontains($class, 'bg-indigo') or contains($class, 'text-indigo') or contains($class, 'border-indigo')
whencontains($class, 'bg-gray') or contains($class, 'text-gray') or contains($class, 'border-gray')
whenstarts-with($class, 'flex') or starts-with($class, 'grid') or contains($class, 'block') or contains($class, 'inline')
whenstarts-with($class, 'p-') or starts-with($class, 'm-') or starts-with($class, 'space-') or starts-with($class, 'gap-')
whenstarts-with($class, 'text-') or starts-with($class, 'font-') or contains($class, 'uppercase') or contains($class, 'lowercase') or contains($class, 'capitalize')
whenstarts-with($class, 'w-') or starts-with($class, 'h-') or contains($class, 'full') or contains($class, 'screen')
whencontains($class, 'transition') or contains($class, 'duration') or contains($class, 'ease') or contains($class, 'animate')
whenstarts-with($class, 'sm:') or starts-with($class, 'md:') or starts-with($class, 'lg:') or starts-with($class, 'xl:')
otherwise
$class
matchtext()[normalize-space()]mode: template-body
ifnormalize-space() != ''
div template-text-contentpx-2inline-flexfont-monotext-gray-800dark:text-gray-200
span px-2borderborder-slate-400dark:border-slate-600rounded
normalize-space()
matchdoc:ref
code doc-reftext-purple-700dark:text-purple-400bg-purple-50dark:bg-purple-950/30px-1rounded
apply
matchdoc:string
code doc-stringtext-green-700dark:text-green-400
'
apply
'
matchdoc:code
code doc-codebg-gray-100dark:bg-gray-800px-2py-1text-smtext-gray-800dark:text-gray-200
apply
matchdoc:path
code doc-pathtext-blue-700dark:text-blue-400font-mono
apply
matchdoc:file
code doc-filetext-indigo-700dark:text-indigo-400font-mono
apply
matchdoc:attr
code doc-attrtext-orange-700dark:text-orange-400
@
apply
matchdoc:em
em font-semiboldtext-gray-900dark:text-gray-100
apply
matchdoc:term
apply
matchdoc:definition | doc:description | doc:content
apply
matchdoc:*mode: template-body
matchcomment()mode: template-body
div template-commentfont-serifdark:text-slate-300text-xlmt-4italicpx-2rounded
.