mermaid: avoid graph bombing on hugo --minify #656

This commit is contained in:
Sören Weber 2023-09-30 21:41:31 +02:00
parent bb77153860
commit 5342161fed
No known key found for this signature in database
GPG key ID: BEC6D55545451B6D
7 changed files with 43 additions and 43 deletions

View file

@ -19,8 +19,8 @@
{{- end }}
{{- end }}
{{- with $page }}
<div class="mermaid align-{{ $align }}{{ if $zoom }} zoom{{ end }}">
<pre class="mermaid align-{{ $align }}{{ if $zoom }} zoom{{ end }}">
{{- replaceRE "&#39;" "'" ( replaceRE "&#34;" "\"" ( $content | safeHTML ) ) -}}
</div>
</pre>
{{- .Store.Set "hasMermaid" true }}
{{- end }}

View file

@ -24,7 +24,7 @@ code.copy-to-clipboard-code {
border-end-end-radius: 2px;
border-inline-end-width: 1px;
}
pre {
pre:not(.mermaid) {
border: 1px solid rgba( 204, 204, 204, 1 );
}
#R-body #R-topbar{
@ -67,7 +67,7 @@ pre {
#R-body .anchor{
display: none;
}
#R-body pre,
#R-body pre:not(.mermaid),
#R-body code {
background-color: rgba( 255, 255, 255, 1 );
border-color: rgba( 221, 221, 221, 1 );

View file

@ -484,7 +484,7 @@
code,
kbd,
pre,
pre:not(.mermaid),
samp {
font-family: "Consolas", menlo, monospace; /* var(--CODE-font) */
}
@ -495,7 +495,7 @@
color: rgba( 94, 94, 94, 1 ); /* var(--CODE-INLINE-color) */
}
pre {
pre:not(.mermaid) {
background-color: rgba( 248, 248, 248, 1 ); /* var(--CODE-BLOCK-BG-color) */
border-color: rgba( 216, 216, 216, 1 ); /* var(--CODE-BLOCK-BORDER-color) */
color: rgba( 0, 0, 0, 1 ); /* var(--CODE-BLOCK-color) */
@ -540,15 +540,15 @@
}
div.highlight > div table + .copy-to-clipboard-button,
div.highlight pre + .copy-to-clipboard-button,
pre .copy-to-clipboard-button {
div.highlight pre:not(.mermaid) + .copy-to-clipboard-button,
pre:not(.mermaid) .copy-to-clipboard-button {
border-color: rgba( 216, 216, 216, 1 ); /* var(--CODE-BLOCK-BORDER-color) */
color: rgba( 72, 106, 201, 1 ); /* var(--MAIN-LINK-color) */
}
div.highlight > div table + .copy-to-clipboard-button:hover,
div.highlight pre + .copy-to-clipboard-button:hover,
pre .copy-to-clipboard-button:hover {
div.highlight pre:not(.mermaid) + .copy-to-clipboard-button:hover,
pre:not(.mermaid) .copy-to-clipboard-button:hover {
background-color: rgba( 72, 106, 201, 1 ); /* var(--MAIN-LINK-color) */
border-color: rgba( 72, 106, 201, 1 ); /* var(--MAIN-LINK-color) */
color: rgba( 248, 248, 248, 1 ); /* var(--CODE-BLOCK-BG-color) */

View file

@ -94,7 +94,7 @@ figure {
hr {
height: 0; }
pre {
pre:not(.mermaid) {
overflow: auto; }
button,
@ -193,7 +193,7 @@ cite {
cite:before {
content: "\2014 \0020"; }
pre {
pre:not(.mermaid) {
margin: 1.5rem 0;
padding: 0.938rem; }

View file

@ -606,19 +606,19 @@ p:empty {
#R-body table th > :nth-last-child(1 of :not(:empty)),
#R-body table th > :nth-last-child(1 of :not(:empty)) :nth-last-child(1 of :not(:empty)),
#R-body table th > div.highlight:last-child pre,
#R-body table th > div.highlight:last-child pre:not(.mermaid),
#R-body table td > :nth-last-child(1 of :not(:empty)),
#R-body table td > :nth-last-child(1 of :not(:empty)) :nth-last-child(1 of :not(:empty)),
#R-body table td > div:last-child pre,
#R-body table td > div:last-child pre:not(.mermaid),
#R-body div.box > .box-content > :nth-last-child(1 of :not(:empty)),
#R-body div.box > .box-content > :nth-last-child(1 of :not(:empty)) :nth-last-child(1 of :not(:empty)),
#R-body div.box > .box-content > div:last-child pre,
#R-body div.box > .box-content > div:last-child pre:not(.mermaid),
#R-body div.expand > .expand-content-text > :nth-last-child(1 of :not(:empty)),
#R-body div.expand > .expand-content-text > :nth-last-child(1 of :not(:empty)) :nth-last-child(1 of :not(:empty)),
#R-body div.expand > .expand-content-text > div:last-child pre,
#R-body div.expand > .expand-content-text > div:last-child pre:not(.mermaid),
#R-body div.tab-content > .tab-content-text > :nth-last-child(1 of :not(:empty)),
#R-body div.tab-content > .tab-content-text > :nth-last-child(1 of :not(:empty)) :nth-last-child(1 of :not(:empty)),
#R-body div.tab-content > .tab-content-text > div:last-child pre {
#R-body div.tab-content > .tab-content-text > div:last-child pre:not(.mermaid) {
margin-bottom: 0;
}
@ -675,7 +675,7 @@ div.attachments .box-content {
code,
kbd,
pre,
pre:not(.mermaid),
samp {
font-size: .934375rem;
vertical-align: baseline;
@ -703,7 +703,7 @@ code.copy-to-clipboard-code {
border-inline-end-width: 0;
}
pre {
pre:not(.mermaid) {
border-radius: 2px;
border-style: solid;
border-width: 1px;
@ -714,14 +714,14 @@ pre {
position: relative;
}
/* pre:has( code ), */
/* pre:not(.mermaid):has( code ), */
/* the :has() operator isn't available in FF yet, so we patch this by JS */
pre.pre-code {
pre:not(.mermaid).pre-code {
direction: ltr;
text-align: left;
}
pre code {
pre:not(.mermaid) code {
background-color: inherit;
border: 0;
color: inherit;
@ -768,33 +768,33 @@ div.highlight > div table{
display: block;
overflow: auto;
}
div.highlight:not(.wrap-code) pre{
div.highlight:not(.wrap-code) pre:not(.mermaid){
overflow: auto;
}
div.highlight:not(.wrap-code) pre code{
div.highlight:not(.wrap-code) pre:not(.mermaid) code{
white-space: pre;
}
div.highlight.wrap-code pre code{
div.highlight.wrap-code pre:not(.mermaid) code{
white-space: pre-wrap;
}
/* remove border from row cells if highlight shortcode was used in table lineno mode */
div.highlight > div td > pre {
div.highlight > div td > pre:not(.mermaid) {
border-radius: 0;
border-width: 0;
}
/* in case of table lineno mode we want to move each row closer together - besides the edges
this usually applies only to wrapfix tables but it doesn't hurt for non-wrapfix tables too */
div.highlight > div tr:not(:first-child) pre{
div.highlight > div tr:not(:first-child) pre:not(.mermaid){
padding-top: 0;
}
div.highlight > div tr:not(:last-child) pre{
div.highlight > div tr:not(:last-child) pre:not(.mermaid){
padding-bottom: 0;
}
/* in case of table lineno mode we want to move each columns closer together on the inside */
div.highlight > div td:first-child:not(:last-child) pre{
div.highlight > div td:first-child:not(:last-child) pre:not(.mermaid){
padding-right: 0;
}
div.highlight > div td:not(:first-child):last-child pre{
div.highlight > div td:not(:first-child):last-child pre:not(.mermaid){
padding-left: 0;
}
@ -802,7 +802,7 @@ hr {
border-bottom: 4px solid rgba( 134, 134, 134, .125 );
}
#R-body-inner pre {
#R-body-inner pre:not(.mermaid) {
white-space: pre-wrap;
}
@ -1188,15 +1188,15 @@ div.highlight:hover .copy-to-clipboard-button {
}
div.highlight > div table + .copy-to-clipboard-button > i,
div.highlight pre + .copy-to-clipboard-button > i,
div.highlight pre:not(.mermaid) + .copy-to-clipboard-button > i,
.copy-to-clipboard-code + .copy-to-clipboard-button > i {
padding-left: 5px;
padding-right: 5px;
}
div.highlight > div table + .copy-to-clipboard-button,
div.highlight pre + .copy-to-clipboard-button,
pre > .copy-to-clipboard-button {
div.highlight pre:not(.mermaid) + .copy-to-clipboard-button,
pre:not(.mermaid) > .copy-to-clipboard-button {
background-color: rgba( 160, 160, 160, .2 );
border-radius: 2px;
border-style: solid;
@ -2139,8 +2139,8 @@ html[dir="rtl"] #R-sidebar ul.collapsible-menu > li > label > i.fa-chevron-right
/* remove border from code block if single in tab */
#R-body .tab-content-text > div.highlight:only-child > div,
#R-body .tab-content-text > div.highlight:only-child pre,
#R-body .tab-content-text > pre.pre-code:only-child{
#R-body .tab-content-text > div.highlight:only-child pre:not(.mermaid),
#R-body .tab-content-text > pre:not(.mermaid).pre-code:only-child{
border-width: 0;
}

View file

@ -219,7 +219,7 @@ div.box > .box-content {
code,
kbd,
pre,
pre:not(.mermaid),
samp {
font-family: var(--INTERNAL-CODE-font);
}
@ -230,7 +230,7 @@ code {
color: var(--INTERNAL-CODE-INLINE-color);
}
pre {
pre:not(.mermaid) {
background-color: var(--INTERNAL-CODE-BLOCK-BG-color);
border-color: var(--INTERNAL-CODE-BLOCK-BORDER-color);
color: var(--INTERNAL-CODE-BLOCK-color);
@ -279,15 +279,15 @@ table {
}
div.highlight > div table + .copy-to-clipboard-button,
div.highlight pre + .copy-to-clipboard-button,
pre .copy-to-clipboard-button {
div.highlight pre:not(.mermaid) + .copy-to-clipboard-button,
pre:not(.mermaid) .copy-to-clipboard-button {
border-color: var(--INTERNAL-CODE-BLOCK-BORDER-color);
color: var(--INTERNAL-MAIN-LINK-color);
}
div.highlight > div table + .copy-to-clipboard-button:hover,
div.highlight pre + .copy-to-clipboard-button:hover,
pre .copy-to-clipboard-button:hover {
div.highlight pre:not(.mermaid) + .copy-to-clipboard-button:hover,
pre:not(.mermaid) .copy-to-clipboard-button:hover {
background-color: var(--INTERNAL-MAIN-LINK-color);
border-color: var(--INTERNAL-MAIN-LINK-color);
color: var(--INTERNAL-CODE-BLOCK-BG-color);

View file

@ -73,7 +73,7 @@ function adjustContentWidth(){
function fixCodeTabs(){
/* if only a single code block is contained in the tab and no style was selected, treat it like style=code */
var codeTabContents = Array.from( document.querySelectorAll( '.tab-content.tab-panel-style' ) ).filter( function( tabContent ){
return tabContent.querySelector( '*:scope > .tab-content-text > div.highlight:only-child, *:scope > .tab-content-text > pre.pre-code:only-child');
return tabContent.querySelector( '*:scope > .tab-content-text > div.highlight:only-child, *:scope > .tab-content-text > pre:not(.mermaid).pre-code:only-child');
});
codeTabContents.forEach( function( tabContent ){