mirror of https://github.com/hashicorp/consul
39 lines
774 B
Markdown
39 lines
774 B
Markdown
---
|
|
class: css
|
|
---
|
|
# inline-code
|
|
|
|
All `p code` within `main` and any `ModalLayer`s default to use the following
|
|
inline code CSS component.
|
|
|
|
```hbs preview-template
|
|
<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 preview-template
|
|
<pre><code>{
|
|
"Code": true
|
|
}</code></pre>
|
|
```
|
|
|
|
```css
|
|
pre code {
|
|
@extend %block-code;
|
|
}
|
|
```
|