Back to Consul

inline-code

ui/packages/consul-ui/app/components/inline-code/README.mdx

1.22.7720 B
Original Source

inline-code

All p code within main and any ModalLayers default to use the following inline code CSS component.

hbs
<p>
  This is so we can highlight code <code>inline</code> in paragraphs and such-like.
</p>

It can also be added to any additional elements using the following placeholder.

css
p code {
  @extend %inline-code;
}

We also have a %block-code that is currently contained in the same CSS files here as it shares so much of this (this should potentially be thought about and reorganized at some stage)

At the time of writing we only use this in the docs for all <pre><code>s.

hbs
<pre><code>{
  "Code": true
}</code></pre>
css
pre code {
  @extend %block-code;
}