fleet/website/assets/styles/pages/docs/code-blocks.less
Eric ad7c1909a5
Website: Add max height to mermaid diagrams (#12374)
Closes: #12362
Changes:
- Added a max-height (~`800px`~ `600px`) for rendered mermaid diagrams
on fleetdm.com. (Edited by Mike T)

---------

Co-authored-by: Mike Thomas <mthomas@fleetdm.com>
Co-authored-by: Mike Thomas <78363703+mike-j-thomas@users.noreply.github.com>
2023-06-16 13:28:34 -05:00

136 lines
2.2 KiB
Text
Vendored

// lesshint-disable spaceAroundComma, trailingWhitespace
a > code:not(.hljs):not(.nohighlight):not(.mermaid) {
color: inherit;
text-decoration: inherit;
}
code:not(.hljs):not(.nohighlight):not(.mermaid) {
background-color: @ui-off-white;
border: 1px solid @border-lt-gray;
color: @core-fleet-black-75;
font-size: 13px;
padding: 4px 8px;
line-height: 16px;
}
code {
font-family: @code-font;
display: inline-block;
border-radius: 6px;
}
code.mermaid:not([data-processed='true']) {
opacity: 0;
}
code.mermaid[data-processed='true'] {
svg {
max-height: 600px;
}
}
pre:not(.algolia-autocomplete):not(.ds-dropdown-menu):not(.json) {
padding: 24px;
border: 1px solid @border-lt-gray;
border-radius: 6px;
margin: 8px 0px 40px;
font-family: @code-font;
background: #282C40;
&.muted {
color: @core-fleet-black-75;
background: @ui-off-white;
}
}
li {
pre:not(.algolia-autocomplete):not(.ds-dropdown-menu):not(.json) {
margin: 12px 0px 16px;
}
}
.hljs {
background: #282C40;
}
/*
Monokai Sublime style. Derived from Monokai by noformnocontent http://nn.mit-license.org/
*/
.hljs,
.hljs-tag,
.hljs-built_in,
.hljs-subst {
color: #f8f8f2;
}
.hljs-strong,
.hljs-emphasis {
color: #a8a8a2;
}
.hljs-bullet,
.hljs-quote,
.hljs-number,
.hljs-regexp,
.hljs-literal,
.hljs-link {
color: #ae81ff;
}
.hljs-code,
.hljs-title,
.hljs-section,
.hljs-selector-class {
color: #a6e22e;
}
.hljs-strong {
font-weight: bold;
}
.hljs-emphasis {
font-style: italic;
}
.hljs-keyword,
.hljs-selector-tag,
.hljs-name {
color: #f92672;
}
.hljs-symbol,
.hljs-attribute,
.hljs-function-keyword {
color: #66d9ef;
}
.hljs-attr,
.hljs-class .hljs-title {
color: #f8f8f2;
}
.hljs-params {
color: #fd9720;
}
.hljs-string,
.hljs-type,
.hljs-builtin-name,
.hljs-selector-id,
.hljs-selector-attr,
.hljs-selector-pseudo,
.hljs-addition,
.hljs-variable,
.hljs-template-variable {
color: #e6db74;
}
.hljs-comment,
.hljs-deletion,
.hljs-meta {
color: #75715e;
}