Replaced by {{ params.replacedBy }}
Replaced by {{ ruleList({ rules: params.replacedBy }) }}
{%- else -%}{{ params.description }}
{%- endif -%} {%- elseif params.removed == true -%} @@ -16,7 +18,7 @@ removed {%- if params.replacedBy -%} -Replaced by {{ params.replacedBy }}
Replaced by {{ ruleList({ rules: params.replacedBy }) }}
{%- else -%}{{ params.description }}
{%- endif -%} {%- else -%} diff --git a/docs/src/assets/scss/components/rules.scss b/docs/src/assets/scss/components/rules.scss index 27b1e492ad3..82ec099af10 100644 --- a/docs/src/assets/scss/components/rules.scss +++ b/docs/src/assets/scss/components/rules.scss @@ -67,6 +67,14 @@ font-size: .875rem; margin-bottom: .25rem; margin-block-end: .25rem; +} + +a.rule__name { + text-decoration: none; + + &:hover { + text-decoration: underline; + } &::after { position: absolute; @@ -80,14 +88,6 @@ } } -a.rule__name { - text-decoration: none; - - &:hover { - text-decoration: underline; - } -} - .rule__description { font-size: var(--step--1); } @@ -166,3 +166,10 @@ a.rule__name { } } } + +a.rule-list-item+a.rule-list-item::before { + content: ","; + display: inline-block; + margin-left: 5px; + margin-right: 5px; +} diff --git a/docs/src/library/rule-list.md b/docs/src/library/rule-list.md new file mode 100644 index 00000000000..635e6b40023 --- /dev/null +++ b/docs/src/library/rule-list.md @@ -0,0 +1,25 @@ +--- +title: Rule list +--- + +The rule list is a macro defined in `components/rule-list.macro.html`. The macro accepts a list of rule names and renders comma-separated links. + +## Usage + +{% raw %} + +```html + +{% from 'components/rule-list.macro.html' import ruleList %} + + +{{ ruleList({ rules: ['accessor-pairs', 'no-undef'] }) }} +``` + +{% endraw %} + +## Examples + +{% from 'components/rule-list.macro.html' import ruleList %} + +{{ ruleList({ rules: ['accessor-pairs', 'no-undef'] }) }}