Web-Ide mit aufgenommen
This commit is contained in:
Riwoldt
@@ -0,0 +1,23 @@
|
||||
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
|
||||
|
||||
# dependencies
|
||||
/node_modules
|
||||
/.pnp
|
||||
.pnp.js
|
||||
|
||||
# testing
|
||||
/coverage
|
||||
|
||||
# production
|
||||
/build
|
||||
|
||||
# misc
|
||||
.DS_Store
|
||||
.env.local
|
||||
.env.development.local
|
||||
.env.test.local
|
||||
.env.production.local
|
||||
|
||||
npm-debug.log*
|
||||
yarn-debug.log*
|
||||
yarn-error.log*
|
||||
@@ -0,0 +1,46 @@
|
||||
# Getting Started with Create React App
|
||||
|
||||
This project was bootstrapped with [Create React App](https://github.com/facebook/create-react-app).
|
||||
|
||||
## Available Scripts
|
||||
|
||||
In the project directory, you can run:
|
||||
|
||||
### `npm start`
|
||||
|
||||
Runs the app in the development mode.\
|
||||
Open [http://localhost:3000](http://localhost:3000) to view it in the browser.
|
||||
|
||||
The page will reload if you make edits.\
|
||||
You will also see any lint errors in the console.
|
||||
|
||||
### `npm test`
|
||||
|
||||
Launches the test runner in the interactive watch mode.\
|
||||
See the section about [running tests](https://facebook.github.io/create-react-app/docs/running-tests) for more information.
|
||||
|
||||
### `npm run build`
|
||||
|
||||
Builds the app for production to the `build` folder.\
|
||||
It correctly bundles React in production mode and optimizes the build for the best performance.
|
||||
|
||||
The build is minified and the filenames include the hashes.\
|
||||
Your app is ready to be deployed!
|
||||
|
||||
See the section about [deployment](https://facebook.github.io/create-react-app/docs/deployment) for more information.
|
||||
|
||||
### `npm run eject`
|
||||
|
||||
**Note: this is a one-way operation. Once you `eject`, you can’t go back!**
|
||||
|
||||
If you aren’t satisfied with the build tool and configuration choices, you can `eject` at any time. This command will remove the single build dependency from your project.
|
||||
|
||||
Instead, it will copy all the configuration files and the transitive dependencies (webpack, Babel, ESLint, etc) right into your project so you have full control over them. All of the commands except `eject` will still work, but they will point to the copied scripts so you can tweak them. At this point you’re on your own.
|
||||
|
||||
You don’t have to ever use `eject`. The curated feature set is suitable for small and middle deployments, and you shouldn’t feel obligated to use this feature. However we understand that this tool wouldn’t be useful if you couldn’t customize it when you are ready for it.
|
||||
|
||||
## Learn More
|
||||
|
||||
You can learn more in the [Create React App documentation](https://facebook.github.io/create-react-app/docs/getting-started).
|
||||
|
||||
To learn React, check out the [React documentation](https://reactjs.org/).
|
||||
@@ -0,0 +1,44 @@
|
||||
{
|
||||
"name": "hdl",
|
||||
"version": "0.0.0",
|
||||
"private": true,
|
||||
"dependencies": {
|
||||
"@nand2tetris/components": "0.0.0",
|
||||
"@nand2tetris/simulator": "0.0.0",
|
||||
"gh-pages": "6.1.1",
|
||||
"react": "^18.2.0",
|
||||
"react-dom": "^18.2.0",
|
||||
"rewire": "^6.0.0",
|
||||
"vsce": "^2.15.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@testing-library/jest-dom": "^5.16.5",
|
||||
"@testing-library/react": "^13.4.0",
|
||||
"@testing-library/user-event": "^13.5.0",
|
||||
"@types/jest": "^27.5.2",
|
||||
"@types/node": "^16.11.66",
|
||||
"@types/react": "^18.0.26",
|
||||
"@types/react-dom": "^18.0.10",
|
||||
"@types/vscode-webview": "^1.57.1",
|
||||
"react-scripts": "^5.0.1"
|
||||
},
|
||||
"scripts": {
|
||||
"start": "react-scripts start",
|
||||
"build": "node ./scripts/build-react-no-split.js",
|
||||
"postbuild": "shx cp ./build/styles.css ./build/static/js/main.js ./build/static/js/main.js.map ./build/static/js/main.js.LICENSE.txt ../../out/views/hdl",
|
||||
"test": "react-scripts test",
|
||||
"eject": "react-scripts eject"
|
||||
},
|
||||
"browserslist": {
|
||||
"production": [
|
||||
">0.2%",
|
||||
"not dead",
|
||||
"not op_mini all"
|
||||
],
|
||||
"development": [
|
||||
"last 1 chrome version",
|
||||
"last 1 firefox version",
|
||||
"last 1 safari version"
|
||||
]
|
||||
}
|
||||
}
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 3.8 KiB |
@@ -0,0 +1,45 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<meta name="theme-color" content="#000000" />
|
||||
<meta
|
||||
name="description"
|
||||
content="Web site created using create-react-app"
|
||||
/>
|
||||
<link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
|
||||
<!--
|
||||
manifest.json provides metadata used when your web app is installed on a
|
||||
user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
|
||||
-->
|
||||
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
|
||||
<!--
|
||||
Notice the use of %PUBLIC_URL% in the tags above.
|
||||
It will be replaced with the URL of the `public` folder during the build.
|
||||
Only files inside the `public` folder can be referenced from the HTML.
|
||||
|
||||
Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
|
||||
work correctly both with client-side routing and a non-root public URL.
|
||||
Learn how to configure a non-root public URL by running `npm run build`.
|
||||
-->
|
||||
<title>React App</title>
|
||||
<link rel="stylesheet" href="%PUBLIC_URL%/vars.css"></link>
|
||||
<link rel="stylesheet" href="%PUBLIC_URL%/styles.css"></link>
|
||||
</head>
|
||||
<body>
|
||||
<noscript>You need to enable JavaScript to run this app.</noscript>
|
||||
<div id="root"></div>
|
||||
<!--
|
||||
This HTML file is a template.
|
||||
If you open it directly in the browser, you will see an empty page.
|
||||
|
||||
You can add webfonts, meta tags, or analytics to this file.
|
||||
The build step will place the bundled scripts into the <body> tag.
|
||||
|
||||
To begin the development, run `npm start` or `yarn start`.
|
||||
To create a production bundle, use `npm run build` or `yarn build`.
|
||||
-->
|
||||
</body>
|
||||
</html>
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 5.2 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 9.4 KiB |
@@ -0,0 +1,25 @@
|
||||
{
|
||||
"short_name": "React App",
|
||||
"name": "Create React App Sample",
|
||||
"icons": [
|
||||
{
|
||||
"src": "favicon.ico",
|
||||
"sizes": "64x64 32x32 24x24 16x16",
|
||||
"type": "image/x-icon"
|
||||
},
|
||||
{
|
||||
"src": "logo192.png",
|
||||
"type": "image/png",
|
||||
"sizes": "192x192"
|
||||
},
|
||||
{
|
||||
"src": "logo512.png",
|
||||
"type": "image/png",
|
||||
"sizes": "512x512"
|
||||
}
|
||||
],
|
||||
"start_url": ".",
|
||||
"display": "standalone",
|
||||
"theme_color": "#000000",
|
||||
"background_color": "#ffffff"
|
||||
}
|
||||
@@ -0,0 +1,3 @@
|
||||
# https://www.robotstxt.org/robotstxt.html
|
||||
User-agent: *
|
||||
Disallow:
|
||||
@@ -0,0 +1,63 @@
|
||||
:root {
|
||||
--font-family-monospace: var(--vscode-editor-font-family);
|
||||
}
|
||||
|
||||
button {
|
||||
font-family: var(--vscode-editor-font-family);
|
||||
font-weight: var(--vscode-editor-font-weight);
|
||||
font-size: var(--vscode-editor-font-size);
|
||||
color: var(--vscode-button-foreground);
|
||||
background-color: var(--vscode-button-background);
|
||||
border: 0;
|
||||
padding: 0;
|
||||
width: 1rem;
|
||||
}
|
||||
|
||||
button:hover {
|
||||
background-color: var(--vscode-button-hoverBackground);
|
||||
}
|
||||
|
||||
button[disabled] {
|
||||
opacity: var(--disabled-opacity);
|
||||
background-color: var(--vscode-button-hoverBackground);
|
||||
}
|
||||
|
||||
fieldset[role="group"] {
|
||||
border: 0;
|
||||
padding: 0;
|
||||
display: flex;
|
||||
align-items: baseline;
|
||||
}
|
||||
|
||||
fieldset[role="group"] > label[role="button"] {
|
||||
/* fieldset[role="group"] > label:has(input[type="radio"]) { */
|
||||
color: var(--vscode-button-foreground);
|
||||
background-color: var(--vscode-button-background);
|
||||
align-self: stretch;
|
||||
padding: 2px 1px;
|
||||
}
|
||||
|
||||
fieldset[role="group"] button:first-of-type,
|
||||
fieldset[role="group"] > label[role="button"]:first-of-type {
|
||||
/* fieldset[role="group"] > label:has(input[type="radio"]):first-of-type { */
|
||||
padding-left: 2px;
|
||||
border-top-left-radius: 2px;
|
||||
border-bottom-left-radius: 2px;
|
||||
}
|
||||
|
||||
fieldset[role="group"] button:last-of-type,
|
||||
fieldset[role="group"] > label[role="button"]:last-of-type {
|
||||
/* fieldset[role="group"] > label:has(input[type="radio"]):last-of-type { */
|
||||
padding-right: 2px;
|
||||
border-top-right-radius: 2px;
|
||||
border-bottom-right-radius: 2px;
|
||||
}
|
||||
|
||||
fieldset[role="group"] > label[role="button"][aria-current="true"] {
|
||||
/* fieldset[role="group"] > label[aria-current="true"]:has(input[type="radio"]) { */
|
||||
background-color: var(--vscode-button-hoverBackground);
|
||||
}
|
||||
|
||||
fieldset[role="group"] > label > input[type="radio"] {
|
||||
display: none;
|
||||
}
|
||||
@@ -0,0 +1,591 @@
|
||||
:root {
|
||||
--vscode-font-family: -apple-system, BlinkMacSystemFont, sans-serif;
|
||||
--vscode-font-weight: normal;
|
||||
--vscode-font-size: 13px;
|
||||
--vscode-editor-font-family: "JetBrains Mono", "Consolas Light", "Courier New",
|
||||
monospace;
|
||||
--vscode-editor-font-weight: normal;
|
||||
--vscode-editor-font-size: 16px;
|
||||
|
||||
--vscode-foreground: #cccccc;
|
||||
|
||||
--vscode-button-background: #0e639c;
|
||||
--vscode-button-foreground: #ffffff;
|
||||
--vscode-button-hoverBackground: #1177bb;
|
||||
--vscode-button-separator: rgba(255, 255, 255, 0.4);
|
||||
|
||||
--vscode-charts-blue: #3794ff;
|
||||
--vscode-charts-foreground: #cccccc;
|
||||
--vscode-charts-green: #89d185;
|
||||
--vscode-charts-lines: rgba(204, 204, 204, 0.5);
|
||||
--vscode-charts-orange: #d18616;
|
||||
--vscode-charts-purple: #b180d7;
|
||||
--vscode-charts-red: #f14c4c;
|
||||
--vscode-charts-yellow: #cca700;
|
||||
--vscode-checkbox-background: #3c3c3c;
|
||||
--vscode-checkbox-border: #3c3c3c;
|
||||
--vscode-checkbox-foreground: #f0f0f0;
|
||||
--vscode-commandCenter-activeBackground: rgba(90, 93, 94, 0.31);
|
||||
--vscode-commandCenter-activeForeground: #cccccc;
|
||||
--vscode-commandCenter-border: rgba(128, 128, 128, 0.35);
|
||||
--vscode-commandCenter-foreground: #cccccc;
|
||||
--vscode-debugConsole-errorForeground: #f48771;
|
||||
--vscode-debugConsole-infoForeground: #3794ff;
|
||||
--vscode-debugConsole-sourceForeground: #cccccc;
|
||||
--vscode-debugConsole-warningForeground: #cca700;
|
||||
--vscode-debugConsoleInputIcon-foreground: #cccccc;
|
||||
--vscode-debugExceptionWidget-background: #420b0d;
|
||||
--vscode-debugExceptionWidget-border: #a31515;
|
||||
--vscode-debugIcon-breakpointCurrentStackframeForeground: #ffcc00;
|
||||
--vscode-debugIcon-breakpointDisabledForeground: #848484;
|
||||
--vscode-debugIcon-breakpointForeground: #e51400;
|
||||
--vscode-debugIcon-breakpointStackframeForeground: #89d185;
|
||||
--vscode-debugIcon-breakpointUnverifiedForeground: #848484;
|
||||
--vscode-debugIcon-continueForeground: #75beff;
|
||||
--vscode-debugIcon-disconnectForeground: #f48771;
|
||||
--vscode-debugIcon-pauseForeground: #75beff;
|
||||
--vscode-debugIcon-restartForeground: #89d185;
|
||||
--vscode-debugIcon-startForeground: #89d185;
|
||||
--vscode-debugIcon-stepBackForeground: #75beff;
|
||||
--vscode-debugIcon-stepIntoForeground: #75beff;
|
||||
--vscode-debugIcon-stepOutForeground: #75beff;
|
||||
--vscode-debugIcon-stepOverForeground: #75beff;
|
||||
--vscode-debugIcon-stopForeground: #f48771;
|
||||
--vscode-debugTokenExpression-boolean: #4e94ce;
|
||||
--vscode-debugTokenExpression-error: #f48771;
|
||||
--vscode-debugTokenExpression-name: #c586c0;
|
||||
--vscode-debugTokenExpression-number: #b5cea8;
|
||||
--vscode-debugTokenExpression-string: #ce9178;
|
||||
--vscode-debugTokenExpression-value: rgba(204, 204, 204, 0.6);
|
||||
--vscode-debugToolBar-background: #333333;
|
||||
--vscode-debugView-exceptionLabelBackground: #6c2022;
|
||||
--vscode-debugView-exceptionLabelForeground: #cccccc;
|
||||
--vscode-debugView-stateLabelBackground: rgba(136, 136, 136, 0.27);
|
||||
--vscode-debugView-stateLabelForeground: #cccccc;
|
||||
--vscode-debugView-valueChangedHighlight: #569cd6;
|
||||
--vscode-descriptionForeground: rgba(204, 204, 204, 0.7);
|
||||
--vscode-diffEditor-diagonalFill: rgba(204, 204, 204, 0.2);
|
||||
--vscode-diffEditor-insertedLineBackground: rgba(155, 185, 85, 0.2);
|
||||
--vscode-diffEditor-insertedTextBackground: rgba(156, 204, 44, 0.2);
|
||||
--vscode-diffEditor-removedLineBackground: rgba(255, 0, 0, 0.2);
|
||||
--vscode-diffEditor-removedTextBackground: rgba(255, 0, 0, 0.2);
|
||||
--vscode-disabledForeground: rgba(204, 204, 204, 0.5);
|
||||
--vscode-dropdown-background: #3c3c3c;
|
||||
--vscode-dropdown-border: #3c3c3c;
|
||||
--vscode-dropdown-foreground: #f0f0f0;
|
||||
--vscode-editor-background: #1e1e1e;
|
||||
--vscode-editor-findMatchBackground: #515c6a;
|
||||
--vscode-editor-findMatchHighlightBackground: rgba(234, 92, 0, 0.33);
|
||||
--vscode-editor-findRangeHighlightBackground: rgba(58, 61, 65, 0.4);
|
||||
--vscode-editor-focusedStackFrameHighlightBackground: rgba(
|
||||
122,
|
||||
189,
|
||||
122,
|
||||
0.3
|
||||
);
|
||||
--vscode-editor-foldBackground: rgba(38, 79, 120, 0.3);
|
||||
--vscode-editor-foreground: #d4d4d4;
|
||||
--vscode-editor-hoverHighlightBackground: rgba(38, 79, 120, 0.25);
|
||||
--vscode-editor-inactiveSelectionBackground: #3a3d41;
|
||||
--vscode-editor-inlineValuesBackground: rgba(255, 200, 0, 0.2);
|
||||
--vscode-editor-inlineValuesForeground: rgba(255, 255, 255, 0.5);
|
||||
--vscode-editor-lineHighlightBorder: #282828;
|
||||
--vscode-editor-linkedEditingBackground: rgba(255, 0, 0, 0.3);
|
||||
--vscode-editor-rangeHighlightBackground: rgba(255, 255, 255, 0.04);
|
||||
--vscode-editor-selectionBackground: #264f78;
|
||||
--vscode-editor-selectionHighlightBackground: rgba(173, 214, 255, 0.15);
|
||||
--vscode-editor-snippetFinalTabstopHighlightBorder: #525252;
|
||||
--vscode-editor-snippetTabstopHighlightBackground: rgba(124, 124, 124, 0.3);
|
||||
--vscode-editor-stackFrameHighlightBackground: rgba(255, 255, 0, 0.2);
|
||||
--vscode-editor-symbolHighlightBackground: rgba(234, 92, 0, 0.33);
|
||||
--vscode-editor-wordHighlightBackground: rgba(87, 87, 87, 0.72);
|
||||
--vscode-editor-wordHighlightStrongBackground: rgba(0, 73, 114, 0.72);
|
||||
--vscode-editorActiveLineNumber-foreground: #c6c6c6;
|
||||
--vscode-editorBracketHighlight-foreground1: #ffd700;
|
||||
--vscode-editorBracketHighlight-foreground2: #da70d6;
|
||||
--vscode-editorBracketHighlight-foreground3: #179fff;
|
||||
--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-editorBracketMatch-background: rgba(0, 100, 0, 0.1);
|
||||
--vscode-editorBracketMatch-border: #888888;
|
||||
--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-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-editorCodeLens-foreground: #999999;
|
||||
--vscode-editorCommentsWidget-rangeActiveBackground: rgba(55, 148, 255, 0.1);
|
||||
--vscode-editorCommentsWidget-rangeActiveBorder: rgba(55, 148, 255, 0.4);
|
||||
--vscode-editorCommentsWidget-rangeBackground: rgba(55, 148, 255, 0.1);
|
||||
--vscode-editorCommentsWidget-rangeBorder: rgba(55, 148, 255, 0.4);
|
||||
--vscode-editorCommentsWidget-resolvedBorder: rgba(204, 204, 204, 0.5);
|
||||
--vscode-editorCommentsWidget-unresolvedBorder: #3794ff;
|
||||
--vscode-editorCursor-foreground: #aeafad;
|
||||
--vscode-editorError-foreground: #f14c4c;
|
||||
--vscode-editorGhostText-foreground: rgba(255, 255, 255, 0.34);
|
||||
--vscode-editorGroup-border: #444444;
|
||||
--vscode-editorGroup-dropBackground: rgba(83, 89, 93, 0.5);
|
||||
--vscode-editorGroup-dropIntoPromptBackground: #252526;
|
||||
--vscode-editorGroup-dropIntoPromptForeground: #cccccc;
|
||||
--vscode-editorGroupHeader-noTabsBackground: #1e1e1e;
|
||||
--vscode-editorGroupHeader-tabsBackground: #252526;
|
||||
--vscode-editorGutter-addedBackground: #487e02;
|
||||
--vscode-editorGutter-background: #1e1e1e;
|
||||
--vscode-editorGutter-commentRangeForeground: #37373d;
|
||||
--vscode-editorGutter-deletedBackground: #f14c4c;
|
||||
--vscode-editorGutter-foldingControlForeground: #c5c5c5;
|
||||
--vscode-editorGutter-modifiedBackground: #1b81a8;
|
||||
--vscode-editorHint-foreground: rgba(238, 238, 238, 0.7);
|
||||
--vscode-editorHoverWidget-background: #252526;
|
||||
--vscode-editorHoverWidget-border: #454545;
|
||||
--vscode-editorHoverWidget-foreground: #cccccc;
|
||||
--vscode-editorHoverWidget-highlightForeground: #2aaaff;
|
||||
--vscode-editorHoverWidget-statusBarBackground: #2c2c2d;
|
||||
--vscode-editorIndentGuide-activeBackground: #707070;
|
||||
--vscode-editorIndentGuide-background: #404040;
|
||||
--vscode-editorInfo-foreground: #3794ff;
|
||||
--vscode-editorInlayHint-background: rgba(77, 77, 77, 0.8);
|
||||
--vscode-editorInlayHint-foreground: #ffffff;
|
||||
--vscode-editorInlayHint-parameterBackground: rgba(77, 77, 77, 0.8);
|
||||
--vscode-editorInlayHint-parameterForeground: #ffffff;
|
||||
--vscode-editorInlayHint-typeBackground: rgba(77, 77, 77, 0.8);
|
||||
--vscode-editorInlayHint-typeForeground: #ffffff;
|
||||
--vscode-editorLightBulb-foreground: #ffcc00;
|
||||
--vscode-editorLightBulbAutoFix-foreground: #75beff;
|
||||
--vscode-editorLineNumber-activeForeground: #c6c6c6;
|
||||
--vscode-editorLineNumber-foreground: #858585;
|
||||
--vscode-editorLink-activeForeground: #4e94ce;
|
||||
--vscode-editorMarkerNavigation-background: #1e1e1e;
|
||||
--vscode-editorMarkerNavigationError-background: #f14c4c;
|
||||
--vscode-editorMarkerNavigationInfo-background: #3794ff;
|
||||
--vscode-editorMarkerNavigationWarning-background: #cca700;
|
||||
--vscode-editorMarkerNavigationWarning-headerBackground: rgba(
|
||||
204,
|
||||
167,
|
||||
0,
|
||||
0.1
|
||||
);
|
||||
--vscode-editorOverviewRuler-addedForeground: rgba(72, 126, 2, 0.6);
|
||||
--vscode-editorOverviewRuler-border: rgba(127, 127, 127, 0.3);
|
||||
--vscode-editorOverviewRuler-bracketMatchForeground: #a0a0a0;
|
||||
--vscode-editorOverviewRuler-commonContentForeground: rgba(96, 96, 96, 0.4);
|
||||
--vscode-editorOverviewRuler-currentContentForeground: rgba(
|
||||
64,
|
||||
200,
|
||||
174,
|
||||
0.5
|
||||
);
|
||||
--vscode-editorOverviewRuler-deletedForeground: rgba(241, 76, 76, 0.6);
|
||||
--vscode-editorOverviewRuler-errorForeground: rgba(255, 18, 18, 0.7);
|
||||
--vscode-editorOverviewRuler-findMatchForeground: rgba(209, 134, 22, 0.49);
|
||||
--vscode-editorOverviewRuler-incomingContentForeground: rgba(
|
||||
64,
|
||||
166,
|
||||
255,
|
||||
0.5
|
||||
);
|
||||
--vscode-editorOverviewRuler-infoForeground: #3794ff;
|
||||
--vscode-editorOverviewRuler-modifiedForeground: rgba(27, 129, 168, 0.6);
|
||||
--vscode-editorOverviewRuler-rangeHighlightForeground: rgba(0, 122, 204, 0.6);
|
||||
--vscode-editorOverviewRuler-selectionHighlightForeground: rgba(
|
||||
160,
|
||||
160,
|
||||
160,
|
||||
0.8
|
||||
);
|
||||
--vscode-editorOverviewRuler-warningForeground: #cca700;
|
||||
--vscode-editorOverviewRuler-wordHighlightForeground: rgba(
|
||||
160,
|
||||
160,
|
||||
160,
|
||||
0.8
|
||||
);
|
||||
--vscode-editorOverviewRuler-wordHighlightStrongForeground: rgba(
|
||||
192,
|
||||
160,
|
||||
192,
|
||||
0.8
|
||||
);
|
||||
--vscode-editorPane-background: #1e1e1e;
|
||||
--vscode-editorRuler-foreground: #5a5a5a;
|
||||
--vscode-editorStickyScroll-background: #1e1e1e;
|
||||
--vscode-editorStickyScrollHover-background: #2a2d2e;
|
||||
--vscode-editorSuggestWidget-background: #252526;
|
||||
--vscode-editorSuggestWidget-border: #454545;
|
||||
--vscode-editorSuggestWidget-focusHighlightForeground: #2aaaff;
|
||||
--vscode-editorSuggestWidget-foreground: #d4d4d4;
|
||||
--vscode-editorSuggestWidget-highlightForeground: #2aaaff;
|
||||
--vscode-editorSuggestWidget-selectedBackground: #04395e;
|
||||
--vscode-editorSuggestWidget-selectedForeground: #ffffff;
|
||||
--vscode-editorSuggestWidget-selectedIconForeground: #ffffff;
|
||||
--vscode-editorSuggestWidgetStatus-foreground: rgba(212, 212, 212, 0.5);
|
||||
--vscode-editorUnicodeHighlight-background: rgba(189, 155, 3, 0.15);
|
||||
--vscode-editorUnicodeHighlight-border: #bd9b03;
|
||||
--vscode-editorUnnecessaryCode-opacity: rgba(0, 0, 0, 0.67);
|
||||
--vscode-editorWarning-foreground: #cca700;
|
||||
--vscode-editorWhitespace-foreground: rgba(227, 228, 226, 0.16);
|
||||
--vscode-editorWidget-background: #252526;
|
||||
--vscode-editorWidget-border: #454545;
|
||||
--vscode-editorWidget-foreground: #cccccc;
|
||||
--vscode-errorForeground: #f48771;
|
||||
--vscode-extensionBadge-remoteBackground: #007acc;
|
||||
--vscode-extensionBadge-remoteForeground: #ffffff;
|
||||
--vscode-extensionButton-prominentBackground: #0e639c;
|
||||
--vscode-extensionButton-prominentForeground: #ffffff;
|
||||
--vscode-extensionButton-prominentHoverBackground: #1177bb;
|
||||
--vscode-extensionIcon-preReleaseForeground: #1d9271;
|
||||
--vscode-extensionIcon-sponsorForeground: #d758b3;
|
||||
--vscode-extensionIcon-starForeground: #ff8e00;
|
||||
--vscode-extensionIcon-verifiedForeground: #3794ff;
|
||||
--vscode-focusBorder: #007fd4;
|
||||
--vscode-gitDecoration-addedResourceForeground: #81b88b;
|
||||
--vscode-gitDecoration-conflictingResourceForeground: #e4676b;
|
||||
--vscode-gitDecoration-deletedResourceForeground: #c74e39;
|
||||
--vscode-gitDecoration-ignoredResourceForeground: #8c8c8c;
|
||||
--vscode-gitDecoration-modifiedResourceForeground: #e2c08d;
|
||||
--vscode-gitDecoration-renamedResourceForeground: #73c991;
|
||||
--vscode-gitDecoration-stageDeletedResourceForeground: #c74e39;
|
||||
--vscode-gitDecoration-stageModifiedResourceForeground: #e2c08d;
|
||||
--vscode-gitDecoration-submoduleResourceForeground: #8db9e2;
|
||||
--vscode-gitDecoration-untrackedResourceForeground: #73c991;
|
||||
--vscode-icon-foreground: #c5c5c5;
|
||||
--vscode-input-background: #3c3c3c;
|
||||
--vscode-input-foreground: #cccccc;
|
||||
--vscode-input-placeholderForeground: #a6a6a6;
|
||||
--vscode-inputOption-activeBackground: rgba(0, 127, 212, 0.4);
|
||||
--vscode-inputOption-activeBorder: rgba(0, 122, 204, 0);
|
||||
--vscode-inputOption-activeForeground: #ffffff;
|
||||
--vscode-inputOption-hoverBackground: rgba(90, 93, 94, 0.5);
|
||||
--vscode-inputValidation-errorBackground: #5a1d1d;
|
||||
--vscode-inputValidation-errorBorder: #be1100;
|
||||
--vscode-inputValidation-infoBackground: #063b49;
|
||||
--vscode-inputValidation-infoBorder: #007acc;
|
||||
--vscode-inputValidation-warningBackground: #352a05;
|
||||
--vscode-inputValidation-warningBorder: #b89500;
|
||||
--vscode-interactive-activeCodeBorder: #3794ff;
|
||||
--vscode-interactive-inactiveCodeBorder: #37373d;
|
||||
--vscode-keybindingLabel-background: rgba(128, 128, 128, 0.17);
|
||||
--vscode-keybindingLabel-border: rgba(51, 51, 51, 0.6);
|
||||
--vscode-keybindingLabel-bottomBorder: rgba(68, 68, 68, 0.6);
|
||||
--vscode-keybindingLabel-foreground: #cccccc;
|
||||
--vscode-keybindingTable-headerBackground: rgba(204, 204, 204, 0.04);
|
||||
--vscode-keybindingTable-rowsBackground: rgba(204, 204, 204, 0.04);
|
||||
--vscode-list-activeSelectionBackground: #04395e;
|
||||
--vscode-list-activeSelectionForeground: #ffffff;
|
||||
--vscode-list-activeSelectionIconForeground: #ffffff;
|
||||
--vscode-list-deemphasizedForeground: #8c8c8c;
|
||||
--vscode-list-dropBackground: #383b3d;
|
||||
--vscode-list-errorForeground: #f88070;
|
||||
--vscode-list-filterMatchBackground: rgba(234, 92, 0, 0.33);
|
||||
--vscode-list-focusHighlightForeground: #2aaaff;
|
||||
--vscode-list-focusOutline: #007fd4;
|
||||
--vscode-list-highlightForeground: #2aaaff;
|
||||
--vscode-list-hoverBackground: #2a2d2e;
|
||||
--vscode-list-inactiveSelectionBackground: #37373d;
|
||||
--vscode-list-invalidItemForeground: #b89500;
|
||||
--vscode-list-warningForeground: #cca700;
|
||||
--vscode-listFilterWidget-background: #252526;
|
||||
--vscode-listFilterWidget-noMatchesOutline: #be1100;
|
||||
--vscode-listFilterWidget-outline: rgba(0, 0, 0, 0);
|
||||
--vscode-listFilterWidget-shadow: rgba(0, 0, 0, 0.36);
|
||||
--vscode-menu-background: #303031;
|
||||
--vscode-menu-foreground: #cccccc;
|
||||
--vscode-menu-selectionBackground: #04395e;
|
||||
--vscode-menu-selectionForeground: #ffffff;
|
||||
--vscode-menu-separatorBackground: #606060;
|
||||
--vscode-menubar-selectionBackground: rgba(90, 93, 94, 0.31);
|
||||
--vscode-menubar-selectionForeground: #cccccc;
|
||||
--vscode-merge-commonContentBackground: rgba(96, 96, 96, 0.16);
|
||||
--vscode-merge-commonHeaderBackground: rgba(96, 96, 96, 0.4);
|
||||
--vscode-merge-currentContentBackground: rgba(64, 200, 174, 0.2);
|
||||
--vscode-merge-currentHeaderBackground: rgba(64, 200, 174, 0.5);
|
||||
--vscode-merge-incomingContentBackground: rgba(64, 166, 255, 0.2);
|
||||
--vscode-merge-incomingHeaderBackground: rgba(64, 166, 255, 0.5);
|
||||
--vscode-mergeEditor-change\.background: rgba(155, 185, 85, 0.2);
|
||||
--vscode-mergeEditor-change\.word\.background: rgba(156, 204, 44, 0.2);
|
||||
--vscode-mergeEditor-conflict\.handledFocused\.border: rgba(
|
||||
193,
|
||||
193,
|
||||
193,
|
||||
0.8
|
||||
);
|
||||
--vscode-mergeEditor-conflict\.handledUnfocused\.border: rgba(
|
||||
134,
|
||||
134,
|
||||
134,
|
||||
0.29
|
||||
);
|
||||
--vscode-mergeEditor-conflict\.handled\.minimapOverViewRuler: rgba(
|
||||
173,
|
||||
172,
|
||||
168,
|
||||
0.93
|
||||
);
|
||||
--vscode-mergeEditor-conflict\.unhandledFocused\.border: #ffa600;
|
||||
--vscode-mergeEditor-conflict\.unhandledUnfocused\.border: rgba(
|
||||
255,
|
||||
166,
|
||||
0,
|
||||
0.48
|
||||
);
|
||||
--vscode-mergeEditor-conflict\.unhandled\.minimapOverViewRuler: #fcba03;
|
||||
--vscode-mergeEditor-conflictingLines\.background: rgba(255, 234, 0, 0.28);
|
||||
--vscode-minimap-errorHighlight: rgba(255, 18, 18, 0.7);
|
||||
--vscode-minimap-findMatchHighlight: #d18616;
|
||||
--vscode-minimap-foregroundOpacity: #000000;
|
||||
--vscode-minimap-selectionHighlight: #264f78;
|
||||
--vscode-minimap-selectionOccurrenceHighlight: #676767;
|
||||
--vscode-minimap-warningHighlight: #cca700;
|
||||
--vscode-minimapGutter-addedBackground: #487e02;
|
||||
--vscode-minimapGutter-deletedBackground: #f14c4c;
|
||||
--vscode-minimapGutter-modifiedBackground: #1b81a8;
|
||||
--vscode-minimapSlider-activeBackground: rgba(191, 191, 191, 0.2);
|
||||
--vscode-minimapSlider-background: rgba(121, 121, 121, 0.2);
|
||||
--vscode-minimapSlider-hoverBackground: rgba(100, 100, 100, 0.35);
|
||||
--vscode-notebook-cellBorderColor: #37373d;
|
||||
--vscode-notebook-cellEditorBackground: #252526;
|
||||
--vscode-notebook-cellInsertionIndicator: #007fd4;
|
||||
--vscode-notebook-cellStatusBarItemHoverBackground: rgba(255, 255, 255, 0.15);
|
||||
--vscode-notebook-cellToolbarSeparator: rgba(128, 128, 128, 0.35);
|
||||
--vscode-notebook-editorBackground: #1e1e1e;
|
||||
--vscode-notebook-focusedCellBorder: #007fd4;
|
||||
--vscode-notebook-focusedEditorBorder: #007fd4;
|
||||
--vscode-notebook-inactiveFocusedCellBorder: #37373d;
|
||||
--vscode-notebook-selectedCellBackground: #37373d;
|
||||
--vscode-notebook-selectedCellBorder: #37373d;
|
||||
--vscode-notebook-symbolHighlightBackground: rgba(255, 255, 255, 0.04);
|
||||
--vscode-notebookScrollbarSlider-activeBackground: rgba(191, 191, 191, 0.4);
|
||||
--vscode-notebookScrollbarSlider-background: rgba(121, 121, 121, 0.4);
|
||||
--vscode-notebookScrollbarSlider-hoverBackground: rgba(100, 100, 100, 0.7);
|
||||
--vscode-notebookStatusErrorIcon-foreground: #f48771;
|
||||
--vscode-notebookStatusRunningIcon-foreground: #cccccc;
|
||||
--vscode-notebookStatusSuccessIcon-foreground: #89d185;
|
||||
--vscode-notificationCenterHeader-background: #303031;
|
||||
--vscode-notificationLink-foreground: #3794ff;
|
||||
--vscode-notifications-background: #252526;
|
||||
--vscode-notifications-border: #303031;
|
||||
--vscode-notifications-foreground: #cccccc;
|
||||
--vscode-notificationsErrorIcon-foreground: #f14c4c;
|
||||
--vscode-notificationsInfoIcon-foreground: #3794ff;
|
||||
--vscode-notificationsWarningIcon-foreground: #cca700;
|
||||
--vscode-panel-background: #1e1e1e;
|
||||
--vscode-panel-border: rgba(128, 128, 128, 0.35);
|
||||
--vscode-panel-dropBorder: #e7e7e7;
|
||||
--vscode-panelSection-border: rgba(128, 128, 128, 0.35);
|
||||
--vscode-panelSection-dropBackground: rgba(83, 89, 93, 0.5);
|
||||
--vscode-panelSectionHeader-background: rgba(128, 128, 128, 0.2);
|
||||
--vscode-panelTitle-activeBorder: #e7e7e7;
|
||||
--vscode-panelTitle-activeForeground: #e7e7e7;
|
||||
--vscode-panelTitle-inactiveForeground: rgba(231, 231, 231, 0.6);
|
||||
--vscode-peekView-border: #3794ff;
|
||||
--vscode-peekViewEditor-background: #001f33;
|
||||
--vscode-peekViewEditor-matchHighlightBackground: rgba(255, 143, 0, 0.6);
|
||||
--vscode-peekViewEditorGutter-background: #001f33;
|
||||
--vscode-peekViewResult-background: #252526;
|
||||
--vscode-peekViewResult-fileForeground: #ffffff;
|
||||
--vscode-peekViewResult-lineForeground: #bbbbbb;
|
||||
--vscode-peekViewResult-matchHighlightBackground: rgba(234, 92, 0, 0.3);
|
||||
--vscode-peekViewResult-selectionBackground: rgba(51, 153, 255, 0.2);
|
||||
--vscode-peekViewResult-selectionForeground: #ffffff;
|
||||
--vscode-peekViewTitle-background: rgba(55, 148, 255, 0.1);
|
||||
--vscode-peekViewTitleDescription-foreground: rgba(204, 204, 204, 0.7);
|
||||
--vscode-peekViewTitleLabel-foreground: #ffffff;
|
||||
--vscode-pickerGroup-border: #3f3f46;
|
||||
--vscode-pickerGroup-foreground: #3794ff;
|
||||
--vscode-ports-iconRunningProcessForeground: #369432;
|
||||
--vscode-problemsErrorIcon-foreground: #f14c4c;
|
||||
--vscode-problemsInfoIcon-foreground: #3794ff;
|
||||
--vscode-problemsWarningIcon-foreground: #cca700;
|
||||
--vscode-progressBar-background: #0e70c0;
|
||||
--vscode-quickInput-background: #252526;
|
||||
--vscode-quickInput-foreground: #cccccc;
|
||||
--vscode-quickInputList-focusBackground: #04395e;
|
||||
--vscode-quickInputList-focusForeground: #ffffff;
|
||||
--vscode-quickInputList-focusIconForeground: #ffffff;
|
||||
--vscode-quickInputTitle-background: rgba(255, 255, 255, 0.1);
|
||||
--vscode-sash-hoverBorder: #007fd4;
|
||||
--vscode-scm-providerBorder: #454545;
|
||||
--vscode-scrollbar-shadow: #000000;
|
||||
--vscode-scrollbarSlider-activeBackground: rgba(191, 191, 191, 0.4);
|
||||
--vscode-scrollbarSlider-background: rgba(121, 121, 121, 0.4);
|
||||
--vscode-scrollbarSlider-hoverBackground: rgba(100, 100, 100, 0.7);
|
||||
--vscode-searchEditor-findMatchBackground: rgba(234, 92, 0, 0.22);
|
||||
--vscode-settings-checkboxBackground: #3c3c3c;
|
||||
--vscode-settings-checkboxBorder: #3c3c3c;
|
||||
--vscode-settings-checkboxForeground: #f0f0f0;
|
||||
--vscode-settings-dropdownBackground: #3c3c3c;
|
||||
--vscode-settings-dropdownBorder: #3c3c3c;
|
||||
--vscode-settings-dropdownForeground: #f0f0f0;
|
||||
--vscode-settings-dropdownListBorder: #454545;
|
||||
--vscode-settings-focusedRowBackground: rgba(42, 45, 46, 0.6);
|
||||
--vscode-settings-focusedRowBorder: rgba(255, 255, 255, 0.12);
|
||||
--vscode-settings-headerBorder: rgba(128, 128, 128, 0.35);
|
||||
--vscode-settings-headerForeground: #e7e7e7;
|
||||
--vscode-settings-modifiedItemIndicator: #0c7d9d;
|
||||
--vscode-settings-numberInputBackground: #3c3c3c;
|
||||
--vscode-settings-numberInputForeground: #cccccc;
|
||||
--vscode-settings-rowHoverBackground: rgba(42, 45, 46, 0.3);
|
||||
--vscode-settings-sashBorder: rgba(128, 128, 128, 0.35);
|
||||
--vscode-settings-textInputBackground: #3c3c3c;
|
||||
--vscode-settings-textInputForeground: #cccccc;
|
||||
--vscode-sideBar-background: #252526;
|
||||
--vscode-sideBar-dropBackground: rgba(83, 89, 93, 0.5);
|
||||
--vscode-sideBarSectionHeader-background: rgba(0, 0, 0, 0);
|
||||
--vscode-sideBarSectionHeader-border: rgba(204, 204, 204, 0.2);
|
||||
--vscode-sideBarTitle-foreground: #bbbbbb;
|
||||
--vscode-sideBySideEditor-horizontalBorder: #444444;
|
||||
--vscode-sideBySideEditor-verticalBorder: #444444;
|
||||
--vscode-statusBar-background: #007acc;
|
||||
--vscode-statusBar-debuggingBackground: #cc6633;
|
||||
--vscode-statusBar-debuggingForeground: #ffffff;
|
||||
--vscode-statusBar-focusBorder: #ffffff;
|
||||
--vscode-statusBar-foreground: #ffffff;
|
||||
--vscode-statusBar-noFolderBackground: #68217a;
|
||||
--vscode-statusBar-noFolderForeground: #ffffff;
|
||||
--vscode-statusBarItem-activeBackground: rgba(255, 255, 255, 0.18);
|
||||
--vscode-statusBarItem-compactHoverBackground: rgba(255, 255, 255, 0.2);
|
||||
--vscode-statusBarItem-errorBackground: #c72e0f;
|
||||
--vscode-statusBarItem-errorForeground: #ffffff;
|
||||
--vscode-statusBarItem-focusBorder: #ffffff;
|
||||
--vscode-statusBarItem-hoverBackground: rgba(255, 255, 255, 0.12);
|
||||
--vscode-statusBarItem-prominentBackground: rgba(0, 0, 0, 0.5);
|
||||
--vscode-statusBarItem-prominentForeground: #ffffff;
|
||||
--vscode-statusBarItem-prominentHoverBackground: rgba(0, 0, 0, 0.3);
|
||||
--vscode-statusBarItem-remoteBackground: #16825d;
|
||||
--vscode-statusBarItem-remoteForeground: #ffffff;
|
||||
--vscode-statusBarItem-warningBackground: #7a6400;
|
||||
--vscode-statusBarItem-warningForeground: #ffffff;
|
||||
--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-tab-activeBackground: #1e1e1e;
|
||||
--vscode-tab-activeForeground: #ffffff;
|
||||
--vscode-tab-activeModifiedBorder: #3399cc;
|
||||
--vscode-tab-border: #252526;
|
||||
--vscode-tab-inactiveBackground: #2d2d2d;
|
||||
--vscode-tab-inactiveForeground: rgba(255, 255, 255, 0.5);
|
||||
--vscode-tab-inactiveModifiedBorder: rgba(51, 153, 204, 0.5);
|
||||
--vscode-tab-lastPinnedBorder: rgba(204, 204, 204, 0.2);
|
||||
--vscode-tab-unfocusedActiveBackground: #1e1e1e;
|
||||
--vscode-tab-unfocusedActiveForeground: rgba(255, 255, 255, 0.5);
|
||||
--vscode-tab-unfocusedActiveModifiedBorder: rgba(51, 153, 204, 0.5);
|
||||
--vscode-tab-unfocusedInactiveBackground: #2d2d2d;
|
||||
--vscode-tab-unfocusedInactiveForeground: rgba(255, 255, 255, 0.25);
|
||||
--vscode-tab-unfocusedInactiveModifiedBorder: rgba(51, 153, 204, 0.25);
|
||||
--vscode-terminal-ansiBlack: #000000;
|
||||
--vscode-terminal-ansiBlue: #2472c8;
|
||||
--vscode-terminal-ansiBrightBlack: #666666;
|
||||
--vscode-terminal-ansiBrightBlue: #3b8eea;
|
||||
--vscode-terminal-ansiBrightCyan: #29b8db;
|
||||
--vscode-terminal-ansiBrightGreen: #23d18b;
|
||||
--vscode-terminal-ansiBrightMagenta: #d670d6;
|
||||
--vscode-terminal-ansiBrightRed: #f14c4c;
|
||||
--vscode-terminal-ansiBrightWhite: #e5e5e5;
|
||||
--vscode-terminal-ansiBrightYellow: #f5f543;
|
||||
--vscode-terminal-ansiCyan: #11a8cd;
|
||||
--vscode-terminal-ansiGreen: #0dbc79;
|
||||
--vscode-terminal-ansiMagenta: #bc3fbc;
|
||||
--vscode-terminal-ansiRed: #cd3131;
|
||||
--vscode-terminal-ansiWhite: #e5e5e5;
|
||||
--vscode-terminal-ansiYellow: #e5e510;
|
||||
--vscode-terminal-border: rgba(128, 128, 128, 0.35);
|
||||
--vscode-terminal-dropBackground: rgba(83, 89, 93, 0.5);
|
||||
--vscode-terminal-findMatchBackground: #515c6a;
|
||||
--vscode-terminal-findMatchHighlightBackground: rgba(234, 92, 0, 0.33);
|
||||
--vscode-terminal-foreground: #cccccc;
|
||||
--vscode-terminal-inactiveSelectionBackground: #3a3d41;
|
||||
--vscode-terminal-selectionBackground: #264f78;
|
||||
--vscode-terminalCommandDecoration-defaultBackground: rgba(
|
||||
255,
|
||||
255,
|
||||
255,
|
||||
0.25
|
||||
);
|
||||
--vscode-terminalCommandDecoration-errorBackground: #f14c4c;
|
||||
--vscode-terminalCommandDecoration-successBackground: #1b81a8;
|
||||
--vscode-terminalOverviewRuler-cursorForeground: rgba(160, 160, 160, 0.8);
|
||||
--vscode-terminalOverviewRuler-findMatchForeground: rgba(209, 134, 22, 0.49);
|
||||
--vscode-testing-iconErrored: #f14c4c;
|
||||
--vscode-testing-iconFailed: #f14c4c;
|
||||
--vscode-testing-iconPassed: #73c991;
|
||||
--vscode-testing-iconQueued: #cca700;
|
||||
--vscode-testing-iconSkipped: #848484;
|
||||
--vscode-testing-iconUnset: #848484;
|
||||
--vscode-testing-message\.error\.decorationForeground: #f14c4c;
|
||||
--vscode-testing-message\.error\.lineBackground: rgba(255, 0, 0, 0.2);
|
||||
--vscode-testing-message\.info\.decorationForeground: rgba(
|
||||
212,
|
||||
212,
|
||||
212,
|
||||
0.5
|
||||
);
|
||||
--vscode-testing-peekBorder: #f14c4c;
|
||||
--vscode-testing-peekHeaderBackground: rgba(241, 76, 76, 0.1);
|
||||
--vscode-testing-runAction: #73c991;
|
||||
--vscode-textBlockQuote-background: rgba(127, 127, 127, 0.1);
|
||||
--vscode-textBlockQuote-border: rgba(0, 122, 204, 0.5);
|
||||
--vscode-textCodeBlock-background: rgba(10, 10, 10, 0.4);
|
||||
--vscode-textLink-activeForeground: #3794ff;
|
||||
--vscode-textLink-foreground: #3794ff;
|
||||
--vscode-textPreformat-foreground: #d7ba7d;
|
||||
--vscode-textSeparator-foreground: rgba(255, 255, 255, 0.18);
|
||||
--vscode-titleBar-activeBackground: #3c3c3c;
|
||||
--vscode-titleBar-activeForeground: #cccccc;
|
||||
--vscode-titleBar-inactiveBackground: rgba(60, 60, 60, 0.6);
|
||||
--vscode-titleBar-inactiveForeground: rgba(204, 204, 204, 0.6);
|
||||
--vscode-toolbar-activeBackground: rgba(99, 102, 103, 0.31);
|
||||
--vscode-toolbar-hoverBackground: rgba(90, 93, 94, 0.31);
|
||||
--vscode-tree-indentGuidesStroke: #585858;
|
||||
--vscode-tree-tableColumnsBorder: rgba(204, 204, 204, 0.13);
|
||||
--vscode-tree-tableOddRowsBackground: rgba(204, 204, 204, 0.04);
|
||||
--vscode-welcomePage-progress\.background: #3c3c3c;
|
||||
--vscode-welcomePage-progress\.foreground: #3794ff;
|
||||
--vscode-welcomePage-tileBackground: #252526;
|
||||
--vscode-welcomePage-tileHoverBackground: #2c2c2d;
|
||||
--vscode-welcomePage-tileShadow: rgba(0, 0, 0, 0.36);
|
||||
--vscode-widget-shadow: rgba(0, 0, 0, 0.36);
|
||||
}
|
||||
@@ -0,0 +1,22 @@
|
||||
#!/usr/bin/env node
|
||||
|
||||
const rewire = require("rewire");
|
||||
const defaults = rewire("react-scripts/scripts/build.js");
|
||||
const config = defaults.__get__("config");
|
||||
|
||||
// Disable code splitting
|
||||
config.optimization.splitChunks = {
|
||||
cacheGroups: {
|
||||
default: false,
|
||||
},
|
||||
};
|
||||
|
||||
// Disable code chunks
|
||||
config.optimization.runtimeChunk = false;
|
||||
|
||||
// Rename main.{hash}.js to main.js
|
||||
config.output.filename = "static/js/[name].js";
|
||||
|
||||
// Rename main.{hash}.css to main.css
|
||||
config.plugins[5].options.filename = "static/css/[name].css";
|
||||
config.plugins[5].options.moduleFilename = () => "static/css/main.css";
|
||||
@@ -0,0 +1,160 @@
|
||||
import { makeVisualizationsWithId } from "@nand2tetris/components/chips/visualizations.js";
|
||||
import { Clockface } from "@nand2tetris/components/clockface.js";
|
||||
import { FullPinout } from "@nand2tetris/components/pinout.js";
|
||||
import { useChipPageStore } from "@nand2tetris/components/stores/chip.store.js";
|
||||
import * as Not from "@nand2tetris/projects/project_01/01_not.js";
|
||||
import { VSCodeButton, VSCodeCheckbox } from "@vscode/webview-ui-toolkit/react";
|
||||
import {
|
||||
ReactNode,
|
||||
useCallback,
|
||||
useContext,
|
||||
useEffect,
|
||||
useMemo,
|
||||
useState,
|
||||
} from "react";
|
||||
import { VSCodeContext } from "./vscode";
|
||||
|
||||
function App() {
|
||||
const { state, actions, dispatch } = useChipPageStore();
|
||||
const { api } = useContext(VSCodeContext);
|
||||
|
||||
const [hdl, setHdl] = useState(Not.hdl);
|
||||
const [loaded, setLoaded] = useState(false);
|
||||
|
||||
const compile = useCallback(
|
||||
async (hdl: string) => {
|
||||
setHdl(hdl);
|
||||
await actions.updateFiles({ hdl, tst: "// No test", cmp: "" });
|
||||
},
|
||||
[setHdl, actions],
|
||||
);
|
||||
|
||||
const onMessage = useCallback(
|
||||
(
|
||||
event: MessageEvent<
|
||||
Partial<{ nand2tetris: boolean; hdl: string; chipName: string }>
|
||||
>,
|
||||
) => {
|
||||
if (!event.data?.nand2tetris) return;
|
||||
if (event.data.hdl) compile(event.data.hdl ?? "");
|
||||
if (event.data.chipName)
|
||||
dispatch.current({
|
||||
action: "updateChip",
|
||||
payload: {
|
||||
chipName: event.data.chipName,
|
||||
},
|
||||
});
|
||||
setLoaded(true);
|
||||
},
|
||||
[compile, dispatch],
|
||||
);
|
||||
|
||||
useEffect(() => {
|
||||
window.addEventListener("message", onMessage);
|
||||
return () => {
|
||||
window.removeEventListener("message", onMessage);
|
||||
};
|
||||
}, [onMessage]);
|
||||
|
||||
useEffect(() => {
|
||||
api.postMessage({ nand2tetris: true, ready: true });
|
||||
}, [api]);
|
||||
|
||||
const [useBuiltin, setUseBuiltin] = useState(false);
|
||||
const toggleUseBuiltin = async () => {
|
||||
if (useBuiltin) {
|
||||
compile(hdl);
|
||||
setUseBuiltin(false);
|
||||
} else {
|
||||
actions.toggleBuiltin();
|
||||
setUseBuiltin(true);
|
||||
}
|
||||
};
|
||||
|
||||
const clockActions = useMemo(
|
||||
() => ({
|
||||
toggle() {
|
||||
actions.clock();
|
||||
},
|
||||
reset() {
|
||||
actions.reset();
|
||||
},
|
||||
}),
|
||||
[actions],
|
||||
);
|
||||
|
||||
const chipButtons = state.controls.error ? (
|
||||
<p>{state.controls.error?.message}</p>
|
||||
) : (
|
||||
<>
|
||||
<VSCodeCheckbox onChange={toggleUseBuiltin}>Use Builtin</VSCodeCheckbox>
|
||||
<fieldset role="group">
|
||||
<VSCodeButton
|
||||
onClick={actions.eval}
|
||||
onKeyDown={actions.eval}
|
||||
disabled={!state.sim.pending}
|
||||
>
|
||||
Eval
|
||||
</VSCodeButton>
|
||||
<VSCodeButton
|
||||
onClick={clockActions.toggle}
|
||||
style={{ maxWidth: "initial" }}
|
||||
disabled={!state.sim.clocked}
|
||||
>
|
||||
Clock:{"\u00a0"}
|
||||
<Clockface />
|
||||
</VSCodeButton>
|
||||
<VSCodeButton
|
||||
onClick={clockActions.reset}
|
||||
style={{ maxWidth: "initial" }}
|
||||
disabled={!state.sim.clocked}
|
||||
>
|
||||
Reset
|
||||
</VSCodeButton>
|
||||
</fieldset>
|
||||
</>
|
||||
);
|
||||
|
||||
const visualizations: [string, ReactNode][] = makeVisualizationsWithId({
|
||||
parts: state.sim.chip,
|
||||
});
|
||||
|
||||
const pinsPanel = (
|
||||
<>
|
||||
<h3>Chip {state.controls.chipName}</h3>
|
||||
{chipButtons}
|
||||
{state.sim.invalid ? (
|
||||
<p>Invalid Chip</p>
|
||||
) : (
|
||||
<>
|
||||
<FullPinout
|
||||
sim={state.sim}
|
||||
toggle={actions.toggle}
|
||||
setInputValid={() => {
|
||||
console.log("TODO: Handle Input Valid");
|
||||
}}
|
||||
/>
|
||||
<h4>Visualizations</h4>
|
||||
{visualizations.length > 0 ? (
|
||||
visualizations.map(([p, v]) => <div key={p}>{v}</div>)
|
||||
) : (
|
||||
<p>None</p>
|
||||
)}
|
||||
</>
|
||||
)}
|
||||
{/* DEBUG */}
|
||||
<textarea style={{ display: "none" }}>{hdl}</textarea>
|
||||
</>
|
||||
);
|
||||
|
||||
return loaded ? (
|
||||
pinsPanel
|
||||
) : (
|
||||
<>
|
||||
<h3>HDL</h3>
|
||||
<p>Open an HDL chip to begin</p>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
export default App;
|
||||
@@ -0,0 +1,47 @@
|
||||
import {
|
||||
FileSystem,
|
||||
ObjectFileSystemAdapter,
|
||||
} from "@davidsouther/jiffies/lib/esm/fs.js";
|
||||
import { useDialog } from "@nand2tetris/components/dialog";
|
||||
import { BaseContext } from "@nand2tetris/components/stores/base.context.js";
|
||||
import * as Not from "@nand2tetris/projects/project_01/01_not.js";
|
||||
import React from "react";
|
||||
import ReactDOM from "react-dom/client";
|
||||
import App from "./App";
|
||||
import { StatusSeverity } from "@nand2tetris/components/stores/base.context";
|
||||
|
||||
const baseContext: BaseContext = {
|
||||
fs: new FileSystem(
|
||||
new ObjectFileSystemAdapter({ "projects/01/Not.hdl": Not.hdl }),
|
||||
),
|
||||
canUpgradeFs: false,
|
||||
async upgradeFs() {},
|
||||
closeFs() {},
|
||||
storage: {},
|
||||
status: { message: "", severity: "INFO" },
|
||||
setStatus: (status: string | { message: string; severity?: StatusSeverity }): void => {
|
||||
// api.postMessage({ nand2tetris: true, showMessage: status });
|
||||
if (typeof status === "string") {
|
||||
console.log(status);
|
||||
} else {
|
||||
console.log(`${status.severity}: ${status.message}`);
|
||||
}
|
||||
|
||||
},
|
||||
permissionPrompt: {} as ReturnType<typeof useDialog>,
|
||||
// eslint-disable-next-line @typescript-eslint/no-empty-function
|
||||
async requestPermission() {},
|
||||
// eslint-disable-next-line @typescript-eslint/no-empty-function
|
||||
loadFs() {},
|
||||
};
|
||||
|
||||
const root = ReactDOM.createRoot(
|
||||
document.getElementById("root") as HTMLElement,
|
||||
);
|
||||
root.render(
|
||||
<React.StrictMode>
|
||||
<BaseContext.Provider value={baseContext}>
|
||||
<App />
|
||||
</BaseContext.Provider>
|
||||
</React.StrictMode>,
|
||||
);
|
||||
@@ -0,0 +1 @@
|
||||
/// <reference types="react-scripts" />
|
||||
@@ -0,0 +1,5 @@
|
||||
// jest-dom adds custom jest matchers for asserting on DOM nodes.
|
||||
// allows you to do things like:
|
||||
// expect(element).toHaveTextContent(/react/i)
|
||||
// learn more: https://github.com/testing-library/jest-dom
|
||||
import "@testing-library/jest-dom";
|
||||
@@ -0,0 +1,6 @@
|
||||
import { createContext } from "react";
|
||||
import type { WebviewApi } from "vscode-webview";
|
||||
|
||||
const api: WebviewApi<unknown> = acquireVsCodeApi?.();
|
||||
|
||||
export const VSCodeContext = createContext({ api });
|
||||
@@ -0,0 +1,9 @@
|
||||
{
|
||||
"extends": "../../../tsconfig.base.json",
|
||||
"compilerOptions": {
|
||||
"baseUrl": ".",
|
||||
"outDir": "build",
|
||||
"rootDir": "src"
|
||||
},
|
||||
"include": ["src"]
|
||||
}
|
||||
Reference in New Issue
Block a user