Reference findings format

[achillemi]

Hi! In the docs it is mentioned how to reference a finding. Is it possible to somehow customize the style of the rendered reference? For example, instead of:

See [](#00000000-0000-0000-0000-000000000000)... (e.g. rendered as "1.3 SQL injection")

I would like to have something like:

See [](#00000000-0000-0000-0000-000000000000)... (e.g. rendered as "[1.3])

Is that possible?

[MWedl]

Hi, yes it is possible to customize the styling of references via CSS. Add following CSS rules to your design to render references in the format "See [1.3] ...".

.ref-heading > .ref-title { 
    display: none;
}
.ref-heading-level1::before {
  content: "[" target-counter(attr(href), h1-counter) "]";
}
.ref-heading-level2::before {
  content: "[" target-counter(attr(href), h1-counter) "." target-counter(attr(href), h2-counter) "]";
}
.ref-heading-level3::before {
  content: "[" target-counter(attr(href), h1-counter) "." target-counter(attr(href), h2-counter) "." target-counter(attr(href), h3-counter) "]";
}
.ref-heading-level4::before {
  content: "[" target-counter(attr(href), h1-counter) "." target-counter(attr(href), h2-counter) "." target-counter(attr(href), h3-counter) "." target-counter(attr(href), h4-counter) "]";
}
.ref-heading-level5::before {
  content: "[" target-counter(attr(href), h1-counter) "." target-counter(attr(href), h2-counter) "." target-counter(attr(href), h3-counter) "." target-counter(attr(href), h4-counter) "." target-counter(attr(href), h5-counter) "]";
}
.ref-heading-level6::before {
  content: "[" target-counter(attr(href), h1-counter) "." target-counter(attr(href), h2-counter) "." target-counter(attr(href), h3-counter) "." target-counter(attr(href), h4-counter) "." target-counter(attr(href), h5-counter) "." target-counter(attr(href), h6-counter) "]";
}

These are modified rules based on the default reference stylings defined in https://github.com/Syslifters/sysreptor/blob/main/api/src/reportcreator_api/tasks/rendering/global_assets/base-ref.css

[achillemi]

Thanks for the reply! Unfortunately that messes up the ToC too:

I would like to specifically modify the way findings are referenced, leaving all the othere references as they are.

[MWedl]

You can use CSS selectors apply the modified reference stylings only to parts of the document. For example, if you reference findings only via markdown links, you can prepend a .markdown selector to the CSS rules. Then the ToC is not affected. It is also possible to define your own selector classes.

.markdown .ref-heading > .ref-title { ...}
.markdown .ref-heading-level1::before { ... }

[achillemi]

Thanks! That seems to work!