nishiki/hugo-theme-relearn
1
0
Fork 0
mirror of https://github.com/McShelby/hugo-theme-relearn.git synced 2024-11-23 07:47:54 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 2

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

Browse source
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
Show stats Download patch file Download diff file Expand all files Collapse all files

4
layouts/partials/shortcodes/mermaid.html
View file

@ -19,8 +19,8 @@
{{- end }} {{- end }}
{{- end }} {{- end }}
{{- with $page }} {{- 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 ) ) -}} {{- replaceRE "&#39;" "'" ( replaceRE "&#34;" "\"" ( $content | safeHTML ) ) -}}
</div> </pre>
{{- .Store.Set "hasMermaid" true }} {{- .Store.Set "hasMermaid" true }}
{{- end }} {{- end }}

4
static/css/format-print.css
View file

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

12
static/css/ie.css
View file

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

4
static/css/nucleus.css
View file

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

48
static/css/theme.css
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)),
#R-body table th > :nth-last-child(1 of :not(:empty)) :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)),
#R-body table td > :nth-last-child(1 of :not(:empty)) :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)),
#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 > :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)),
#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 > :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)),
#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 > :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; margin-bottom: 0;
} }
@ -675,7 +675,7 @@ div.attachments .box-content {
code, code,
kbd, kbd,
pre, pre:not(.mermaid),
samp { samp {
font-size: .934375rem; font-size: .934375rem;
vertical-align: baseline; vertical-align: baseline;
@ -703,7 +703,7 @@ code.copy-to-clipboard-code {
border-inline-end-width: 0; border-inline-end-width: 0;
} }
pre { pre:not(.mermaid) {
border-radius: 2px; border-radius: 2px;
border-style: solid; border-style: solid;
border-width: 1px; border-width: 1px;
@ -714,14 +714,14 @@ pre {
position: relative; 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 */ /* 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; direction: ltr;
text-align: left; text-align: left;
} }
pre code { pre:not(.mermaid) code {
background-color: inherit; background-color: inherit;
border: 0; border: 0;
color: inherit; color: inherit;
@ -768,33 +768,33 @@ div.highlight > div table{
display: block; display: block;
overflow: auto; overflow: auto;
} }
div.highlight:not(.wrap-code) pre{ div.highlight:not(.wrap-code) pre:not(.mermaid){
overflow: auto; overflow: auto;
} }
div.highlight:not(.wrap-code) pre code{ div.highlight:not(.wrap-code) pre:not(.mermaid) code{
white-space: pre; white-space: pre;
} }
div.highlight.wrap-code pre code{ div.highlight.wrap-code pre:not(.mermaid) code{
white-space: pre-wrap; white-space: pre-wrap;
} }
/* remove border from row cells if highlight shortcode was used in table lineno mode */ /* 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-radius: 0;
border-width: 0; border-width: 0;
} }
/* in case of table lineno mode we want to move each row closer together - besides the edges /* 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 */ 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; padding-top: 0;
} }
div.highlight > div tr:not(:last-child) pre{ div.highlight > div tr:not(:last-child) pre:not(.mermaid){
padding-bottom: 0; padding-bottom: 0;
} }
/* in case of table lineno mode we want to move each columns closer together on the inside */ /* 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; 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; padding-left: 0;
} }
@ -802,7 +802,7 @@ hr {
border-bottom: 4px solid rgba( 134, 134, 134, .125 ); border-bottom: 4px solid rgba( 134, 134, 134, .125 );
} }
#R-body-inner pre { #R-body-inner pre:not(.mermaid) {
white-space: pre-wrap; 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 > 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 { .copy-to-clipboard-code + .copy-to-clipboard-button > i {
padding-left: 5px; padding-left: 5px;
padding-right: 5px; padding-right: 5px;
} }
div.highlight > div table + .copy-to-clipboard-button, div.highlight > div table + .copy-to-clipboard-button,
div.highlight pre + .copy-to-clipboard-button, div.highlight pre:not(.mermaid) + .copy-to-clipboard-button,
pre > .copy-to-clipboard-button { pre:not(.mermaid) > .copy-to-clipboard-button {
background-color: rgba( 160, 160, 160, .2 ); background-color: rgba( 160, 160, 160, .2 );
border-radius: 2px; border-radius: 2px;
border-style: solid; 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 */ /* 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 > div,
#R-body .tab-content-text > div.highlight:only-child pre, #R-body .tab-content-text > div.highlight:only-child pre:not(.mermaid),
#R-body .tab-content-text > pre.pre-code:only-child{ #R-body .tab-content-text > pre:not(.mermaid).pre-code:only-child{
border-width: 0; border-width: 0;
} }

12
static/css/variant.css
View file

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

2
static/js/theme.js
View file

@ -73,7 +73,7 @@ function adjustContentWidth(){
function fixCodeTabs(){ function fixCodeTabs(){
/* if only a single code block is contained in the tab and no style was selected, treat it like style=code */ /* 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 ){ 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 ){ codeTabContents.forEach( function( tabContent ){