finish tree-view
This commit is contained in:
parent
4f559c2d04
commit
7ba166ea59
11
package-lock.json
generated
11
package-lock.json
generated
@ -9,6 +9,7 @@
|
|||||||
"version": "0.1.0",
|
"version": "0.1.0",
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"core-js": "^3.8.3",
|
"core-js": "^3.8.3",
|
||||||
|
"mitt": "^3.0.1",
|
||||||
"stream": "^0.0.2",
|
"stream": "^0.0.2",
|
||||||
"vue": "^3.2.13"
|
"vue": "^3.2.13"
|
||||||
},
|
},
|
||||||
@ -7637,6 +7638,11 @@
|
|||||||
"integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==",
|
"integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==",
|
||||||
"dev": true
|
"dev": true
|
||||||
},
|
},
|
||||||
|
"node_modules/mitt": {
|
||||||
|
"version": "3.0.1",
|
||||||
|
"resolved": "https://registry.npmmirror.com/mitt/-/mitt-3.0.1.tgz",
|
||||||
|
"integrity": "sha512-vKivATfr97l2/QBCYAkXYDbrIWPM2IIKEl7YPhjCvKlG3kE2gm+uBo6nEXK3M5/Ffh/FLpKExzOQ3JJoJGFKBw=="
|
||||||
|
},
|
||||||
"node_modules/mkdirp": {
|
"node_modules/mkdirp": {
|
||||||
"version": "0.5.6",
|
"version": "0.5.6",
|
||||||
"resolved": "https://registry.npmmirror.com/mkdirp/-/mkdirp-0.5.6.tgz",
|
"resolved": "https://registry.npmmirror.com/mkdirp/-/mkdirp-0.5.6.tgz",
|
||||||
@ -17139,6 +17145,11 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"mitt": {
|
||||||
|
"version": "3.0.1",
|
||||||
|
"resolved": "https://registry.npmmirror.com/mitt/-/mitt-3.0.1.tgz",
|
||||||
|
"integrity": "sha512-vKivATfr97l2/QBCYAkXYDbrIWPM2IIKEl7YPhjCvKlG3kE2gm+uBo6nEXK3M5/Ffh/FLpKExzOQ3JJoJGFKBw=="
|
||||||
|
},
|
||||||
"mkdirp": {
|
"mkdirp": {
|
||||||
"version": "0.5.6",
|
"version": "0.5.6",
|
||||||
"resolved": "https://registry.npmmirror.com/mkdirp/-/mkdirp-0.5.6.tgz",
|
"resolved": "https://registry.npmmirror.com/mkdirp/-/mkdirp-0.5.6.tgz",
|
||||||
|
|||||||
@ -9,6 +9,7 @@
|
|||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"core-js": "^3.8.3",
|
"core-js": "^3.8.3",
|
||||||
|
"mitt": "^3.0.1",
|
||||||
"stream": "^0.0.2",
|
"stream": "^0.0.2",
|
||||||
"vue": "^3.2.13"
|
"vue": "^3.2.13"
|
||||||
},
|
},
|
||||||
|
|||||||
23
public/iconfont.css
Normal file
23
public/iconfont.css
Normal file
@ -0,0 +1,23 @@
|
|||||||
|
@font-face {
|
||||||
|
font-family: "iconfont"; /* Project id 4440655 */
|
||||||
|
src: url('iconfont.woff2?t=1708523702559') format('woff2'),
|
||||||
|
url('iconfont.woff?t=1708523702559') format('woff'),
|
||||||
|
url('iconfont.ttf?t=1708523702559') format('truetype');
|
||||||
|
}
|
||||||
|
|
||||||
|
.iconfont {
|
||||||
|
font-family: "iconfont" !important;
|
||||||
|
font-size: 16px;
|
||||||
|
font-style: normal;
|
||||||
|
-webkit-font-smoothing: antialiased;
|
||||||
|
-moz-osx-font-smoothing: grayscale;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-memory-chip:before {
|
||||||
|
content: "\e600";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-wave-square:before {
|
||||||
|
content: "\ebd0";
|
||||||
|
}
|
||||||
|
|
||||||
BIN
public/iconfont.woff2
Normal file
BIN
public/iconfont.woff2
Normal file
Binary file not shown.
@ -7,8 +7,10 @@
|
|||||||
<meta name="viewport" content="width=device-width,initial-scale=1.0">
|
<meta name="viewport" content="width=device-width,initial-scale=1.0">
|
||||||
<link rel="icon" href="<%= BASE_URL %>icon.png">
|
<link rel="icon" href="<%= BASE_URL %>icon.png">
|
||||||
<title>Vcd Viewer</title>
|
<title>Vcd Viewer</title>
|
||||||
|
<link rel="stylesheet" href="ondark.css">
|
||||||
<link rel="stylesheet" href="vscode.css">
|
<link rel="stylesheet" href="vscode.css">
|
||||||
<link rel="stylesheet" href="vcd.css">
|
<link rel="stylesheet" href="vcd.css">
|
||||||
|
<link rel="stylesheet" href="iconfont.css">
|
||||||
<script src="vcd.js"></script>
|
<script src="vcd.js"></script>
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
|
|||||||
697
public/ondark.css
Normal file
697
public/ondark.css
Normal file
@ -0,0 +1,697 @@
|
|||||||
|
:root {
|
||||||
|
--vscode-foreground: #cccccc;
|
||||||
|
--vscode-disabledForeground: rgba(204, 204, 204, 0.5);
|
||||||
|
--vscode-errorForeground: #f48771;
|
||||||
|
--vscode-descriptionForeground: #abb2bf;
|
||||||
|
--vscode-icon-foreground: #c5c5c5;
|
||||||
|
--vscode-focusBorder: #3e4452;
|
||||||
|
--vscode-textSeparator-foreground: rgba(255, 255, 255, 0.18);
|
||||||
|
--vscode-textLink-foreground: #61afef;
|
||||||
|
--vscode-textLink-activeForeground: #3794ff;
|
||||||
|
--vscode-textPreformat-foreground: #d19a66;
|
||||||
|
--vscode-textPreformat-background: rgba(255, 255, 255, 0.1);
|
||||||
|
--vscode-textBlockQuote-background: #2e3440;
|
||||||
|
--vscode-textBlockQuote-border: #4b5362;
|
||||||
|
--vscode-textCodeBlock-background: rgba(10, 10, 10, 0.4);
|
||||||
|
--vscode-widget-shadow: rgba(0, 0, 0, 0.36);
|
||||||
|
--vscode-input-background: #1d1f23;
|
||||||
|
--vscode-input-foreground: #abb2bf;
|
||||||
|
--vscode-inputOption-activeBorder: #007acc;
|
||||||
|
--vscode-inputOption-hoverBackground: rgba(90, 93, 94, 0.5);
|
||||||
|
--vscode-inputOption-activeBackground: rgba(62, 68, 82, 0.4);
|
||||||
|
--vscode-inputOption-activeForeground: #ffffff;
|
||||||
|
--vscode-input-placeholderForeground: rgba(204, 204, 204, 0.5);
|
||||||
|
--vscode-inputValidation-infoBackground: #063b49;
|
||||||
|
--vscode-inputValidation-infoBorder: #007acc;
|
||||||
|
--vscode-inputValidation-warningBackground: #352a05;
|
||||||
|
--vscode-inputValidation-warningBorder: #b89500;
|
||||||
|
--vscode-inputValidation-errorBackground: #5a1d1d;
|
||||||
|
--vscode-inputValidation-errorBorder: #be1100;
|
||||||
|
--vscode-dropdown-background: #21252b;
|
||||||
|
--vscode-dropdown-foreground: #f0f0f0;
|
||||||
|
--vscode-dropdown-border: #21252b;
|
||||||
|
--vscode-button-foreground: #ffffff;
|
||||||
|
--vscode-button-separator: rgba(255, 255, 255, 0.4);
|
||||||
|
--vscode-button-background: #404754;
|
||||||
|
--vscode-button-hoverBackground: #4d5565;
|
||||||
|
--vscode-button-secondaryForeground: #c0bdbd;
|
||||||
|
--vscode-button-secondaryBackground: #30333d;
|
||||||
|
--vscode-button-secondaryHoverBackground: #3a3d49;
|
||||||
|
--vscode-badge-background: #282c34;
|
||||||
|
--vscode-badge-foreground: #ffffff;
|
||||||
|
--vscode-scrollbar-shadow: #23252c;
|
||||||
|
--vscode-scrollbarSlider-background: rgba(78, 86, 102, 0.38);
|
||||||
|
--vscode-scrollbarSlider-hoverBackground: rgba(90, 99, 117, 0.5);
|
||||||
|
--vscode-scrollbarSlider-activeBackground: rgba(116, 125, 145, 0.5);
|
||||||
|
--vscode-progressBar-background: #0e70c0;
|
||||||
|
--vscode-editorError-foreground: #c24038;
|
||||||
|
--vscode-editorWarning-foreground: #d19a66;
|
||||||
|
--vscode-editorInfo-foreground: #3794ff;
|
||||||
|
--vscode-editorHint-foreground: rgba(238, 238, 238, 0.7);
|
||||||
|
--vscode-sash-hoverBorder: #3e4452;
|
||||||
|
--vscode-editor-background: #282c34;
|
||||||
|
--vscode-editor-foreground: #abb2bf;
|
||||||
|
--vscode-editorStickyScroll-background: #282c34;
|
||||||
|
--vscode-editorStickyScrollHover-background: #2a2d2e;
|
||||||
|
--vscode-editorWidget-background: #21252b;
|
||||||
|
--vscode-editorWidget-foreground: #cccccc;
|
||||||
|
--vscode-editorWidget-border: #454545;
|
||||||
|
--vscode-quickInput-background: #21252b;
|
||||||
|
--vscode-quickInput-foreground: #cccccc;
|
||||||
|
--vscode-quickInputTitle-background: rgba(255, 255, 255, 0.1);
|
||||||
|
--vscode-pickerGroup-foreground: #3794ff;
|
||||||
|
--vscode-pickerGroup-border: #3f3f46;
|
||||||
|
--vscode-keybindingLabel-background: rgba(128, 128, 128, 0.17);
|
||||||
|
--vscode-keybindingLabel-foreground: #cccccc;
|
||||||
|
--vscode-keybindingLabel-border: rgba(51, 51, 51, 0.6);
|
||||||
|
--vscode-keybindingLabel-bottomBorder: rgba(68, 68, 68, 0.6);
|
||||||
|
--vscode-editor-selectionBackground: rgba(103, 118, 150, 0.38);
|
||||||
|
--vscode-editor-inactiveSelectionBackground: rgba(103, 118, 150, 0.19);
|
||||||
|
--vscode-editor-selectionHighlightBackground: rgba(255, 255, 255, 0.06);
|
||||||
|
--vscode-editor-selectionHighlightBorder: #dddddd;
|
||||||
|
--vscode-editor-findMatchBackground: #42557b;
|
||||||
|
--vscode-editor-findMatchHighlightBackground: rgba(97, 153, 255, 0.18);
|
||||||
|
--vscode-editor-findRangeHighlightBackground: rgba(58, 61, 65, 0.4);
|
||||||
|
--vscode-editor-findMatchBorder: #457dff;
|
||||||
|
--vscode-searchEditor-findMatchBackground: rgba(97, 153, 255, 0.12);
|
||||||
|
--vscode-search-resultsInfoForeground: rgba(204, 204, 204, 0.65);
|
||||||
|
--vscode-editor-hoverHighlightBackground: rgba(38, 79, 120, 0.25);
|
||||||
|
--vscode-editorHoverWidget-background: #21252b;
|
||||||
|
--vscode-editorHoverWidget-foreground: #cccccc;
|
||||||
|
--vscode-editorHoverWidget-border: #181a1f;
|
||||||
|
--vscode-editorHoverWidget-statusBarBackground: #282c34;
|
||||||
|
--vscode-editorLink-activeForeground: #4e94ce;
|
||||||
|
--vscode-editorInlayHint-foreground: #abb2bf;
|
||||||
|
--vscode-editorInlayHint-background: #2c313c;
|
||||||
|
--vscode-editorInlayHint-typeForeground: #abb2bf;
|
||||||
|
--vscode-editorInlayHint-typeBackground: #2c313c;
|
||||||
|
--vscode-editorInlayHint-parameterForeground: #abb2bf;
|
||||||
|
--vscode-editorInlayHint-parameterBackground: #2c313c;
|
||||||
|
--vscode-editorLightBulb-foreground: #ffcc00;
|
||||||
|
--vscode-editorLightBulbAutoFix-foreground: #75beff;
|
||||||
|
--vscode-editorLightBulbAi-foreground: #767676;
|
||||||
|
--vscode-diffEditor-insertedTextBackground: rgba(0, 128, 155, 0.2);
|
||||||
|
--vscode-diffEditor-removedTextBackground: rgba(255, 0, 0, 0.2);
|
||||||
|
--vscode-diffEditor-insertedLineBackground: rgba(155, 185, 85, 0.2);
|
||||||
|
--vscode-diffEditor-removedLineBackground: rgba(255, 0, 0, 0.2);
|
||||||
|
--vscode-diffEditor-diagonalFill: rgba(204, 204, 204, 0.2);
|
||||||
|
--vscode-diffEditor-unchangedRegionBackground: #21252b;
|
||||||
|
--vscode-diffEditor-unchangedRegionForeground: #cccccc;
|
||||||
|
--vscode-diffEditor-unchangedCodeBackground: rgba(116, 116, 116, 0.16);
|
||||||
|
--vscode-list-focusBackground: #323842;
|
||||||
|
--vscode-list-focusForeground: #f0f0f0;
|
||||||
|
--vscode-list-focusOutline: #3e4452;
|
||||||
|
--vscode-list-activeSelectionBackground: #2c313a;
|
||||||
|
--vscode-list-activeSelectionForeground: #d7dae0;
|
||||||
|
--vscode-list-inactiveSelectionBackground: #323842;
|
||||||
|
--vscode-list-inactiveSelectionForeground: #d7dae0;
|
||||||
|
--vscode-list-hoverBackground: #2c313a;
|
||||||
|
--vscode-list-hoverForeground: #abb2bf;
|
||||||
|
--vscode-list-dropBackground: #062f4a;
|
||||||
|
--vscode-list-highlightForeground: #ecebeb;
|
||||||
|
--vscode-list-focusHighlightForeground: #ecebeb;
|
||||||
|
--vscode-list-invalidItemForeground: #b89500;
|
||||||
|
--vscode-list-errorForeground: #f88070;
|
||||||
|
--vscode-list-warningForeground: #d19a66;
|
||||||
|
--vscode-listFilterWidget-background: #21252b;
|
||||||
|
--vscode-listFilterWidget-outline: rgba(0, 0, 0, 0);
|
||||||
|
--vscode-listFilterWidget-noMatchesOutline: #be1100;
|
||||||
|
--vscode-listFilterWidget-shadow: rgba(0, 0, 0, 0.36);
|
||||||
|
--vscode-list-filterMatchBackground: rgba(97, 153, 255, 0.18);
|
||||||
|
--vscode-tree-indentGuidesStroke: rgba(255, 255, 255, 0.11);
|
||||||
|
--vscode-tree-inactiveIndentGuidesStroke: rgba(255, 255, 255, 0.05);
|
||||||
|
--vscode-tree-tableColumnsBorder: rgba(204, 204, 204, 0.13);
|
||||||
|
--vscode-tree-tableOddRowsBackground: rgba(204, 204, 204, 0.04);
|
||||||
|
--vscode-list-deemphasizedForeground: #8c8c8c;
|
||||||
|
--vscode-checkbox-background: #21252b;
|
||||||
|
--vscode-checkbox-selectBackground: #21252b;
|
||||||
|
--vscode-checkbox-foreground: #f0f0f0;
|
||||||
|
--vscode-checkbox-border: #404754;
|
||||||
|
--vscode-checkbox-selectBorder: #c5c5c5;
|
||||||
|
--vscode-quickInputList-focusForeground: #d7dae0;
|
||||||
|
--vscode-quickInputList-focusBackground: #2c313a;
|
||||||
|
--vscode-menu-foreground: #abb2bf;
|
||||||
|
--vscode-menu-background: #21252b;
|
||||||
|
--vscode-menu-selectionForeground: #d7dae0;
|
||||||
|
--vscode-menu-selectionBackground: #2c313a;
|
||||||
|
--vscode-menu-separatorBackground: #343a45;
|
||||||
|
--vscode-toolbar-hoverBackground: rgba(90, 93, 94, 0.31);
|
||||||
|
--vscode-toolbar-activeBackground: rgba(99, 102, 103, 0.31);
|
||||||
|
--vscode-editor-snippetTabstopHighlightBackground: rgba(124, 124, 124, 0.3);
|
||||||
|
--vscode-editor-snippetFinalTabstopHighlightBorder: #525252;
|
||||||
|
--vscode-breadcrumb-foreground: rgba(204, 204, 204, 0.8);
|
||||||
|
--vscode-breadcrumb-background: #282c34;
|
||||||
|
--vscode-breadcrumb-focusForeground: #e0e0e0;
|
||||||
|
--vscode-breadcrumb-activeSelectionForeground: #e0e0e0;
|
||||||
|
--vscode-breadcrumbPicker-background: #21252b;
|
||||||
|
--vscode-merge-currentHeaderBackground: rgba(64, 200, 174, 0.5);
|
||||||
|
--vscode-merge-currentContentBackground: rgba(64, 200, 174, 0.2);
|
||||||
|
--vscode-merge-incomingHeaderBackground: rgba(64, 166, 255, 0.5);
|
||||||
|
--vscode-merge-incomingContentBackground: rgba(64, 166, 255, 0.2);
|
||||||
|
--vscode-merge-commonHeaderBackground: rgba(96, 96, 96, 0.4);
|
||||||
|
--vscode-merge-commonContentBackground: rgba(96, 96, 96, 0.16);
|
||||||
|
--vscode-editorOverviewRuler-currentContentForeground: rgba(64, 200, 174, 0.5);
|
||||||
|
--vscode-editorOverviewRuler-incomingContentForeground: rgba(64, 166, 255, 0.5);
|
||||||
|
--vscode-editorOverviewRuler-commonContentForeground: rgba(96, 96, 96, 0.4);
|
||||||
|
--vscode-editorOverviewRuler-findMatchForeground: rgba(209, 134, 22, 0.49);
|
||||||
|
--vscode-editorOverviewRuler-selectionHighlightForeground: rgba(160, 160, 160, 0.8);
|
||||||
|
--vscode-minimap-findMatchHighlight: #d18616;
|
||||||
|
--vscode-minimap-selectionOccurrenceHighlight: #676767;
|
||||||
|
--vscode-minimap-selectionHighlight: #264f78;
|
||||||
|
--vscode-minimap-infoHighlight: #3794ff;
|
||||||
|
--vscode-minimap-warningHighlight: #d19a66;
|
||||||
|
--vscode-minimap-errorHighlight: rgba(255, 18, 18, 0.7);
|
||||||
|
--vscode-minimap-foregroundOpacity: #000000;
|
||||||
|
--vscode-minimapSlider-background: rgba(78, 86, 102, 0.19);
|
||||||
|
--vscode-minimapSlider-hoverBackground: rgba(90, 99, 117, 0.25);
|
||||||
|
--vscode-minimapSlider-activeBackground: rgba(116, 125, 145, 0.25);
|
||||||
|
--vscode-problemsErrorIcon-foreground: #c24038;
|
||||||
|
--vscode-problemsWarningIcon-foreground: #d19a66;
|
||||||
|
--vscode-problemsInfoIcon-foreground: #3794ff;
|
||||||
|
--vscode-charts-foreground: #cccccc;
|
||||||
|
--vscode-charts-lines: rgba(204, 204, 204, 0.5);
|
||||||
|
--vscode-charts-red: #c24038;
|
||||||
|
--vscode-charts-blue: #3794ff;
|
||||||
|
--vscode-charts-yellow: #d19a66;
|
||||||
|
--vscode-charts-orange: #d18616;
|
||||||
|
--vscode-charts-green: #89d185;
|
||||||
|
--vscode-charts-purple: #b180d7;
|
||||||
|
--vscode-diffEditor-move-border: rgba(139, 139, 139, 0.61);
|
||||||
|
--vscode-diffEditor-moveActive-border: #ffa500;
|
||||||
|
--vscode-diffEditor-unchangedRegionShadow: #000000;
|
||||||
|
--vscode-multiDiffEditor-headerBackground: #808080;
|
||||||
|
--vscode-symbolIcon-arrayForeground: #cccccc;
|
||||||
|
--vscode-symbolIcon-booleanForeground: #cccccc;
|
||||||
|
--vscode-symbolIcon-classForeground: #ee9d28;
|
||||||
|
--vscode-symbolIcon-colorForeground: #cccccc;
|
||||||
|
--vscode-symbolIcon-constantForeground: #cccccc;
|
||||||
|
--vscode-symbolIcon-constructorForeground: #b180d7;
|
||||||
|
--vscode-symbolIcon-enumeratorForeground: #ee9d28;
|
||||||
|
--vscode-symbolIcon-enumeratorMemberForeground: #75beff;
|
||||||
|
--vscode-symbolIcon-eventForeground: #ee9d28;
|
||||||
|
--vscode-symbolIcon-fieldForeground: #75beff;
|
||||||
|
--vscode-symbolIcon-fileForeground: #cccccc;
|
||||||
|
--vscode-symbolIcon-folderForeground: #cccccc;
|
||||||
|
--vscode-symbolIcon-functionForeground: #b180d7;
|
||||||
|
--vscode-symbolIcon-interfaceForeground: #75beff;
|
||||||
|
--vscode-symbolIcon-keyForeground: #cccccc;
|
||||||
|
--vscode-symbolIcon-keywordForeground: #cccccc;
|
||||||
|
--vscode-symbolIcon-methodForeground: #b180d7;
|
||||||
|
--vscode-symbolIcon-moduleForeground: #cccccc;
|
||||||
|
--vscode-symbolIcon-namespaceForeground: #cccccc;
|
||||||
|
--vscode-symbolIcon-nullForeground: #cccccc;
|
||||||
|
--vscode-symbolIcon-numberForeground: #cccccc;
|
||||||
|
--vscode-symbolIcon-objectForeground: #cccccc;
|
||||||
|
--vscode-symbolIcon-operatorForeground: #cccccc;
|
||||||
|
--vscode-symbolIcon-packageForeground: #cccccc;
|
||||||
|
--vscode-symbolIcon-propertyForeground: #cccccc;
|
||||||
|
--vscode-symbolIcon-referenceForeground: #cccccc;
|
||||||
|
--vscode-symbolIcon-snippetForeground: #cccccc;
|
||||||
|
--vscode-symbolIcon-stringForeground: #cccccc;
|
||||||
|
--vscode-symbolIcon-structForeground: #cccccc;
|
||||||
|
--vscode-symbolIcon-textForeground: #cccccc;
|
||||||
|
--vscode-symbolIcon-typeParameterForeground: #cccccc;
|
||||||
|
--vscode-symbolIcon-unitForeground: #cccccc;
|
||||||
|
--vscode-symbolIcon-variableForeground: #75beff;
|
||||||
|
--vscode-actionBar-toggledBackground: rgba(62, 68, 82, 0.4);
|
||||||
|
--vscode-editorHoverWidget-highlightForeground: #61afef;
|
||||||
|
--vscode-editor-lineHighlightBackground: #2c313c;
|
||||||
|
--vscode-editor-lineHighlightBorder: #282828;
|
||||||
|
--vscode-editor-rangeHighlightBackground: rgba(255, 255, 255, 0.04);
|
||||||
|
--vscode-editor-symbolHighlightBackground: rgba(97, 153, 255, 0.18);
|
||||||
|
--vscode-editorCursor-foreground: #528bff;
|
||||||
|
--vscode-editorCursor-background: rgba(255, 255, 255, 0.79);
|
||||||
|
--vscode-editorWhitespace-foreground: rgba(255, 255, 255, 0.11);
|
||||||
|
--vscode-editorLineNumber-foreground: #495162;
|
||||||
|
--vscode-editorIndentGuide-background: #3b4048;
|
||||||
|
--vscode-editorIndentGuide-activeBackground: rgba(200, 200, 200, 0.35);
|
||||||
|
--vscode-editorIndentGuide-background1: #3b4048;
|
||||||
|
--vscode-editorIndentGuide-background2: rgba(0, 0, 0, 0);
|
||||||
|
--vscode-editorIndentGuide-background3: rgba(0, 0, 0, 0);
|
||||||
|
--vscode-editorIndentGuide-background4: rgba(0, 0, 0, 0);
|
||||||
|
--vscode-editorIndentGuide-background5: rgba(0, 0, 0, 0);
|
||||||
|
--vscode-editorIndentGuide-background6: rgba(0, 0, 0, 0);
|
||||||
|
--vscode-editorIndentGuide-activeBackground1: rgba(200, 200, 200, 0.35);
|
||||||
|
--vscode-editorIndentGuide-activeBackground2: rgba(0, 0, 0, 0);
|
||||||
|
--vscode-editorIndentGuide-activeBackground3: rgba(0, 0, 0, 0);
|
||||||
|
--vscode-editorIndentGuide-activeBackground4: rgba(0, 0, 0, 0);
|
||||||
|
--vscode-editorIndentGuide-activeBackground5: rgba(0, 0, 0, 0);
|
||||||
|
--vscode-editorIndentGuide-activeBackground6: rgba(0, 0, 0, 0);
|
||||||
|
--vscode-editorActiveLineNumber-foreground: #c6c6c6;
|
||||||
|
--vscode-editorLineNumber-activeForeground: #abb2bf;
|
||||||
|
--vscode-editorRuler-foreground: rgba(171, 178, 191, 0.15);
|
||||||
|
--vscode-editorCodeLens-foreground: #999999;
|
||||||
|
--vscode-editorBracketMatch-background: #515a6b;
|
||||||
|
--vscode-editorBracketMatch-border: #515a6b;
|
||||||
|
--vscode-editorOverviewRuler-border: rgba(127, 127, 127, 0.3);
|
||||||
|
--vscode-editorGutter-background: #282c34;
|
||||||
|
--vscode-editorUnnecessaryCode-opacity: rgba(0, 0, 0, 0.67);
|
||||||
|
--vscode-editorGhostText-foreground: rgba(255, 255, 255, 0.34);
|
||||||
|
--vscode-editorOverviewRuler-rangeHighlightForeground: rgba(0, 122, 204, 0.6);
|
||||||
|
--vscode-editorOverviewRuler-errorForeground: rgba(255, 18, 18, 0.7);
|
||||||
|
--vscode-editorOverviewRuler-warningForeground: #d19a66;
|
||||||
|
--vscode-editorOverviewRuler-infoForeground: #3794ff;
|
||||||
|
--vscode-editorBracketHighlight-foreground1: #d19a66;
|
||||||
|
--vscode-editorBracketHighlight-foreground2: #c678dd;
|
||||||
|
--vscode-editorBracketHighlight-foreground3: #56b6c2;
|
||||||
|
--vscode-editorBracketHighlight-foreground4: rgba(0, 0, 0, 0);
|
||||||
|
--vscode-editorBracketHighlight-foreground5: rgba(0, 0, 0, 0);
|
||||||
|
--vscode-editorBracketHighlight-foreground6: rgba(0, 0, 0, 0);
|
||||||
|
--vscode-editorBracketHighlight-unexpectedBracket-foreground: rgba(255, 18, 18, 0.8);
|
||||||
|
--vscode-editorBracketPairGuide-background1: rgba(0, 0, 0, 0);
|
||||||
|
--vscode-editorBracketPairGuide-background2: rgba(0, 0, 0, 0);
|
||||||
|
--vscode-editorBracketPairGuide-background3: rgba(0, 0, 0, 0);
|
||||||
|
--vscode-editorBracketPairGuide-background4: rgba(0, 0, 0, 0);
|
||||||
|
--vscode-editorBracketPairGuide-background5: rgba(0, 0, 0, 0);
|
||||||
|
--vscode-editorBracketPairGuide-background6: rgba(0, 0, 0, 0);
|
||||||
|
--vscode-editorBracketPairGuide-activeBackground1: rgba(0, 0, 0, 0);
|
||||||
|
--vscode-editorBracketPairGuide-activeBackground2: rgba(0, 0, 0, 0);
|
||||||
|
--vscode-editorBracketPairGuide-activeBackground3: rgba(0, 0, 0, 0);
|
||||||
|
--vscode-editorBracketPairGuide-activeBackground4: rgba(0, 0, 0, 0);
|
||||||
|
--vscode-editorBracketPairGuide-activeBackground5: rgba(0, 0, 0, 0);
|
||||||
|
--vscode-editorBracketPairGuide-activeBackground6: rgba(0, 0, 0, 0);
|
||||||
|
--vscode-editorUnicodeHighlight-border: #bd9b03;
|
||||||
|
--vscode-editorUnicodeHighlight-background: rgba(189, 155, 3, 0.15);
|
||||||
|
--vscode-editorOverviewRuler-bracketMatchForeground: #a0a0a0;
|
||||||
|
--vscode-editor-foldBackground: rgba(103, 118, 150, 0.11);
|
||||||
|
--vscode-editorGutter-foldingControlForeground: #c5c5c5;
|
||||||
|
--vscode-editor-linkedEditingBackground: rgba(255, 0, 0, 0.3);
|
||||||
|
--vscode-editor-wordHighlightBackground: rgba(210, 224, 255, 0.18);
|
||||||
|
--vscode-editor-wordHighlightStrongBackground: rgba(171, 178, 191, 0.15);
|
||||||
|
--vscode-editor-wordHighlightTextBackground: rgba(210, 224, 255, 0.18);
|
||||||
|
--vscode-editor-wordHighlightBorder: #7f848e;
|
||||||
|
--vscode-editor-wordHighlightStrongBorder: #7f848e;
|
||||||
|
--vscode-editor-wordHighlightTextBorder: #7f848e;
|
||||||
|
--vscode-editorOverviewRuler-wordHighlightForeground: rgba(160, 160, 160, 0.8);
|
||||||
|
--vscode-editorOverviewRuler-wordHighlightStrongForeground: rgba(192, 160, 192, 0.8);
|
||||||
|
--vscode-editorOverviewRuler-wordHighlightTextForeground: rgba(160, 160, 160, 0.8);
|
||||||
|
--vscode-peekViewTitle-background: #252526;
|
||||||
|
--vscode-peekViewTitleLabel-foreground: #ffffff;
|
||||||
|
--vscode-peekViewTitleDescription-foreground: rgba(204, 204, 204, 0.7);
|
||||||
|
--vscode-peekView-border: #3794ff;
|
||||||
|
--vscode-peekViewResult-background: #22262b;
|
||||||
|
--vscode-peekViewResult-lineForeground: #bbbbbb;
|
||||||
|
--vscode-peekViewResult-fileForeground: #ffffff;
|
||||||
|
--vscode-peekViewResult-selectionBackground: rgba(51, 153, 255, 0.2);
|
||||||
|
--vscode-peekViewResult-selectionForeground: #ffffff;
|
||||||
|
--vscode-peekViewEditor-background: #1b1d23;
|
||||||
|
--vscode-peekViewEditorGutter-background: #1b1d23;
|
||||||
|
--vscode-peekViewEditorStickyScroll-background: #1b1d23;
|
||||||
|
--vscode-peekViewResult-matchHighlightBackground: rgba(234, 92, 0, 0.3);
|
||||||
|
--vscode-peekViewEditor-matchHighlightBackground: #29244b;
|
||||||
|
--vscode-editorMarkerNavigationError-background: #c24038;
|
||||||
|
--vscode-editorMarkerNavigationError-headerBackground: rgba(194, 64, 56, 0.1);
|
||||||
|
--vscode-editorMarkerNavigationWarning-background: #d19a66;
|
||||||
|
--vscode-editorMarkerNavigationWarning-headerBackground: rgba(209, 154, 102, 0.1);
|
||||||
|
--vscode-editorMarkerNavigationInfo-background: #3794ff;
|
||||||
|
--vscode-editorMarkerNavigationInfo-headerBackground: rgba(55, 148, 255, 0.1);
|
||||||
|
--vscode-editorMarkerNavigation-background: #21252b;
|
||||||
|
--vscode-editorSuggestWidget-background: #21252b;
|
||||||
|
--vscode-editorSuggestWidget-border: #181a1f;
|
||||||
|
--vscode-editorSuggestWidget-foreground: #abb2bf;
|
||||||
|
--vscode-editorSuggestWidget-selectedForeground: #d7dae0;
|
||||||
|
--vscode-editorSuggestWidget-selectedBackground: #2c313a;
|
||||||
|
--vscode-editorSuggestWidget-highlightForeground: #ecebeb;
|
||||||
|
--vscode-editorSuggestWidget-focusHighlightForeground: #ecebeb;
|
||||||
|
--vscode-editorSuggestWidgetStatus-foreground: rgba(171, 178, 191, 0.5);
|
||||||
|
--vscode-tab-activeBackground: #282c34;
|
||||||
|
--vscode-tab-unfocusedActiveBackground: #282c34;
|
||||||
|
--vscode-tab-inactiveBackground: #21252b;
|
||||||
|
--vscode-tab-unfocusedInactiveBackground: #21252b;
|
||||||
|
--vscode-tab-activeForeground: #dcdcdc;
|
||||||
|
--vscode-tab-inactiveForeground: rgba(220, 220, 220, 0.5);
|
||||||
|
--vscode-tab-unfocusedActiveForeground: rgba(220, 220, 220, 0.5);
|
||||||
|
--vscode-tab-unfocusedInactiveForeground: rgba(220, 220, 220, 0.25);
|
||||||
|
--vscode-tab-hoverBackground: #323842;
|
||||||
|
--vscode-tab-unfocusedHoverBackground: #323842;
|
||||||
|
--vscode-tab-border: #181a1f;
|
||||||
|
--vscode-tab-lastPinnedBorder: rgba(255, 255, 255, 0.11);
|
||||||
|
--vscode-tab-activeBorder: #b4b4b4;
|
||||||
|
--vscode-tab-unfocusedActiveBorder: rgba(180, 180, 180, 0.5);
|
||||||
|
--vscode-tab-activeModifiedBorder: #3399cc;
|
||||||
|
--vscode-tab-inactiveModifiedBorder: rgba(51, 153, 204, 0.5);
|
||||||
|
--vscode-tab-unfocusedActiveModifiedBorder: rgba(51, 153, 204, 0.5);
|
||||||
|
--vscode-tab-unfocusedInactiveModifiedBorder: rgba(51, 153, 204, 0.25);
|
||||||
|
--vscode-editorPane-background: #282c34;
|
||||||
|
--vscode-editorGroupHeader-tabsBackground: #21252b;
|
||||||
|
--vscode-editorGroupHeader-noTabsBackground: #282c34;
|
||||||
|
--vscode-editorGroup-border: #181a1f;
|
||||||
|
--vscode-editorGroup-dropBackground: rgba(83, 89, 93, 0.5);
|
||||||
|
--vscode-editorGroup-dropIntoPromptForeground: #cccccc;
|
||||||
|
--vscode-editorGroup-dropIntoPromptBackground: #21252b;
|
||||||
|
--vscode-sideBySideEditor-horizontalBorder: #181a1f;
|
||||||
|
--vscode-sideBySideEditor-verticalBorder: #181a1f;
|
||||||
|
--vscode-panel-background: #282c34;
|
||||||
|
--vscode-panel-border: #3e4452;
|
||||||
|
--vscode-panelTitle-activeForeground: #e7e7e7;
|
||||||
|
--vscode-panelTitle-inactiveForeground: rgba(231, 231, 231, 0.6);
|
||||||
|
--vscode-panelTitle-activeBorder: #e7e7e7;
|
||||||
|
--vscode-panel-dropBorder: #e7e7e7;
|
||||||
|
--vscode-panelSection-dropBackground: rgba(83, 89, 93, 0.5);
|
||||||
|
--vscode-panelSectionHeader-background: #21252b;
|
||||||
|
--vscode-panelSection-border: #3e4452;
|
||||||
|
--vscode-banner-background: #2c313a;
|
||||||
|
--vscode-banner-foreground: #d7dae0;
|
||||||
|
--vscode-banner-iconForeground: #3794ff;
|
||||||
|
--vscode-statusBar-foreground: #9da5b4;
|
||||||
|
--vscode-statusBar-noFolderForeground: #9da5b4;
|
||||||
|
--vscode-statusBar-background: #21252b;
|
||||||
|
--vscode-statusBar-noFolderBackground: #21252b;
|
||||||
|
--vscode-statusBar-focusBorder: #9da5b4;
|
||||||
|
--vscode-statusBarItem-activeBackground: rgba(255, 255, 255, 0.18);
|
||||||
|
--vscode-statusBarItem-focusBorder: #9da5b4;
|
||||||
|
--vscode-statusBarItem-hoverBackground: rgba(255, 255, 255, 0.12);
|
||||||
|
--vscode-statusBarItem-hoverForeground: #9da5b4;
|
||||||
|
--vscode-statusBarItem-compactHoverBackground: rgba(255, 255, 255, 0.2);
|
||||||
|
--vscode-statusBarItem-prominentForeground: #9da5b4;
|
||||||
|
--vscode-statusBarItem-prominentBackground: rgba(0, 0, 0, 0.5);
|
||||||
|
--vscode-statusBarItem-prominentHoverForeground: #9da5b4;
|
||||||
|
--vscode-statusBarItem-prominentHoverBackground: rgba(0, 0, 0, 0.3);
|
||||||
|
--vscode-statusBarItem-errorBackground: #c72e0f;
|
||||||
|
--vscode-statusBarItem-errorForeground: #ffffff;
|
||||||
|
--vscode-statusBarItem-errorHoverForeground: #9da5b4;
|
||||||
|
--vscode-statusBarItem-errorHoverBackground: rgba(255, 255, 255, 0.12);
|
||||||
|
--vscode-statusBarItem-warningBackground: #905c2b;
|
||||||
|
--vscode-statusBarItem-warningForeground: #ffffff;
|
||||||
|
--vscode-statusBarItem-warningHoverForeground: #9da5b4;
|
||||||
|
--vscode-statusBarItem-warningHoverBackground: rgba(255, 255, 255, 0.12);
|
||||||
|
--vscode-activityBar-background: #282c34;
|
||||||
|
--vscode-activityBar-foreground: #d7dae0;
|
||||||
|
--vscode-activityBar-inactiveForeground: rgba(215, 218, 224, 0.4);
|
||||||
|
--vscode-activityBar-activeBorder: #d7dae0;
|
||||||
|
--vscode-activityBar-dropBorder: #d7dae0;
|
||||||
|
--vscode-activityBarBadge-background: #4d78cc;
|
||||||
|
--vscode-activityBarBadge-foreground: #f8fafd;
|
||||||
|
--vscode-profileBadge-background: #4d4d4d;
|
||||||
|
--vscode-profileBadge-foreground: #ffffff;
|
||||||
|
--vscode-statusBarItem-remoteBackground: #4d78cc;
|
||||||
|
--vscode-statusBarItem-remoteForeground: #f8fafd;
|
||||||
|
--vscode-statusBarItem-remoteHoverForeground: #9da5b4;
|
||||||
|
--vscode-statusBarItem-remoteHoverBackground: rgba(255, 255, 255, 0.12);
|
||||||
|
--vscode-statusBarItem-offlineBackground: #6c1717;
|
||||||
|
--vscode-statusBarItem-offlineForeground: #f8fafd;
|
||||||
|
--vscode-statusBarItem-offlineHoverForeground: #9da5b4;
|
||||||
|
--vscode-statusBarItem-offlineHoverBackground: rgba(255, 255, 255, 0.12);
|
||||||
|
--vscode-extensionBadge-remoteBackground: #4d78cc;
|
||||||
|
--vscode-extensionBadge-remoteForeground: #f8fafd;
|
||||||
|
--vscode-sideBar-background: #21252b;
|
||||||
|
--vscode-sideBar-foreground: #abb2bf;
|
||||||
|
--vscode-sideBarTitle-foreground: #abb2bf;
|
||||||
|
--vscode-sideBar-dropBackground: rgba(83, 89, 93, 0.5);
|
||||||
|
--vscode-sideBarSectionHeader-background: #282c34;
|
||||||
|
--vscode-sideBarSectionHeader-foreground: #abb2bf;
|
||||||
|
--vscode-titleBar-activeForeground: #9da5b4;
|
||||||
|
--vscode-titleBar-inactiveForeground: #6b717d;
|
||||||
|
--vscode-titleBar-activeBackground: #282c34;
|
||||||
|
--vscode-titleBar-inactiveBackground: #282c34;
|
||||||
|
--vscode-menubar-selectionForeground: #9da5b4;
|
||||||
|
--vscode-menubar-selectionBackground: rgba(90, 93, 94, 0.31);
|
||||||
|
--vscode-commandCenter-foreground: #9da5b4;
|
||||||
|
--vscode-commandCenter-activeForeground: #9da5b4;
|
||||||
|
--vscode-commandCenter-inactiveForeground: #6b717d;
|
||||||
|
--vscode-commandCenter-background: rgba(255, 255, 255, 0.05);
|
||||||
|
--vscode-commandCenter-activeBackground: rgba(255, 255, 255, 0.08);
|
||||||
|
--vscode-commandCenter-border: rgba(157, 165, 180, 0.2);
|
||||||
|
--vscode-commandCenter-activeBorder: rgba(157, 165, 180, 0.3);
|
||||||
|
--vscode-commandCenter-inactiveBorder: rgba(107, 113, 125, 0.25);
|
||||||
|
--vscode-notifications-foreground: #cccccc;
|
||||||
|
--vscode-notifications-background: #21252b;
|
||||||
|
--vscode-notificationLink-foreground: #61afef;
|
||||||
|
--vscode-notificationCenterHeader-background: #2b3038;
|
||||||
|
--vscode-notifications-border: #2b3038;
|
||||||
|
--vscode-notificationsErrorIcon-foreground: #c24038;
|
||||||
|
--vscode-notificationsWarningIcon-foreground: #d19a66;
|
||||||
|
--vscode-notificationsInfoIcon-foreground: #3794ff;
|
||||||
|
--vscode-chat-requestBorder: rgba(255, 255, 255, 0.1);
|
||||||
|
--vscode-chat-slashCommandBackground: #34414b;
|
||||||
|
--vscode-chat-slashCommandForeground: #40a6ff;
|
||||||
|
--vscode-chat-avatarBackground: #1f1f1f;
|
||||||
|
--vscode-chat-avatarForeground: #cccccc;
|
||||||
|
--vscode-simpleFindWidget-sashBorder: #454545;
|
||||||
|
--vscode-commentsView-resolvedIcon: rgba(204, 204, 204, 0.5);
|
||||||
|
--vscode-commentsView-unresolvedIcon: #3e4452;
|
||||||
|
--vscode-editorCommentsWidget-replyInputBackground: #252526;
|
||||||
|
--vscode-editorCommentsWidget-resolvedBorder: rgba(204, 204, 204, 0.5);
|
||||||
|
--vscode-editorCommentsWidget-unresolvedBorder: #3e4452;
|
||||||
|
--vscode-editorCommentsWidget-rangeBackground: rgba(62, 68, 82, 0.1);
|
||||||
|
--vscode-editorCommentsWidget-rangeActiveBackground: rgba(62, 68, 82, 0.1);
|
||||||
|
--vscode-editorGutter-commentRangeForeground: #323842;
|
||||||
|
--vscode-editorOverviewRuler-commentForeground: #323842;
|
||||||
|
--vscode-editorOverviewRuler-commentUnresolvedForeground: #323842;
|
||||||
|
--vscode-editorGutter-commentGlyphForeground: #abb2bf;
|
||||||
|
--vscode-editorGutter-commentUnresolvedGlyphForeground: #abb2bf;
|
||||||
|
--vscode-debugToolBar-background: #21252b;
|
||||||
|
--vscode-debugIcon-startForeground: #89d185;
|
||||||
|
--vscode-editor-stackFrameHighlightBackground: rgba(255, 255, 0, 0.2);
|
||||||
|
--vscode-editor-focusedStackFrameHighlightBackground: rgba(122, 189, 122, 0.3);
|
||||||
|
--vscode-mergeEditor-change-background: rgba(155, 185, 85, 0.2);
|
||||||
|
--vscode-mergeEditor-change-word-background: rgba(156, 204, 44, 0.2);
|
||||||
|
--vscode-mergeEditor-changeBase-background: #4b1818;
|
||||||
|
--vscode-mergeEditor-changeBase-word-background: #6f1313;
|
||||||
|
--vscode-mergeEditor-conflict-unhandledUnfocused-border: rgba(255, 166, 0, 0.48);
|
||||||
|
--vscode-mergeEditor-conflict-unhandledFocused-border: #ffa600;
|
||||||
|
--vscode-mergeEditor-conflict-handledUnfocused-border: rgba(134, 134, 134, 0.29);
|
||||||
|
--vscode-mergeEditor-conflict-handledFocused-border: rgba(193, 193, 193, 0.8);
|
||||||
|
--vscode-mergeEditor-conflict-handled-minimapOverViewRuler: rgba(173, 172, 168, 0.93);
|
||||||
|
--vscode-mergeEditor-conflict-unhandled-minimapOverViewRuler: #fcba03;
|
||||||
|
--vscode-mergeEditor-conflictingLines-background: rgba(255, 234, 0, 0.28);
|
||||||
|
--vscode-mergeEditor-conflict-input1-background: rgba(64, 200, 174, 0.2);
|
||||||
|
--vscode-mergeEditor-conflict-input2-background: rgba(64, 166, 255, 0.2);
|
||||||
|
--vscode-settings-headerForeground: #ffffff;
|
||||||
|
--vscode-settings-settingsHeaderHoverForeground: rgba(255, 255, 255, 0.7);
|
||||||
|
--vscode-settings-modifiedItemIndicator: #0c7d9d;
|
||||||
|
--vscode-settings-headerBorder: #3e4452;
|
||||||
|
--vscode-settings-sashBorder: #3e4452;
|
||||||
|
--vscode-settings-dropdownBackground: #21252b;
|
||||||
|
--vscode-settings-dropdownForeground: #f0f0f0;
|
||||||
|
--vscode-settings-dropdownBorder: #21252b;
|
||||||
|
--vscode-settings-dropdownListBorder: #454545;
|
||||||
|
--vscode-settings-checkboxBackground: #21252b;
|
||||||
|
--vscode-settings-checkboxForeground: #f0f0f0;
|
||||||
|
--vscode-settings-checkboxBorder: #404754;
|
||||||
|
--vscode-settings-textInputBackground: #1d1f23;
|
||||||
|
--vscode-settings-textInputForeground: #abb2bf;
|
||||||
|
--vscode-settings-numberInputBackground: #1d1f23;
|
||||||
|
--vscode-settings-numberInputForeground: #abb2bf;
|
||||||
|
--vscode-settings-focusedRowBackground: #282c34;
|
||||||
|
--vscode-settings-rowHoverBackground: rgba(44, 49, 58, 0.3);
|
||||||
|
--vscode-settings-focusedRowBorder: #3e4452;
|
||||||
|
--vscode-terminal-background: #282c34;
|
||||||
|
--vscode-terminal-foreground: #abb2bf;
|
||||||
|
--vscode-terminal-selectionBackground: rgba(171, 178, 191, 0.19);
|
||||||
|
--vscode-terminal-inactiveSelectionBackground: rgba(171, 178, 191, 0.09);
|
||||||
|
--vscode-terminalCommandDecoration-defaultBackground: rgba(255, 255, 255, 0.25);
|
||||||
|
--vscode-terminalCommandDecoration-successBackground: #1b81a8;
|
||||||
|
--vscode-terminalCommandDecoration-errorBackground: #f14c4c;
|
||||||
|
--vscode-terminalOverviewRuler-cursorForeground: rgba(160, 160, 160, 0.8);
|
||||||
|
--vscode-terminal-border: #3e4452;
|
||||||
|
--vscode-terminal-findMatchBackground: #42557b;
|
||||||
|
--vscode-terminal-hoverHighlightBackground: rgba(38, 79, 120, 0.13);
|
||||||
|
--vscode-terminal-findMatchHighlightBackground: rgba(97, 153, 255, 0.18);
|
||||||
|
--vscode-terminalOverviewRuler-findMatchForeground: rgba(209, 134, 22, 0.49);
|
||||||
|
--vscode-terminal-dropBackground: rgba(83, 89, 93, 0.5);
|
||||||
|
--vscode-terminal-tab-activeBorder: #b4b4b4;
|
||||||
|
--vscode-terminalStickyScrollHover-background: #2a2d2e;
|
||||||
|
--vscode-testing-iconFailed: #f14c4c;
|
||||||
|
--vscode-testing-iconErrored: #f14c4c;
|
||||||
|
--vscode-testing-iconPassed: #73c991;
|
||||||
|
--vscode-testing-runAction: #73c991;
|
||||||
|
--vscode-testing-iconQueued: #cca700;
|
||||||
|
--vscode-testing-iconUnset: #848484;
|
||||||
|
--vscode-testing-iconSkipped: #848484;
|
||||||
|
--vscode-testing-peekBorder: #c24038;
|
||||||
|
--vscode-testing-peekHeaderBackground: rgba(194, 64, 56, 0.1);
|
||||||
|
--vscode-testing-message-error-decorationForeground: #c24038;
|
||||||
|
--vscode-testing-message-error-lineBackground: rgba(255, 0, 0, 0.2);
|
||||||
|
--vscode-testing-message-info-decorationForeground: rgba(171, 178, 191, 0.5);
|
||||||
|
--vscode-welcomePage-tileBackground: #21252b;
|
||||||
|
--vscode-welcomePage-tileHoverBackground: #282c34;
|
||||||
|
--vscode-welcomePage-tileBorder: rgba(255, 255, 255, 0.1);
|
||||||
|
--vscode-welcomePage-progress-background: #1d1f23;
|
||||||
|
--vscode-welcomePage-progress-foreground: #61afef;
|
||||||
|
--vscode-walkthrough-stepTitle-foreground: #ffffff;
|
||||||
|
--vscode-walkThrough-embeddedEditorBackground: #2e3440;
|
||||||
|
--vscode-inlineChat-background: #21252b;
|
||||||
|
--vscode-inlineChat-border: #454545;
|
||||||
|
--vscode-inlineChat-shadow: rgba(0, 0, 0, 0.36);
|
||||||
|
--vscode-inlineChat-regionHighlight: rgba(38, 79, 120, 0.25);
|
||||||
|
--vscode-inlineChatInput-border: #454545;
|
||||||
|
--vscode-inlineChatInput-focusBorder: #3e4452;
|
||||||
|
--vscode-inlineChatInput-placeholderForeground: rgba(204, 204, 204, 0.5);
|
||||||
|
--vscode-inlineChatInput-background: #1d1f23;
|
||||||
|
--vscode-inlineChatDiff-inserted: rgba(0, 128, 155, 0.1);
|
||||||
|
--vscode-inlineChatDiff-removed: rgba(255, 0, 0, 0.1);
|
||||||
|
--vscode-debugExceptionWidget-border: #a31515;
|
||||||
|
--vscode-debugExceptionWidget-background: #420b0d;
|
||||||
|
--vscode-ports-iconRunningProcessForeground: #4d78cc;
|
||||||
|
--vscode-statusBar-debuggingBackground: #cc6633;
|
||||||
|
--vscode-statusBar-debuggingForeground: #ffffff;
|
||||||
|
--vscode-statusBar-debuggingBorder: rgba(255, 0, 0, 0);
|
||||||
|
--vscode-commandCenter-debuggingBackground: rgba(204, 102, 51, 0.26);
|
||||||
|
--vscode-editor-inlineValuesForeground: rgba(255, 255, 255, 0.5);
|
||||||
|
--vscode-editor-inlineValuesBackground: rgba(255, 200, 0, 0.2);
|
||||||
|
--vscode-editorGutter-modifiedBackground: #948b60;
|
||||||
|
--vscode-editorGutter-addedBackground: #109868;
|
||||||
|
--vscode-editorGutter-deletedBackground: #9a353d;
|
||||||
|
--vscode-minimapGutter-modifiedBackground: #948b60;
|
||||||
|
--vscode-minimapGutter-addedBackground: #109868;
|
||||||
|
--vscode-minimapGutter-deletedBackground: #9a353d;
|
||||||
|
--vscode-editorOverviewRuler-modifiedForeground: rgba(148, 139, 96, 0.6);
|
||||||
|
--vscode-editorOverviewRuler-addedForeground: rgba(16, 152, 104, 0.6);
|
||||||
|
--vscode-editorOverviewRuler-deletedForeground: rgba(154, 53, 61, 0.6);
|
||||||
|
--vscode-debugIcon-breakpointForeground: #e51400;
|
||||||
|
--vscode-debugIcon-breakpointDisabledForeground: #848484;
|
||||||
|
--vscode-debugIcon-breakpointUnverifiedForeground: #848484;
|
||||||
|
--vscode-debugIcon-breakpointCurrentStackframeForeground: #ffcc00;
|
||||||
|
--vscode-debugIcon-breakpointStackframeForeground: #89d185;
|
||||||
|
--vscode-keybindingTable-headerBackground: rgba(204, 204, 204, 0.04);
|
||||||
|
--vscode-keybindingTable-rowsBackground: rgba(204, 204, 204, 0.04);
|
||||||
|
--vscode-debugTokenExpression-name: #c586c0;
|
||||||
|
--vscode-debugTokenExpression-value: rgba(204, 204, 204, 0.6);
|
||||||
|
--vscode-debugTokenExpression-string: #ce9178;
|
||||||
|
--vscode-debugTokenExpression-boolean: #4e94ce;
|
||||||
|
--vscode-debugTokenExpression-number: #b5cea8;
|
||||||
|
--vscode-debugTokenExpression-error: #f48771;
|
||||||
|
--vscode-debugView-exceptionLabelForeground: #cccccc;
|
||||||
|
--vscode-debugView-exceptionLabelBackground: #6c2022;
|
||||||
|
--vscode-debugView-stateLabelForeground: #cccccc;
|
||||||
|
--vscode-debugView-stateLabelBackground: rgba(136, 136, 136, 0.27);
|
||||||
|
--vscode-debugView-valueChangedHighlight: #569cd6;
|
||||||
|
--vscode-debugConsole-infoForeground: #3794ff;
|
||||||
|
--vscode-debugConsole-warningForeground: #d19a66;
|
||||||
|
--vscode-debugConsole-errorForeground: #f48771;
|
||||||
|
--vscode-debugConsole-sourceForeground: #cccccc;
|
||||||
|
--vscode-debugConsoleInputIcon-foreground: #cccccc;
|
||||||
|
--vscode-debugIcon-pauseForeground: #75beff;
|
||||||
|
--vscode-debugIcon-stopForeground: #f48771;
|
||||||
|
--vscode-debugIcon-disconnectForeground: #f48771;
|
||||||
|
--vscode-debugIcon-restartForeground: #89d185;
|
||||||
|
--vscode-debugIcon-stepOverForeground: #75beff;
|
||||||
|
--vscode-debugIcon-stepIntoForeground: #75beff;
|
||||||
|
--vscode-debugIcon-stepOutForeground: #75beff;
|
||||||
|
--vscode-debugIcon-continueForeground: #75beff;
|
||||||
|
--vscode-debugIcon-stepBackForeground: #75beff;
|
||||||
|
--vscode-notebook-cellBorderColor: #323842;
|
||||||
|
--vscode-notebook-focusedEditorBorder: #3e4452;
|
||||||
|
--vscode-notebookStatusSuccessIcon-foreground: #89d185;
|
||||||
|
--vscode-notebookEditorOverviewRuler-runningCellForeground: #89d185;
|
||||||
|
--vscode-notebookStatusErrorIcon-foreground: #f48771;
|
||||||
|
--vscode-notebookStatusRunningIcon-foreground: #cccccc;
|
||||||
|
--vscode-notebook-cellToolbarSeparator: rgba(128, 128, 128, 0.35);
|
||||||
|
--vscode-notebook-selectedCellBackground: #323842;
|
||||||
|
--vscode-notebook-selectedCellBorder: #323842;
|
||||||
|
--vscode-notebook-focusedCellBorder: #3e4452;
|
||||||
|
--vscode-notebook-inactiveFocusedCellBorder: #323842;
|
||||||
|
--vscode-notebook-cellStatusBarItemHoverBackground: rgba(255, 255, 255, 0.15);
|
||||||
|
--vscode-notebook-cellInsertionIndicator: #3e4452;
|
||||||
|
--vscode-notebookScrollbarSlider-background: rgba(78, 86, 102, 0.38);
|
||||||
|
--vscode-notebookScrollbarSlider-hoverBackground: rgba(90, 99, 117, 0.5);
|
||||||
|
--vscode-notebookScrollbarSlider-activeBackground: rgba(116, 125, 145, 0.5);
|
||||||
|
--vscode-notebook-symbolHighlightBackground: rgba(255, 255, 255, 0.04);
|
||||||
|
--vscode-notebook-cellEditorBackground: #21252b;
|
||||||
|
--vscode-notebook-editorBackground: #282c34;
|
||||||
|
--vscode-scm-historyItemAdditionsForeground: #81b88b;
|
||||||
|
--vscode-scm-historyItemDeletionsForeground: #c74e39;
|
||||||
|
--vscode-scm-historyItemStatisticsBorder: rgba(204, 204, 204, 0.2);
|
||||||
|
--vscode-scm-historyItemSelectedStatisticsBorder: rgba(215, 218, 224, 0.2);
|
||||||
|
--vscode-extensionButton-background: #404754;
|
||||||
|
--vscode-extensionButton-foreground: #ffffff;
|
||||||
|
--vscode-extensionButton-hoverBackground: #4d5565;
|
||||||
|
--vscode-extensionButton-separator: rgba(255, 255, 255, 0.4);
|
||||||
|
--vscode-extensionButton-prominentBackground: #404754;
|
||||||
|
--vscode-extensionButton-prominentForeground: #ffffff;
|
||||||
|
--vscode-extensionButton-prominentHoverBackground: #4d5565;
|
||||||
|
--vscode-extensionIcon-starForeground: #ff8e00;
|
||||||
|
--vscode-extensionIcon-verifiedForeground: #61afef;
|
||||||
|
--vscode-extensionIcon-preReleaseForeground: #1d9271;
|
||||||
|
--vscode-extensionIcon-sponsorForeground: #d758b3;
|
||||||
|
--vscode-terminal-ansiBlack: #3f4451;
|
||||||
|
--vscode-terminal-ansiRed: #e05561;
|
||||||
|
--vscode-terminal-ansiGreen: #8cc265;
|
||||||
|
--vscode-terminal-ansiYellow: #d18f52;
|
||||||
|
--vscode-terminal-ansiBlue: #4aa5f0;
|
||||||
|
--vscode-terminal-ansiMagenta: #c162de;
|
||||||
|
--vscode-terminal-ansiCyan: #42b3c2;
|
||||||
|
--vscode-terminal-ansiWhite: #d7dae0;
|
||||||
|
--vscode-terminal-ansiBrightBlack: #4f5666;
|
||||||
|
--vscode-terminal-ansiBrightRed: #ff616e;
|
||||||
|
--vscode-terminal-ansiBrightGreen: #a5e075;
|
||||||
|
--vscode-terminal-ansiBrightYellow: #f0a45d;
|
||||||
|
--vscode-terminal-ansiBrightBlue: #4dc4ff;
|
||||||
|
--vscode-terminal-ansiBrightMagenta: #de73ff;
|
||||||
|
--vscode-terminal-ansiBrightCyan: #4cd1e0;
|
||||||
|
--vscode-terminal-ansiBrightWhite: #e6e6e6;
|
||||||
|
--vscode-interactive-activeCodeBorder: #3794ff;
|
||||||
|
--vscode-interactive-inactiveCodeBorder: #323842;
|
||||||
|
--vscode-gitDecoration-addedResourceForeground: #81b88b;
|
||||||
|
--vscode-gitDecoration-modifiedResourceForeground: #e2c08d;
|
||||||
|
--vscode-gitDecoration-deletedResourceForeground: #c74e39;
|
||||||
|
--vscode-gitDecoration-renamedResourceForeground: #73c991;
|
||||||
|
--vscode-gitDecoration-untrackedResourceForeground: #73c991;
|
||||||
|
--vscode-gitDecoration-ignoredResourceForeground: #636b78;
|
||||||
|
--vscode-gitDecoration-stageModifiedResourceForeground: #e2c08d;
|
||||||
|
--vscode-gitDecoration-stageDeletedResourceForeground: #c74e39;
|
||||||
|
--vscode-gitDecoration-conflictingResourceForeground: #e4676b;
|
||||||
|
--vscode-gitDecoration-submoduleResourceForeground: #8db9e2;
|
||||||
|
--vscode-gitlens-gutterBackgroundColor: rgba(255, 255, 255, 0.07);
|
||||||
|
--vscode-gitlens-gutterForegroundColor: #bebebe;
|
||||||
|
--vscode-gitlens-gutterUncommittedForegroundColor: rgba(0, 188, 242, 0.6);
|
||||||
|
--vscode-gitlens-trailingLineBackgroundColor: rgba(0, 0, 0, 0);
|
||||||
|
--vscode-gitlens-trailingLineForegroundColor: rgba(153, 153, 153, 0.35);
|
||||||
|
--vscode-gitlens-lineHighlightBackgroundColor: rgba(0, 188, 242, 0.2);
|
||||||
|
--vscode-gitlens-lineHighlightOverviewRulerColor: rgba(0, 188, 242, 0.6);
|
||||||
|
--vscode-gitlens-openAutolinkedIssueIconColor: #3fb950;
|
||||||
|
--vscode-gitlens-closedAutolinkedIssueIconColor: #a371f7;
|
||||||
|
--vscode-gitlens-closedPullRequestIconColor: #f85149;
|
||||||
|
--vscode-gitlens-openPullRequestIconColor: #3fb950;
|
||||||
|
--vscode-gitlens-mergedPullRequestIconColor: #a371f7;
|
||||||
|
--vscode-gitlens-unpublishedChangesIconColor: #35b15e;
|
||||||
|
--vscode-gitlens-unpublishedCommitIconColor: #35b15e;
|
||||||
|
--vscode-gitlens-unpulledChangesIconColor: #b15e35;
|
||||||
|
--vscode-gitlens-decorations-addedForegroundColor: #81b88b;
|
||||||
|
--vscode-gitlens-decorations-copiedForegroundColor: #73c991;
|
||||||
|
--vscode-gitlens-decorations-deletedForegroundColor: #c74e39;
|
||||||
|
--vscode-gitlens-decorations-ignoredForegroundColor: #636b78;
|
||||||
|
--vscode-gitlens-decorations-modifiedForegroundColor: #e2c08d;
|
||||||
|
--vscode-gitlens-decorations-untrackedForegroundColor: #73c991;
|
||||||
|
--vscode-gitlens-decorations-renamedForegroundColor: #73c991;
|
||||||
|
--vscode-gitlens-decorations-branchAheadForegroundColor: #35b15e;
|
||||||
|
--vscode-gitlens-decorations-branchBehindForegroundColor: #b15e35;
|
||||||
|
--vscode-gitlens-decorations-branchDivergedForegroundColor: #d8af1b;
|
||||||
|
--vscode-gitlens-decorations-branchUpToDateForegroundColor: #abb2bf;
|
||||||
|
--vscode-gitlens-decorations-branchUnpublishedForegroundColor: #35b15e;
|
||||||
|
--vscode-gitlens-decorations-branchMissingUpstreamForegroundColor: #c74e39;
|
||||||
|
--vscode-gitlens-decorations-statusMergingOrRebasingConflictForegroundColor: #c74e39;
|
||||||
|
--vscode-gitlens-decorations-statusMergingOrRebasingForegroundColor: #d8af1b;
|
||||||
|
--vscode-gitlens-decorations-workspaceRepoMissingForegroundColor: #909090;
|
||||||
|
--vscode-gitlens-decorations-workspaceCurrentForegroundColor: #35b15e;
|
||||||
|
--vscode-gitlens-decorations-workspaceRepoOpenForegroundColor: #35b15e;
|
||||||
|
--vscode-gitlens-decorations-worktreeHasUncommittedChangesForegroundColor: #e2c08d;
|
||||||
|
--vscode-gitlens-decorations-worktreeMissingForegroundColor: #c74e39;
|
||||||
|
--vscode-gitlens-graphLane1Color: #15a0bf;
|
||||||
|
--vscode-gitlens-graphLane2Color: #0669f7;
|
||||||
|
--vscode-gitlens-graphLane3Color: #8e00c2;
|
||||||
|
--vscode-gitlens-graphLane4Color: #c517b6;
|
||||||
|
--vscode-gitlens-graphLane5Color: #d90171;
|
||||||
|
--vscode-gitlens-graphLane6Color: #cd0101;
|
||||||
|
--vscode-gitlens-graphLane7Color: #f25d2e;
|
||||||
|
--vscode-gitlens-graphLane8Color: #f2ca33;
|
||||||
|
--vscode-gitlens-graphLane9Color: #7bd938;
|
||||||
|
--vscode-gitlens-graphLane10Color: #2ece9d;
|
||||||
|
--vscode-gitlens-graphChangesColumnAddedColor: #347d39;
|
||||||
|
--vscode-gitlens-graphChangesColumnDeletedColor: #c93c37;
|
||||||
|
--vscode-gitlens-graphMinimapMarkerHeadColor: #05e617;
|
||||||
|
--vscode-gitlens-graphScrollMarkerHeadColor: #05e617;
|
||||||
|
--vscode-gitlens-graphMinimapMarkerUpstreamColor: #09ae17;
|
||||||
|
--vscode-gitlens-graphScrollMarkerUpstreamColor: #09ae17;
|
||||||
|
--vscode-gitlens-graphMinimapMarkerHighlightsColor: #fbff0a;
|
||||||
|
--vscode-gitlens-graphScrollMarkerHighlightsColor: #fbff0a;
|
||||||
|
--vscode-gitlens-graphMinimapMarkerLocalBranchesColor: #3087cf;
|
||||||
|
--vscode-gitlens-graphScrollMarkerLocalBranchesColor: #3087cf;
|
||||||
|
--vscode-gitlens-graphMinimapMarkerRemoteBranchesColor: #2b5e88;
|
||||||
|
--vscode-gitlens-graphScrollMarkerRemoteBranchesColor: #2b5e88;
|
||||||
|
--vscode-gitlens-graphMinimapMarkerStashesColor: #b34db3;
|
||||||
|
--vscode-gitlens-graphScrollMarkerStashesColor: #b34db3;
|
||||||
|
--vscode-gitlens-graphMinimapMarkerTagsColor: #6b562e;
|
||||||
|
--vscode-gitlens-graphScrollMarkerTagsColor: #6b562e;
|
||||||
|
}
|
||||||
@ -5,15 +5,15 @@ html, body {
|
|||||||
|
|
||||||
.vcd-sidebar {
|
.vcd-sidebar {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 10px;
|
top: 20px;
|
||||||
left: 10px;
|
left: 0px;
|
||||||
background-color: var(--sidebar);
|
background-color: var(--sidebar);
|
||||||
border: solid 1px var(--sidebar-border);
|
border: solid 1px var(--sidebar-border);
|
||||||
min-width: var(--sidebar-min-width);
|
min-width: var(--sidebar-min-width);
|
||||||
}
|
}
|
||||||
|
|
||||||
.vcd-sidebar-item {
|
.vcd-sidebar-item {
|
||||||
|
color: var(--sidebar-item-text);
|
||||||
}
|
}
|
||||||
|
|
||||||
.vcd-toolbar {
|
.vcd-toolbar {
|
||||||
@ -25,5 +25,50 @@ html, body {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.vcd-treeview {
|
.vcd-treeview {
|
||||||
|
position: absolute;
|
||||||
|
bottom: 0;
|
||||||
|
left: 10px;
|
||||||
|
height: 500px;
|
||||||
|
background-color: var(--sidebar);
|
||||||
|
padding: 10px;
|
||||||
|
height: fit-content;
|
||||||
|
display: flex;
|
||||||
|
box-shadow: 0 0 15px 1px rgb(16, 16, 16);
|
||||||
|
border-radius: 1.0em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.vcd-signal-info {
|
||||||
|
height: 500px;
|
||||||
|
width: 300px;
|
||||||
|
padding-right: 5px;
|
||||||
|
overflow-x: scroll;
|
||||||
|
}
|
||||||
|
|
||||||
|
.vcd-signal-wires {
|
||||||
|
height: 500px;
|
||||||
|
width: 300px;
|
||||||
|
overflow-x: scroll;
|
||||||
|
}
|
||||||
|
|
||||||
|
::-webkit-scrollbar {
|
||||||
|
width: 15px;
|
||||||
|
}
|
||||||
|
|
||||||
|
::-webkit-scrollbar-track {
|
||||||
|
background: var(--sidebar);
|
||||||
|
}
|
||||||
|
|
||||||
|
::-webkit-scrollbar-thumb {
|
||||||
|
background: #3D4450;
|
||||||
|
border-radius: .3em;
|
||||||
|
}
|
||||||
|
|
||||||
|
::-webkit-scrollbar-button {
|
||||||
|
height: 0;
|
||||||
|
width: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
::-webkit-scrollbar-corner {
|
||||||
|
background: none;
|
||||||
|
display: none;
|
||||||
}
|
}
|
||||||
@ -144,6 +144,8 @@
|
|||||||
--color-orange: #ffab40;
|
--color-orange: #ffab40;
|
||||||
--color-deepOrange: #ff6e40;
|
--color-deepOrange: #ff6e40;
|
||||||
|
|
||||||
|
--main-color: #CB81DA;
|
||||||
|
|
||||||
/* Settings */
|
/* Settings */
|
||||||
--settings-action-background: var(--background);
|
--settings-action-background: var(--background);
|
||||||
}
|
}
|
||||||
63
src/App.vue
63
src/App.vue
@ -16,31 +16,64 @@
|
|||||||
</div>
|
</div>
|
||||||
<!-- 显示当前信号树形关系 -->
|
<!-- 显示当前信号树形关系 -->
|
||||||
<div class="vcd-treeview">
|
<div class="vcd-treeview">
|
||||||
|
<div class="vcd-signal-info">
|
||||||
|
<Signals v-for="mod of VcdInfo.topModules"
|
||||||
|
:key="mod.name"
|
||||||
|
:signal="mod"
|
||||||
|
></Signals>
|
||||||
|
</div>
|
||||||
|
<div class="vcd-signal-wires">
|
||||||
|
<Wires></Wires>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup>
|
<script>
|
||||||
import { onMounted, reactive } from 'vue';
|
import { onMounted, reactive } from 'vue';
|
||||||
import { getVcdStream, readVcdFile } from '@/hook/utils';
|
import { getVcdStream, readVcdFile } from '@/hook/utils';
|
||||||
|
import { emitter } from '@/hook/event';
|
||||||
|
|
||||||
const VcdInfo = reactive({
|
import Signals from '@/components/signals.vue';
|
||||||
structures: {},
|
import Wires from '@/components/wires.vue';
|
||||||
|
|
||||||
|
export default {
|
||||||
|
components: {
|
||||||
|
Signals,
|
||||||
|
Wires
|
||||||
|
},
|
||||||
|
setup() {
|
||||||
|
|
||||||
|
const VcdInfo = reactive({
|
||||||
|
topModules: [],
|
||||||
values: []
|
values: []
|
||||||
});
|
});
|
||||||
|
|
||||||
onMounted(async () => {
|
onMounted(async () => {
|
||||||
// const uint8array = await readVcdFile();
|
const uint8array = await readVcdFile();
|
||||||
// const vcdstream = await getVcdStream();
|
const vcdstream = await getVcdStream();
|
||||||
// const maxChunkLength = 1 << 17;
|
const maxChunkLength = 1 << 17;
|
||||||
// for (let i = 0; i < uint8array.length; i += maxChunkLength) {
|
for (let i = 0; i < uint8array.length; i += maxChunkLength) {
|
||||||
// const piece = uint8array.slice(i, i + maxChunkLength);
|
const piece = uint8array.slice(i, i + maxChunkLength);
|
||||||
// vcdstream.write(piece);
|
vcdstream.write(piece);
|
||||||
// }
|
}
|
||||||
// console.log(vcdstream.info);
|
for (const topModule of vcdstream.info.wires.body) {
|
||||||
});
|
VcdInfo.topModules.push(topModule);
|
||||||
|
}
|
||||||
|
|
||||||
|
// send wires of first module
|
||||||
|
if (VcdInfo.topModules.length > 0) {
|
||||||
|
const defaultMod = VcdInfo.topModules[0];
|
||||||
|
const wires = defaultMod.body.filter(mod => mod.link);
|
||||||
|
emitter.emit('tree-view', wires);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
return {
|
||||||
|
VcdInfo
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
|
|||||||
7
src/assets/images/chip.svg
Normal file
7
src/assets/images/chip.svg
Normal file
@ -0,0 +1,7 @@
|
|||||||
|
<?xml version="1.0" standalone="no"?>
|
||||||
|
<svg class="icon" viewBox="0 0 1024 1024" version="1.1"
|
||||||
|
xmlns="http://www.w3.org/2000/svg" width="200" height="200">
|
||||||
|
<path
|
||||||
|
d="M785.51004562 785.51004562H238.43817245V238.43817245h547.07187317m218.82875024 218.82874902V347.85254756h-109.41437511V238.43817245c0-60.7397357-49.19245392-109.41437511-109.41437513-109.41437513h-109.41437391V19.60942341h-109.41437512v109.41437391h-109.41437512V19.60942341H347.85254756v109.41437391H238.43817245c-60.7397357 0-109.41437511 48.67463941-109.41437513 109.41437513V347.85254756H19.60942341v109.41437391h109.41437391v109.41437512H19.60942341v109.41437512h109.41437391v109.41437391a109.41437511 109.41437511 0 0 0 109.41437513 109.41437513H347.85254756v109.41437511h109.41437391v-109.41437511h109.41437512v109.41437511h109.41437512v-109.41437511h109.41437391a109.41437511 109.41437511 0 0 0 109.41437513-109.41437513v-109.41437391h109.41437511v-109.41437512h-109.41437511v-109.41437512m-328.24312416 109.41437512h-109.41437512v-109.41437512h109.41437512m109.41437512-109.41437391H347.85254756v328.24312415h328.24312415z"
|
||||||
|
fill="#ff7043"></path>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 1.1 KiB |
92
src/components/signals.vue
Normal file
92
src/components/signals.vue
Normal file
@ -0,0 +1,92 @@
|
|||||||
|
<template>
|
||||||
|
<div class="signal">
|
||||||
|
<div v-on:click="clickItem()" class="vcd-treeview-item">
|
||||||
|
<span class="iconfont icon-memory-chip"></span> {{ signal.name }}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div v-if="signal.body" v-show="expanded" class="vcd-subtree-wrapper">
|
||||||
|
<div style="width: 20px;"></div>
|
||||||
|
<div style="width: 100%;">
|
||||||
|
<signals
|
||||||
|
v-for="(child, index) in signal.body"
|
||||||
|
:signal="child"
|
||||||
|
:key="index"
|
||||||
|
></signals>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
/* eslint-disable */
|
||||||
|
import { ref } from 'vue';
|
||||||
|
import { emitter } from '@/hook/event';
|
||||||
|
|
||||||
|
export default {
|
||||||
|
name: "signals",
|
||||||
|
props: {
|
||||||
|
signal: Object
|
||||||
|
},
|
||||||
|
setup(props) {
|
||||||
|
const signal = props.signal;
|
||||||
|
const signalChildern = signal.body;
|
||||||
|
const wires = [];
|
||||||
|
signal.body = [];
|
||||||
|
for (const wire of signalChildern) {
|
||||||
|
if (wire.body) {
|
||||||
|
signal.body.push(wire);
|
||||||
|
} else {
|
||||||
|
wires.push(wire);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
const expanded = ref(true);
|
||||||
|
function clickItem() {
|
||||||
|
emitter.emit('tree-view', wires);
|
||||||
|
if (signal.body === undefined) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
expanded.value = !expanded.value;
|
||||||
|
}
|
||||||
|
|
||||||
|
return {
|
||||||
|
signal,
|
||||||
|
expanded,
|
||||||
|
clickItem
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.icon-memory-chip {
|
||||||
|
color: #FF7043;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.signal {
|
||||||
|
text-align: left;
|
||||||
|
}
|
||||||
|
|
||||||
|
.vcd-subtree-wrapper {
|
||||||
|
display: flex;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.vcd-treeview-item {
|
||||||
|
color: var(--sidebar-item-text);
|
||||||
|
cursor: pointer;
|
||||||
|
height: 27px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.vcd-treeview-item::selection {
|
||||||
|
background: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.vcd-treeview-item:hover {
|
||||||
|
background-color: #3D4450;
|
||||||
|
border-radius: .3em;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
80
src/components/wires.vue
Normal file
80
src/components/wires.vue
Normal file
@ -0,0 +1,80 @@
|
|||||||
|
<template>
|
||||||
|
<div class="vcd-signal-wires-display">
|
||||||
|
<div v-for="(wire, index) in wires.content" :key="index"
|
||||||
|
class="vcd-signal-wire-item">
|
||||||
|
|
||||||
|
<div><span class="iconfont icon-wave-square"></span> {{ wire.name }}</div>
|
||||||
|
<div>
|
||||||
|
<div :class="wire.caption ? 'vcd-signal-wire-caption' : ''">
|
||||||
|
{{ wire.caption }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import { reactive } from 'vue';
|
||||||
|
import { emitter } from '@/hook/event';
|
||||||
|
|
||||||
|
/* eslint-disable */
|
||||||
|
export default {
|
||||||
|
name: 'wires',
|
||||||
|
props: {},
|
||||||
|
setup() {
|
||||||
|
// wire : link, name, size, type
|
||||||
|
const wires = reactive({
|
||||||
|
content: []
|
||||||
|
});
|
||||||
|
|
||||||
|
emitter.on('tree-view', sendWires => {
|
||||||
|
wires.content.length = 0;
|
||||||
|
for (const wire of sendWires) {
|
||||||
|
console.log(wire);
|
||||||
|
const caption = wire.size === 1 ? '' : `${wire.size - 1}:0`;
|
||||||
|
wires.content.push({
|
||||||
|
name: wire.name,
|
||||||
|
caption
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
return {
|
||||||
|
wires
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.icon-wave-square {
|
||||||
|
color: #00F600;
|
||||||
|
}
|
||||||
|
|
||||||
|
.vcd-signal-wires-display {
|
||||||
|
color: var(--sidebar-item-text);
|
||||||
|
padding: 0px 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.vcd-signal-wire-item {
|
||||||
|
margin: 3px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
height: 25px;
|
||||||
|
cursor: pointer;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.vcd-signal-wire-item:hover {
|
||||||
|
background-color: #3D4450;
|
||||||
|
border-radius: .3em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.vcd-signal-wire-caption {
|
||||||
|
color: var(--sidebar-item-text);
|
||||||
|
border-radius: .5em;
|
||||||
|
background-color: var(--color-deepPurple);
|
||||||
|
padding: 3px;
|
||||||
|
font-size: 15px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
6
src/hook/event.js
Normal file
6
src/hook/event.js
Normal file
@ -0,0 +1,6 @@
|
|||||||
|
import mitt from 'mitt';
|
||||||
|
const emitter = mitt();
|
||||||
|
|
||||||
|
export {
|
||||||
|
emitter
|
||||||
|
};
|
||||||
Loading…
x
Reference in New Issue
Block a user