Skip to content

Commit b54f72a

Browse files
SarxzerSarxzer
committed
Implement syntax highlighting and minor UI adjustments
This commit introduces Prism.js for syntax highlighting in code blocks, enhancing readability. Minor modifications have been made to the user interface in the index.css and index.html files. The index.js file has been updated to incorporate these changes.
1 parent 04703af commit b54f72a

File tree

5 files changed

+28
-9
lines changed

5 files changed

+28
-9
lines changed

‎src/index.css

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -29,11 +29,12 @@ pre, code {
2929
margin: 1rem;
3030
}
3131

32-
#generatedCode {
32+
#output {
3333
height: 50%;
34-
background-color: rgb(247, 240, 228);
3534
}
3635

37-
#output {
38-
height: 50%;
36+
.copy-to-clipboard-button {
37+
margin: 0.5rem;
38+
margin-top: 0.5rem;
39+
padding: 0.5rem;
3940
}

‎src/index.html

Lines changed: 3 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -3,23 +3,21 @@
33
<head>
44
<meta charset="utf-8" />
55
<title>CC Lua Code Generator</title>
6-
<script src="index.js"></script>
6+
<link rel="stylesheet" href="prism.css" />
77
</head>
88
<body>
99
<div id="pageContainer">
1010
<div id="outputPane">
11-
<pre id="generatedCode"><code></code></pre>
12-
<div id="output"></div>
13-
<button onclick="navigator.clipboard.writeText(document.getElementById(`generatedCode`).firstChild.innerText)">Copy</button>
11+
<pre id="generatedCode" style="min-height: 600px;"><code class="language-lua"></code></pre>
1412
<input type="text" name="fileName" id="fileName" value="program">
1513
<button id="downloadButton">Download</button>
1614
<button id="uploadButton">Upload to Pastebin</button>
1715
<button id="uploadWorkspaceButton">Upload Workspace to Pastebin</button>
1816
<button id="loadWorkspaceButton">Load Workspace from Pastebin</button>
1917
<button id="loadButton">Load</button>
20-
2118
</div>
2219
<div id="blocklyDiv"></div>
2320
</div>
21+
<script src="prism.js"></script>
2422
</body>
2523
</html>

‎src/index.js

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,8 @@ import { luaGenerator } from "blockly/lua";
55
import { save, load } from "./serialization";
66
import { toolbox } from "./toolbox";
77
import "./index.css";
8+
import "./prism";
9+
import "./prism.css";
810

911
import {shadowBlockConversionChangeListener} from '@blockly/shadow-block-converter';
1012

‎src/prism.css

Lines changed: 7 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

0 commit comments

Comments
 (0)