saul365/LoveIt
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

chore(lib): update mermaid 8.5.1 -> 9.0.1

Browse Source
This commit is contained in:
Dillon
2022-05-07 15:36:44 +08:00
parent 7f5bcda006
commit 857047a7a1
24 changed files with 80 additions and 1074 deletions
Download Patch File Download Diff File Expand all files Collapse all files
assets/data/cdn/jsdelivr.yml
+2 -2
View File
@@ -44,8 +44,8 @@ libFiles:
katexCopyTexCSS: katex@0.15.3/dist/contrib/copy-tex.min.css katexCopyTexCSS: katex@0.15.3/dist/contrib/copy-tex.min.css
katexCopyTexJS: katex@0.15.3/dist/contrib/copy-tex.min.js katexCopyTexJS: katex@0.15.3/dist/contrib/copy-tex.min.js
katexMhchemJS: katex@0.15.3/dist/contrib/mhchem.min.js katexMhchemJS: katex@0.15.3/dist/contrib/mhchem.min.js
# mermaid@8.5.1 https://github.com/knsv/mermaid # mermaid@9.0.1 https://github.com/knsv/mermaid
mermaidJS: mermaid@8.5.1/dist/mermaid.min.js mermaidJS: mermaid@9.0.1/dist/mermaid.min.js
# echarts@4.8.0 https://echarts.apache.org/ # echarts@4.8.0 https://echarts.apache.org/
echartsJS: echarts@4.8.0/dist/echarts.min.js echartsJS: echarts@4.8.0/dist/echarts.min.js
echartsMacaronsJS: echarts@4.8.0/theme/macarons.min.js echartsMacaronsJS: echarts@4.8.0/theme/macarons.min.js
assets/js/theme.js
+29 -14
View File
@@ -639,19 +639,27 @@ var Theme = /*#__PURE__*/function () {
value: function initMermaid() { value: function initMermaid() {
var _this7 = this; var _this7 = this;
var $mermaidElements = document.getElementsByClassName('mermaid'); this._mermaidOnSwitchTheme = this._mermaidOnSwitchTheme || function () {
var $mermaidElements = document.getElementsByClassName('mermaid');
if ($mermaidElements.length) { if ($mermaidElements.length) {
mermaid.initialize({ mermaid.initialize({
startOnLoad: false, startOnLoad: false,
theme: 'null' theme: _this7.isDark ? 'dark' : 'neutral',
}); securityLevel: 'loose'
this.util.forEach($mermaidElements, function ($mermaid) { });
mermaid.mermaidAPI.render('svg-' + $mermaid.id, _this7.data[$mermaid.id], function (svgCode) {
$mermaid.insertAdjacentHTML('afterbegin', svgCode); _this7.util.forEach($mermaidElements, function ($mermaid) {
}, $mermaid); mermaid.render('svg-' + $mermaid.id, _this7.data[$mermaid.id], function (svgCode) {
}); $mermaid.innerHTML = svgCode;
} }, $mermaid);
});
}
};
this.switchThemeEventSet.add(this._mermaidOnSwitchTheme);
this._mermaidOnSwitchTheme();
} }
}, { }, {
key: "initEcharts", key: "initEcharts",
@@ -918,9 +926,15 @@ var Theme = /*#__PURE__*/function () {
_step2; _step2;
try { try {
for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) { var _loop = function _loop() {
var event = _step2.value; var event = _step2.value;
event(); window.setTimeout(function () {
event();
}, 100);
};
for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
_loop();
} }
} catch (err) { } catch (err) {
_iterator2.e(err); _iterator2.e(err);
@@ -928,6 +942,7 @@ var Theme = /*#__PURE__*/function () {
_iterator2.f(); _iterator2.f();
} }
;
_this12.oldScrollTop = _this12.newScrollTop; _this12.oldScrollTop = _this12.newScrollTop;
}, false); }, false);
} }
assets/lib/VERSION
+1 -1
View File
@@ -17,7 +17,7 @@ clipboard.js@2.0.6 https://github.com/zenorocha/clipboard.js
sharer.js@0.4.0 https://github.com/ellisonleao/sharer.js sharer.js@0.4.0 https://github.com/ellisonleao/sharer.js
typeit@7.0.4 https://github.com/alexmacarthur/typeit typeit@7.0.4 https://github.com/alexmacarthur/typeit
katex@0.15.3 https://katex.org/ katex@0.15.3 https://katex.org/
mermaid@8.5.1 https://github.com/knsv/mermaid mermaid@9.0.1 https://github.com/knsv/mermaid
echarts@4.8.0 https://echarts.apache.org/ echarts@4.8.0 https://echarts.apache.org/
mapbox-gl@1.10.1 https://github.com/mapbox/mapbox-gl-js mapbox-gl@1.10.1 https://github.com/mapbox/mapbox-gl-js
aplayer@1.10.1 https://github.com/MoePlayer/APlayer aplayer@1.10.1 https://github.com/MoePlayer/APlayer
assets/lib/mermaid/mermaid.min.js
Vendored
+2 -41
View File
File diff suppressed because one or more lines are too long
assets/lib/mermaid/mermaid.min.js.map
+1
View File
File diff suppressed because one or more lines are too long
assets/lib/mermaid/mermaid.scss
-19
View File
@@ -1,19 +0,0 @@
.page .mermaid {
width: 100%;
margin: 3% auto;
text-align: center;
& > svg {
max-width: 100%;
}
@import "themes/neutral/index";
[theme=dark] & {
@import "themes/dark/index";
}
div.mermaidTooltip {
z-index: 50;
}
}
assets/lib/mermaid/themes/class.scss
-91
View File
@@ -1,91 +0,0 @@
g.classGroup text {
fill: $nodeBorder;
stroke: none;
font-family: 'trebuchet ms', verdana, arial;
font-family: var(--mermaid-font-family);
font-size: 10px;
.title {
font-weight: bolder;
}
}
g.clickable {
cursor: pointer;
}
g.classGroup rect {
fill: $nodeBkg;
stroke: $nodeBorder;
}
g.classGroup line {
stroke: $nodeBorder;
stroke-width: 1;
}
.classLabel .box {
stroke: none;
stroke-width: 0;
fill: $nodeBkg;
opacity: 0.5;
}
.classLabel .label {
fill: $nodeBorder;
font-size: 10px;
}
.relation {
stroke: $nodeBorder;
stroke-width: 1;
fill: none;
}
.dashed-line{
stroke-dasharray: 3;
}
@mixin composition {
fill: $nodeBorder;
stroke: $nodeBorder;
stroke-width: 1;
}
#compositionStart {
@include composition;
}
#compositionEnd {
@include composition;
}
@mixin aggregation {
fill: $nodeBkg;
stroke: $nodeBorder;
stroke-width: 1;
}
#aggregationStart {
@include aggregation;
}
#aggregationEnd {
@include aggregation;
}
#dependencyStart {
@include composition;
}
#dependencyEnd {
@include composition;
}
#extensionStart {
@include composition;
}
#extensionEnd {
@include composition;
}
assets/lib/mermaid/themes/dark/index.scss
-62
View File
@@ -1,62 +0,0 @@
$mainBkg: #BDD5EA;
$secondBkg: #6D6D65;
$mainContrastColor: lightgrey;
$darkTextColor: #323D47;
$lineColor: $mainContrastColor;
$border1: #81B1DB;
$border2: rgba(255, 255, 255, 0.25);
$arrowheadColor: $mainContrastColor;
/* Flowchart variables */
$nodeBkg: $mainBkg;
$nodeBorder: purple;
$clusterBkg: $secondBkg;
$clusterBorder: $border2;
$defaultLinkColor: $lineColor;
$titleColor: #F9FFFE;
$edgeLabelBackground: #e8e8e8;
/* Sequence Diagram variables */
$actorBorder: $border1;
$actorBkg: $mainBkg;
$actorTextColor: black;
$actorLineColor: $mainContrastColor;
$signalColor: $mainContrastColor;
$signalTextColor: $mainContrastColor;
$labelBoxBkgColor: $actorBkg;
$labelBoxBorderColor: $actorBorder;
$labelTextColor: $darkTextColor;
$loopTextColor: $mainContrastColor;
$noteBorderColor: $border2;
$noteBkgColor: #fff5ad;
$activationBorderColor: #666;
$activationBkgColor: #f4f4f4;
$sequenceNumberColor: white;
/* Gantt chart variables */
$sectionBkgColor: rgba(255, 255, 255, 0.3);
$altSectionBkgColor: white;
$sectionBkgColor2: #EAE8B9;
$taskBorderColor: rgba(255, 255, 255, 0.5);
$taskBkgColor: $mainBkg;
$taskTextColor: $darkTextColor;
$taskTextLightColor: $mainContrastColor;
$taskTextOutsideColor: $taskTextLightColor;
$taskTextClickableColor: #003163;
$activeTaskBorderColor: rgba(255, 255, 255, 0.5);
$activeTaskBkgColor: #81B1DB;
$gridColor: $mainContrastColor;
$doneTaskBkgColor: $mainContrastColor;
$doneTaskBorderColor: grey;
$critBorderColor: #E83737;
$critBkgColor: #E83737;
$taskTextDarkColor: $darkTextColor;
$todayLineColor: #DB5757;
/* state colors */
$labelColor: black;
@import '../mermaid';
assets/lib/mermaid/themes/default/index.scss
-60
View File
@@ -1,60 +0,0 @@
$mainBkg: #ECECFF;
$secondBkg: #ffffde;
$lineColor: #333333;
$border1: #CCCCFF;
$border2: #aaaa33;
$arrowheadColor: #333333;
/* Flowchart variables */
$nodeBkg: $mainBkg;
$nodeBorder: #9370DB;
$clusterBkg: $secondBkg;
$clusterBorder: $border2;
$defaultLinkColor: $lineColor;
$titleColor: #333;
$edgeLabelBackground: #e8e8e8;
/* Sequence Diagram variables */
$actorBorder: $border1;
$actorBkg: $mainBkg;
$actorTextColor: black;
$actorLineColor: grey;
$signalColor: #333;
$signalTextColor: #333;
$labelBoxBkgColor: $actorBkg;
$labelBoxBorderColor: $actorBorder;
$labelTextColor: $actorTextColor;
$loopTextColor: $actorTextColor;
$noteBorderColor: $border2;
$noteBkgColor: #fff5ad;
$activationBorderColor: #666;
$activationBkgColor: #f4f4f4;
$sequenceNumberColor: white;
/* Gantt chart variables */
$sectionBkgColor: rgba(102, 102, 255, 0.49);
$altSectionBkgColor: white;
$sectionBkgColor2: #fff400;
$taskBorderColor: #534fbc;
$taskBkgColor: #8a90dd;
$taskTextLightColor: white;
$taskTextColor: $taskTextLightColor;
$taskTextDarkColor: black;
$taskTextOutsideColor: $taskTextDarkColor;
$taskTextClickableColor: #003163;
$activeTaskBorderColor: #534fbc;
$activeTaskBkgColor: #bfc7ff;
$gridColor: lightgrey;
$doneTaskBkgColor: lightgrey;
$doneTaskBorderColor: grey;
$critBorderColor: #ff8888;
$critBkgColor: red;
$todayLineColor: red;
/* state colors */
$labelColor: black;
@import '../mermaid';
assets/lib/mermaid/themes/flowchart.scss
-68
View File
@@ -1,68 +0,0 @@
.label {
font-family: 'trebuchet ms', verdana, arial;
font-family: var(--mermaid-font-family);
color: #333;
}
.label text {
fill: #333;
}
.node rect,
.node circle,
.node ellipse,
.node polygon,
.node path {
fill: $mainBkg;
stroke: $nodeBorder;
stroke-width: 1px;
}
.node .label {
text-align: center;
}
.node.clickable {
cursor: pointer;
}
.arrowheadPath {
fill: $arrowheadColor;
}
.edgePath .path {
stroke: $lineColor;
stroke-width: 1.5px;
}
.edgeLabel {
background-color: $edgeLabelBackground;
rect {
opacity: 0.5;
}
text-align: center;
}
.cluster rect {
fill: $secondBkg;
stroke: $clusterBorder;
stroke-width: 1px;
}
.cluster text {
fill: $titleColor;
}
div.mermaidTooltip {
position: absolute;
text-align: center;
max-width: 200px;
padding: 2px;
font-family: 'trebuchet ms', verdana, arial;
font-family: var(--mermaid-font-family);
font-size: 12px;
background: $secondBkg;
border: 1px solid $border2;
border-radius: 2px;
pointer-events: none;
z-index: 100;
}
assets/lib/mermaid/themes/forest/index.scss
-61
View File
@@ -1,61 +0,0 @@
$mainBkg: #cde498;
$secondBkg: #cdffb2;
$lineColor: #1a3318;
$lineColor: green;
$border1: #13540c;
$border2: #6eaa49;
$arrowheadColor: green;
/* Flowchart variables */
$nodeBkg: $mainBkg;
$nodeBorder: $border1;
$clusterBkg: $secondBkg;
$clusterBorder: $border2;
$defaultLinkColor: $lineColor;
$titleColor: #333;
$edgeLabelBackground: #e8e8e8;
/* Sequence Diagram variables */
$actorBorder: $border1;
$actorBkg: $mainBkg;
$actorTextColor: black;
$actorLineColor: grey;
$signalColor: #333;
$signalTextColor: #333;
$labelBoxBkgColor: $actorBkg;
$labelBoxBorderColor: #326932;
$labelTextColor: $actorTextColor;
$loopTextColor: $actorTextColor;
$noteBorderColor: $border2;
$noteBkgColor: #fff5ad;
$activationBorderColor: #666;
$activationBkgColor: #f4f4f4;
$sequenceNumberColor: white;
/* Gantt chart variables */
$sectionBkgColor: #6eaa49;
$altSectionBkgColor: white;
$sectionBkgColor2: #6eaa49;
$taskBorderColor: $border1;
$taskBkgColor: #487e3a;
$taskTextLightColor: white;
$taskTextColor: $taskTextLightColor;
$taskTextDarkColor: black;
$taskTextOutsideColor: $taskTextDarkColor;
$taskTextClickableColor: #003163;
$activeTaskBorderColor: $taskBorderColor;
$activeTaskBkgColor: $mainBkg;
$gridColor: lightgrey;
$doneTaskBkgColor: lightgrey;
$doneTaskBorderColor: grey;
$critBorderColor: #ff8888;
$critBkgColor: red;
$todayLineColor: red;
/* state colors */
$labelColor: black;
@import '../mermaid';
assets/lib/mermaid/themes/gantt.scss
-259
View File
@@ -1,259 +0,0 @@
/** Section styling */
.mermaid-main-font {
font-family: "trebuchet ms", verdana, arial;
font-family: var(--mermaid-font-family);
}
.section {
stroke: none;
opacity: 0.2;
}
.section0 {
fill: $sectionBkgColor;
}
.section2 {
fill: $sectionBkgColor2;
}
.section1,
.section3 {
fill: $altSectionBkgColor;
opacity: 0.2;
}
.sectionTitle0 {
fill: $titleColor;
}
.sectionTitle1 {
fill: $titleColor;
}
.sectionTitle2 {
fill: $titleColor;
}
.sectionTitle3 {
fill: $titleColor;
}
.sectionTitle {
text-anchor: start;
font-size: 11px;
text-height: 14px;
font-family: 'trebuchet ms', verdana, arial;
font-family: var(--mermaid-font-family);
}
/* Grid and axis */
.grid .tick {
stroke: $gridColor;
opacity: 0.8;
shape-rendering: crispEdges;
text {
font-family: 'trebuchet ms', verdana, arial;
font-family: var(--mermaid-font-family);
fill: $taskTextOutsideColor;
}
}
.grid path {
stroke-width: 0;
}
/* Today line */
.today {
fill: none;
stroke: $todayLineColor;
stroke-width: 2px;
}
/* Task styling */
/* Default task */
.task {
stroke-width: 2;
}
.taskText {
text-anchor: middle;
font-family: 'trebuchet ms', verdana, arial;
font-family: var(--mermaid-font-family);
}
.taskText:not([font-size]) {
font-size: 11px;
}
.taskTextOutsideRight {
fill: $taskTextDarkColor;
text-anchor: start;
font-size: 11px;
font-family: 'trebuchet ms', verdana, arial;
font-family: var(--mermaid-font-family);
}
.taskTextOutsideLeft {
fill: $taskTextDarkColor;
text-anchor: end;
font-size: 11px;
}
/* Special case clickable */
.task.clickable {
cursor: pointer;
}
.taskText.clickable {
cursor: pointer;
fill: $taskTextClickableColor !important;
font-weight: bold;
}
.taskTextOutsideLeft.clickable {
cursor: pointer;
fill: $taskTextClickableColor !important;
font-weight: bold;
}
.taskTextOutsideRight.clickable {
cursor: pointer;
fill: $taskTextClickableColor !important;
font-weight: bold;
}
/* Specific task settings for the sections*/
.taskText0,
.taskText1,
.taskText2,
.taskText3 {
fill: $taskTextColor;
}
.task0,
.task1,
.task2,
.task3 {
fill: $taskBkgColor;
stroke: $taskBorderColor;
}
.taskTextOutside0,
.taskTextOutside2
{
fill: $taskTextOutsideColor !important;
}
.taskTextOutside1,
.taskTextOutside3 {
fill: $taskTextOutsideColor !important;
}
/* Active task */
.active0,
.active1,
.active2,
.active3 {
fill: $activeTaskBkgColor;
stroke: $activeTaskBorderColor;
}
.activeText0,
.activeText1,
.activeText2,
.activeText3 {
fill: $taskTextDarkColor;
}
/* Completed task */
.done0,
.done1,
.done2,
.done3 {
stroke: $doneTaskBorderColor;
fill: $doneTaskBkgColor;
stroke-width: 2;
}
.doneText0,
.doneText1,
.doneText2,
.doneText3 {
fill: $taskTextDarkColor;
}
/* Tasks on the critical line */
.crit0,
.crit1,
.crit2,
.crit3 {
stroke: $critBorderColor;
fill: $critBkgColor;
stroke-width: 2;
}
.activeCrit0,
.activeCrit1,
.activeCrit2,
.activeCrit3 {
stroke: $critBorderColor;
fill: $activeTaskBkgColor;
stroke-width: 2;
}
.doneCrit0,
.doneCrit1,
.doneCrit2,
.doneCrit3 {
stroke: $critBorderColor;
fill: $doneTaskBkgColor;
stroke-width: 2;
cursor: pointer;
shape-rendering: crispEdges;
}
.milestone {
transform: rotate(45deg) scale(0.8,0.8);
}
.milestoneText {
font-style: italic;
}
.doneCritText0,
.doneCritText1,
.doneCritText2,
.doneCritText3 {
fill: $taskTextDarkColor;
}
.activeCritText0,
.activeCritText1,
.activeCritText2,
.activeCritText3 {
fill: $taskTextDarkColor;
}
.titleText {
text-anchor: middle;
font-size: 18px;
fill: $taskTextOutsideColor;
font-family: 'trebuchet ms', verdana, arial;
font-family: var(--mermaid-font-family);
}
assets/lib/mermaid/themes/git.scss
-8
View File
@@ -1,8 +0,0 @@
.commit-id,
.commit-msg,
.branch-label {
fill: lightgrey;
color: lightgrey;
font-family: 'trebuchet ms', verdana, arial;
font-family: var(--mermaid-font-family);
}
assets/lib/mermaid/themes/mermaid.scss
-19
View File
@@ -1,19 +0,0 @@
@import 'flowchart';
@import 'sequence';
@import 'gantt';
@import 'class';
@import 'git';
@import 'pie';
@import 'state';
// .composit {
// fill: white;
// border-bottom: 1px
// }
:root {
--mermaid-font-family: '"trebuchet ms", verdana, arial';
--mermaid-font-family: "Comic Sans MS", "Comic Sans", cursive;
// --mermaid-alt-font-family: '"Lucida Console", Monaco, monospace';
}
assets/lib/mermaid/themes/neutral/index.scss
-65
View File
@@ -1,65 +0,0 @@
$mainBkg: #eee;
$contrast: #26a;
$secondBkg: lighten($contrast, 55%);
$lineColor: #666;
$border1: #999;
$border2: $contrast;
$note: #ffa;
$text: #333;
$critical: #d42;
$done: #bbb;
$arrowheadColor: #333333;
/* Flowchart variables */
$nodeBkg: $mainBkg;
$nodeBorder: $border1;
$clusterBkg: $secondBkg;
$clusterBorder: $border2;
$defaultLinkColor: $lineColor;
$titleColor: $text;
$edgeLabelBackground: white;
/* Sequence Diagram variables */
$actorBorder: $border1;
$actorBkg: $mainBkg;
$actorTextColor: $text;
$actorLineColor: $lineColor;
$signalColor: $text;
$signalTextColor: $text;
$labelBoxBkgColor: $actorBkg;
$labelBoxBorderColor: $actorBorder;
$labelTextColor: $text;
$loopTextColor: $text;
$noteBorderColor: darken($note, 60%);
$noteBkgColor: $note;
$activationBorderColor: #666;
$activationBkgColor: #f4f4f4;
$sequenceNumberColor: white;
/* Gantt chart variables */
$sectionBkgColor: lighten($contrast, 30%);
$altSectionBkgColor: white;
$sectionBkgColor2: lighten($contrast, 30%);
$taskBorderColor: darken($contrast, 10%);
$taskBkgColor: $contrast;
$taskTextLightColor: white;
$taskTextColor: $taskTextLightColor;
$taskTextDarkColor: $text;
$taskTextOutsideColor: $taskTextDarkColor;
$taskTextClickableColor: #003163;
$activeTaskBorderColor: $taskBorderColor;
$activeTaskBkgColor: $mainBkg;
$gridColor: lighten($border1, 30%);
$doneTaskBkgColor: $done;
$doneTaskBorderColor: $lineColor;
$critBkgColor: $critical;
$critBorderColor: darken($critBkgColor, 10%);
$todayLineColor: $critBkgColor;
/* state colors */
$labelColor: black;
@import '../mermaid';
assets/lib/mermaid/themes/pie.scss
-11
View File
@@ -1,11 +0,0 @@
.pieTitleText {
text-anchor: middle;
font-size: 25px;
fill: $taskTextDarkColor;
font-family: 'trebuchet ms', verdana, arial;
font-family: var(--mermaid-font-family);
}
.slice {
font-family: 'trebuchet ms', verdana, arial;
font-family: var(--mermaid-font-family);
}
assets/lib/mermaid/themes/sequence.scss
-97
View File
@@ -1,97 +0,0 @@
.actor {
stroke: $actorBorder;
fill: $actorBkg;
}
text.actor {
fill: $actorTextColor;
stroke: none;
}
.actor-line {
stroke: $actorLineColor;
}
.messageLine0 {
stroke-width: 1.5;
stroke-dasharray: '2 2';
stroke: $signalColor;
}
.messageLine1 {
stroke-width: 1.5;
stroke-dasharray: '2 2';
stroke: $signalColor;
}
#arrowhead {
fill: $signalColor;
}
.sequenceNumber {
fill: $sequenceNumberColor;
}
#sequencenumber {
fill: $signalColor;
}
#crosshead path {
fill: $signalColor !important;
stroke: $signalColor !important;
}
.messageText {
fill: $signalTextColor;
stroke: none;
}
.labelBox {
stroke: $labelBoxBorderColor;
fill: $labelBoxBkgColor;
}
.labelText {
fill: $labelTextColor;
stroke: none;
}
.loopText {
fill: $loopTextColor;
stroke: none;
}
.loopLine {
stroke-width: 2;
stroke-dasharray: '2 2';
stroke: $labelBoxBorderColor;
}
.note {
//stroke: #decc93;
stroke: $noteBorderColor;
fill: $noteBkgColor;
}
.noteText {
fill: black;
stroke: none;
font-family: 'trebuchet ms', verdana, arial;
font-family: var(--mermaid-font-family);
font-size: 14px;
}
.activation0 {
fill: $activationBkgColor;
stroke: $activationBorderColor;
}
.activation1 {
fill: $activationBkgColor;
stroke: $activationBorderColor;
}
.activation2 {
fill: $activationBkgColor;
stroke: $activationBorderColor;
}
assets/lib/mermaid/themes/state.scss
-132
View File
@@ -1,132 +0,0 @@
g.stateGroup text {
fill: $nodeBorder;
stroke: none;
font-size: 10px;
font-family: 'trebuchet ms', verdana, arial;
font-family: var(--mermaid-font-family);
}
g.stateGroup text {
fill: $nodeBorder;
stroke: none;
font-size: 10px;
}
g.stateGroup .state-title {
font-weight: bolder;
fill: $labelColor;
}
g.stateGroup rect {
fill: $nodeBkg;
stroke: $nodeBorder;
}
g.stateGroup line {
stroke: $nodeBorder;
stroke-width: 1;
}
.transition {
stroke: $nodeBorder;
stroke-width: 1;
fill: none;
}
.stateGroup .composit {
fill: white;
border-bottom: 1px
}
.stateGroup .alt-composit {
fill: #e0e0e0;
border-bottom: 1px
}
.state-note {
stroke: $noteBorderColor;
fill: $noteBkgColor;
text {
fill: black;
stroke: none;
font-size: 10px;
}
}
.stateLabel .box {
stroke: none;
stroke-width: 0;
fill: $nodeBkg;
opacity: 0.5;
}
.stateLabel text {
fill: $labelColor;
font-size: 10px;
font-weight: bold;
font-family: 'trebuchet ms', verdana, arial;
font-family: var(--mermaid-font-family);
}
.node circle.state-start {
fill: black;
stroke: black;
}
.node circle.state-end {
fill: black;
stroke: white;
stroke-width: 1.5
}
#statediagram-barbEnd {
fill: $nodeBorder
}
.statediagram-cluster rect {
fill: $nodeBkg;
stroke: $nodeBorder;
stroke-width: 1px;
}
.statediagram-cluster rect.outer {
rx: 5px;
ry: 5px;
}
.statediagram-state .divider {
stroke: $nodeBorder;
}
.statediagram-state .title-state {
rx: 5px;
ry: 5px;
}
.statediagram-cluster.statediagram-cluster .inner {
fill: white;
}
.statediagram-cluster.statediagram-cluster-alt .inner {
fill: #e0e0e0;
}
.statediagram-cluster .inner {
rx:0;
ry:0;
}
.statediagram-state rect.basic {
rx: 5px;
ry: 5px;
}
.statediagram-state rect.divider {
stroke-dasharray: 10,10;
fill: #efefef;
}
.note-edge {
stroke-dasharray: 5;
}
.statediagram-note rect {
fill: $noteBkgColor;
stroke: $noteBorderColor;
stroke-width: 1px;
rx: 0;
ry: 0;
}
exampleSite/content/posts/theme-documentation-extended-shortcodes/index.en.md
+14 -24
View File
@@ -464,44 +464,34 @@ Example **git graph** `mermaid` input:
```markdown ```markdown
{{</* mermaid */>}} {{</* mermaid */>}}
gitGraph: gitGraph
options
{
"nodeSpacing": 100,
"nodeRadius": 10
}
end
commit
branch newbranch
checkout newbranch
commit commit
commit commit
checkout master branch develop
checkout develop
commit
commit
checkout main
merge develop
commit commit
commit commit
merge newbranch
{{</* /mermaid */>}} {{</* /mermaid */>}}
``` ```
The rendered output looks like this: The rendered output looks like this:
{{< mermaid >}} {{< mermaid >}}
gitGraph: gitGraph
options
{
"nodeSpacing": 100,
"nodeRadius": 10
}
end
commit
branch newbranch
checkout newbranch
commit commit
commit commit
checkout master branch develop
checkout develop
commit
commit
checkout main
merge develop
commit commit
commit commit
merge newbranch
{{< /mermaid >}} {{< /mermaid >}}
### 5.7 Pie {#pie} ### 5.7 Pie {#pie}
exampleSite/content/posts/theme-documentation-extended-shortcodes/index.zh-cn.md
+14 -24
View File
@@ -467,44 +467,34 @@ stateDiagram
```markdown ```markdown
{{</* mermaid */>}} {{</* mermaid */>}}
gitGraph: gitGraph
options
{
"nodeSpacing": 100,
"nodeRadius": 10
}
end
commit
branch newbranch
checkout newbranch
commit commit
commit commit
checkout master branch develop
checkout develop
commit
commit
checkout main
merge develop
commit commit
commit commit
merge newbranch
{{</* /mermaid */>}} {{</* /mermaid */>}}
``` ```
呈现的输出效果如下: 呈现的输出效果如下:
{{< mermaid >}} {{< mermaid >}}
gitGraph: gitGraph
options
{
"nodeSpacing": 100,
"nodeRadius": 10
}
end
commit
branch newbranch
checkout newbranch
commit commit
commit commit
checkout master branch develop
checkout develop
commit
commit
checkout main
merge develop
commit commit
commit commit
merge newbranch
{{< /mermaid >}} {{< /mermaid >}}
### 5.7 饼图 {#pie} ### 5.7 饼图 {#pie}
layouts/partials/assets.html
+1 -2
View File
@@ -131,8 +131,7 @@
{{- if (.Scratch.Get "this").mermaid -}} {{- if (.Scratch.Get "this").mermaid -}}
{{- $source := $cdn.mermaidJS | default "lib/mermaid/mermaid.min.js" -}} {{- $source := $cdn.mermaidJS | default "lib/mermaid/mermaid.min.js" -}}
{{- dict "Source" $source "Fingerprint" $fingerprint | dict "Scratch" .Scratch "Data" | partial "scratch/script.html" -}} {{- dict "Source" $source "Fingerprint" $fingerprint | dict "Scratch" .Scratch "Data" | partial "scratch/script.html" -}}
{{- $options := dict "targetPath" "lib/mermaid/mermaid.min.css" "enableSourceMap" true -}} {{- $_ := (resources.Get "lib/mermaid/mermaid.min.js.map").RelPermalink -}}
{{- dict "Source" "lib/mermaid/mermaid.scss" "ToCSS" $options "Fingerprint" $fingerprint | dict "Scratch" .Scratch "Data" | partial "scratch/style.html" -}}
{{- end -}} {{- end -}}
{{- /* ECharts */ -}} {{- /* ECharts */ -}}
resources/_gen/assets/scss/lib/mermaid/mermaid.scss_43d09a0fb297c4cc88d4122515a2e889.content
-3
View File
File diff suppressed because one or more lines are too long
resources/_gen/assets/scss/lib/mermaid/mermaid.scss_43d09a0fb297c4cc88d4122515a2e889.json
-1
View File
@@ -1 +0,0 @@
{"Target":"lib/mermaid/mermaid.min.css","MediaType":"text/css","Data":{}}
src/js/theme.js
+16 -10
View File
@@ -477,15 +477,19 @@ class Theme {
} }
initMermaid() { initMermaid() {
const $mermaidElements = document.getElementsByClassName('mermaid'); this._mermaidOnSwitchTheme = this._mermaidOnSwitchTheme || (() => {
if ($mermaidElements.length) { const $mermaidElements = document.getElementsByClassName('mermaid');
mermaid.initialize({startOnLoad: false, theme: 'null'}); if ($mermaidElements.length) {
this.util.forEach($mermaidElements, $mermaid => { mermaid.initialize({startOnLoad: false, theme: this.isDark ? 'dark' : 'neutral', securityLevel: 'loose'});
mermaid.mermaidAPI.render('svg-' + $mermaid.id, this.data[$mermaid.id], svgCode => { this.util.forEach($mermaidElements, $mermaid => {
$mermaid.insertAdjacentHTML('afterbegin', svgCode); mermaid.render('svg-' + $mermaid.id, this.data[$mermaid.id], svgCode => {
}, $mermaid); $mermaid.innerHTML = svgCode;
}); }, $mermaid);
} });
}
});
this.switchThemeEventSet.add(this._mermaidOnSwitchTheme);
this._mermaidOnSwitchTheme();
} }
initEcharts() { initEcharts() {
@@ -681,7 +685,9 @@ class Theme {
} }
$fixedButtons.style.display = 'none'; $fixedButtons.style.display = 'none';
} }
for (let event of this.scrollEventSet) event(); for (let event of this.scrollEventSet) window.setTimeout(() => {
event();
}, 100);;
this.oldScrollTop = this.newScrollTop; this.oldScrollTop = this.newScrollTop;
}, false); }, false);
} }